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

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

← Предыдущая правка

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

@@ Строка 1: / Строка 1: @@
-<div class="main-menu-frame noExternal" style="background-color:{{{background-color|#3c3c4b}}}ee>{{#if: {{{external|}}}|[{{{external|https://discord.gg/corvax}}} <span class="StupidButton"></span>]|[[{{{link|MainMenuBlocks/Item}}}|<span class="StupidButton"></span>]]}}
+<templatestyles src="LinkCard/styles.css" /><div class="link-card noExternal mobile-image brightness-overlay {{#if:{{{горизонт_стиль|}}}|link-card__side}} {{#if:{{{ссылка|}}}{{{внешняя_ссылка|}}}|link-card-hover}}" style="
-<div class="main-menu-frame__image">[[файл:{{{image|BikeHorn.png}}}|64x64px|link=]]</div>
+ --bg-color:{{{фон|var(--theme-bg-color-300)}}};
-<div class="main-menu-frame__name">'''{{{name|Название}}}'''</div>
+ --alpha:{{{прозрачность|95%}}};
-</div><!--
+ --font-size:{{{размер_текста|var(--font-size-xxs)}}}
+">{{#if: {{{внешняя_ссылка|}}} | [{{{внешняя_ссылка|}}} <span class="StupidButton"></span>] | {{#if: {{{ссылка|}}} | [[{{{ссылка|}}}|<span class="StupidButton"></span>]] }} }}
--->
+<div class="link-card__image">{{{изображение|}}}</div>
-{{#css:
+{{#if: {{{название|}}} | <div class="link-card__name">{{{название}}}</div> }}{{#if: {{{пин|}}} | <div class="link-card__pin" style="position:absolute;">{{{пин}}}</div> }}
-.main-menu-frame {
+</div><noinclude>{{doc}}</noinclude>
-    display: inline-block;
-    position: relative;
-    border-radius: 0.3em;
-    transition: all 0.15s ease;
-    overflow: hidden;
-    min-width: 110px;
-    text-align: center;
-    box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.3);
-    border: 1px outset rgb(0 0 0 / 30%);
-}
-.main-menu-frame__image {
-    padding: 6px;
-}
-.main-menu-frame__name {
-    background: #00000040;
-    padding: 2px;
-    font-size: 12px;
-}
-}}<!--
---><div class="customCSS" style="display:none">
-.main-menu-frame:hover {
-    filter: brightness(105%);
-    box-shadow: 0px 6px 6px 1px rgba(0, 0, 0, 0.25);
-    transform: translateY(-4px);
-}
-</div>