Шаблон:ModernButton/Vertical: различия между версиями

Интерактивная навигация по истории

Следующая правка →

ВизуальныйВики-текст

@@ Строка 1: / Строка 1: @@
-<div class="modern-button noExternal brightness-overlay" style="--background-color:{{{background-color|#3d3d49}}}>{{#if:{{{external|}}} | [{{{external|}}} <span class="StupidButton"></span>] | {{#if:{{{link|}}} | [[{{{link|}}}|<span class="StupidButton"></span>]] }} }}
+{{ModernButton|class=modern-button--vertical
-<div class="modern-button__image">[[File:{{{img|mousegif.gif}}}|{{{pixel|128x128px}}}]]</div>
+|link       = {{{link|Правила сервера (Corvax)}}}
-<div class="modern-button__content"><span class="modern-button__title">{{{text|Мышь-Пышь}}}</span>{{#if:{{{subtext|Самая прожорливая мышь на вики}}}|<em class="modern-button__subtext">{{{subtext|Самая прожорливая мышь на вики}}}</em>}}
+|img        = {{{img|AME_F.gif}}}
-</div></div><!--
+|text       = {{{text|Правила сервера}}}
+|subtext    = {{{subtext|Ключ к приятному игровому опыту.}}}
+}}<!--
 -->{{#css:
-.modern-button {
+.modern-button--vertical.modern-button {
-    position: relative;
+     flex-direction: column;
-    display: table;
-    min-height: 64px;
-    border-radius: 8px;
-    overflow: hidden;
-    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2);
-    transition: all 0.1s ease;
-}
-.modern-button__image {
-     position: relative;
-    display: flex;
-    align-items: center;
-    padding: 4px;
-    box-shadow: inset 20px 0px 20px 0px rgba(0, 0, 0, 0.05);
 }
-.modern-button__content {
+.modern-button--vertical .modern-button__image {
-    position: relative;
-    display: flex;
-    flex-direction: column;
      justify-content: center;
-    gap: 2px;
-    width: 100%;
-    padding: 8px 10px;
-    background: #00000037;
-}
-.modern-button__title {
-    font-size: 1.8em;
-    line-height: 1;
-    font-family: "Oswald";
-    text-align: center;
-}
-.modern-button__subtext {
-    font-size: 1em;
 }
 }}