Шаблон:Dungeon Crusher Wiki/Navigation/styles.css: различия между версиями
Нет описания правки |
Нет описания правки |
||
Строка 1: | Строка 1: | ||
.mainpage-navigation { | .mainpage-navigation { | ||
display: grid; | display: grid; | ||
justify-content: | justify-content: space-around; | ||
grid-gap: 1rem; | grid-gap: 1rem; | ||
grid-template-columns: repeat(6, 166px); | grid-template-columns: repeat(6, 166px); | ||
Строка 9: | Строка 9: | ||
.mainpage-navigation .card { | .mainpage-navigation .card { | ||
box-sizing: border-box; | box-sizing: border-box; | ||
border: 1px solid hsl( 203, 34%, 22% ); | |||
border-radius: 8px; | border-radius: 8px; | ||
overflow: hidden; | overflow: hidden; |
Версия от 18:24, 26 ноября 2023
.mainpage-navigation { display: grid; justify-content: space-around; grid-gap: 1rem; grid-template-columns: repeat(6, 166px); margin-bottom: 0.5rem; } .mainpage-navigation .card { box-sizing: border-box; border: 1px solid hsl( 203, 34%, 22% ); border-radius: 8px; overflow: hidden; background-color: hsl( 203, 44%, 14% ); box-shadow: 0 1px 3px rgba(0,0,0,0.03),0 1px 2px rgba(0,0,0,0.06); transition: box-shadow 0.2s ease; } .mainpage-navigation .card img { vertical-align: middle; min-width: 166px; transition: transform 0.2s cubic-bezier(0.77,0.2,0.05,1.0); } .mainpage-navigation .card:hover .card-caption { cursor: pointer; } .mainpage-navigation .card:hover .card-image a img { transform: scale(1.1); } .mainpage-navigation .card-caption { padding: 0.4rem; background: hsl( 205, 75%, 8% ); text-align: center; transition: color 0.2s ease; } .mainpage-navigation .card-caption a { color: rgba( 255, 255, 255, 0.87 ); } .mainpage-navigation .card-caption:hover { color: #7cabc9; } .mainpage-navigation .card-image { height: 180px; background-color: hsl( 205, 75%, 8% ); overflow: hidden; }