Шаблон:LinkСard: различия между версиями
Материал из Space Station 14 Вики
Pok (обсуждение | вклад) мНет описания правки |
Pok (обсуждение | вклад) мНет описания правки |
||
| (не показано 75 промежуточных версий этого же участника) | |||
| Строка 1: | Строка 1: | ||
<div class=" | <div class="link-card noExternal mobile-image brightness-overlay {{#if:{{{SideStyle|}}}|link-card__side}}" style="--background-color:{{{background-color|#383845{{{transparency|f0}}}}}}> {{#if:{{{external|}}} | [{{{external|}}} <span class="StupidButton"></span>] | {{#if:{{{link|}}} | [[{{{link|}}}|<span class="StupidButton"></span>]] }} }} | ||
<div class="link-card__image">[[Файл:{{{image|BikeHorn.png}}}|64x64px|link=]]</div> | |||
<div class="link-card__name">'''{{{name|Название}}}'''</div> | |||
</div> | |||
<!-- | |||
-->{{#css: | -->{{#css: | ||
. | .link-card { | ||
display: inline-block; | |||
position: relative; | position: relative; | ||
min-width: 110px; | |||
text-align: center; | |||
border: 1px outset rgb(0 0 0 / 30%); | |||
border-radius: 0.3em; | |||
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.35); | |||
overflow: hidden; | |||
background: var(--background-color); | |||
transition: all 0.15s ease; | |||
} | |||
.link-card__image { | |||
position: relative; | |||
padding: 6px; | |||
} | |||
.link-card__name { | |||
position: relative; | |||
width: 100%; | |||
padding: 2px 4px; | |||
font-size: 0.8em; | |||
box-sizing: border-box; | |||
background: #00000040; | |||
} | |||
@media (min-width: 800px) { | |||
.link-card:not(.link-card__side):hover { | |||
box-shadow: 0px 4px 4px 1px rgba(0, 0, 0, 0.25); | |||
transform: translateY(-4px); | |||
} | |||
} | |||
@media (max-width: 800px) { | |||
.link-card { | |||
display: flex; | |||
box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.35); | |||
width: 100%; | |||
text-align: left; | |||
} | |||
.link-card__name { | |||
background: #00000020; | |||
padding: 4px 8px; | |||
font-size: 0.9em; | |||
display: flex; | |||
align-items: center; | |||
} | |||
.link-card__image { | |||
padding: 4px; | |||
} | |||
} | |||
.link-card__side { | |||
display: flex ; | |||
box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.35); | |||
width: 100%; | |||
text-align: left; | |||
} | |||
.link-card__side .link-card__name { | |||
background: #00000020; | |||
padding: 4px 8px; | |||
font-size: 0.9em; | |||
display: flex; | display: flex; | ||
align-items: center; | align-items: center; | ||
} | } | ||
. | .link-card__side .link-card__image { | ||
padding: 4px; | |||
padding: | |||
} | } | ||
- | .link-card__side img { | ||
width: 32px; | |||
height: 32px; | |||
} | } | ||
}} | |||
Текущая версия от 21:17, 17 января 2025
Название
