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

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

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

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

@@ Строка 1: / Строка 1: @@
-<div class="link-card-smuggling noExternal mobile-image" tabindex="0" style="background-color:#8b8b8b28">
+<div class="link-card--smuggling" tabindex="0">
-<div class="link-card-smuggling__level">{{AttentionLevel|{{{Уровень}}}|1}}</div>
+{{LinkСard
-<div class="link-card-smuggling__image">{{#if:{{{id|}}}|[[Файл:{{{id}}}.png|64x64px|link=]]|[[файл:{{{Иконка|BikeHorn.png}}}|64x64px|link=]]}}</div>
+|image = {{#if:{{{id|}}}|{{{id}}}.png|{{{Иконка}}}}}
-<div class="link-card-smuggling__name">'''{{#if:{{{id|}}}|{{#invoke:Entity Lookup|getname|{{{id}}}}}|{{{Название}}}}}'''</div>
+|name  = {{#if:{{{id|}}}|{{#invoke:Entity Lookup|getname|{{{id}}}}}|{{{Название}}}}}
+|pin   = {{AttentionLevel|{{{Уровень}}}|1}}
+|link  =
+}}</div>
+<div class="link-card--smuggling-menu">
+<div class="link-card--smuggling-menu__header">
+<div style="padding:4px;margin-right:4px;">{{#if:{{{id|}}}|[[Файл:{{{id}}}.png|32x32px|link=|link=]]|[[файл:{{{Иконка|BikeHorn.png}}}|32x32px|link=]]}}</div>
+<div>'''{{#if:{{{id|}}}|{{#invoke:Entity Lookup|getname|{{{id}}}}}|{{{Название}}}}}'''</div>
 </div>
-<div class="link-card-smuggling-menu">
+<div class="link-card--smuggling-menu__body">
-<div class="link-card-smuggling-menu__header">
+<div class="link-card--smuggling-menu__body-level">{{AttensionLevel|{{{Уровень|default}}}}}</div><span>{{{Описание}}}</span>
-<div style="padding:4px;margin-right:4px;">{{#if:{{{id|}}}|[[Файл:{{{id}}}.png|32x32px|link=]]|[[файл:{{{Иконка|BikeHorn.png}}}|32x32px|link=]]}}</div>
-<div>'''{{#if:{{{id|}}}|{{#invoke:Entity Lookup|getname|{{{id}}}}}|{{{Название}}}}}'''</div>
 </div>
-<div class="link-card-smuggling-menu__body">
+</div><!--
-<div class="link-card-smuggling-menu__body-level">{{AttensionLevel|{{{Уровень|default}}}}}</div><span>{{{Описание}}}</span>
-</div></div>
-<!--
 -->
 {{#css:
-.link-card-smuggling {
+.link-card--smuggling {
-    display: inline-block;
-    position: relative;
-    border-radius: 0.3em;
-    transition: all 0.1s ease;
-    overflow: hidden;
-    min-width: 130px;
-    text-align: center;
-    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.35);
-    border: 1px outset rgb(0 0 0 / 30%);
      cursor: pointer;
 }
-.link-card-smuggling__level {
+.link-card--smuggling-menu {
-    position: absolute;
-    right: 4px;
-    font-size: 12px;
-}
-.link-card-smuggling__image {
-    padding: 6px;
-}
-.link-card-smuggling__name {
-    background: #00000040;
-    padding: 2px 4px;
-    font-size: 0.9em;
-    width: 100%;
-    box-sizing: border-box;
-}
-.link-card-smuggling-menu {
      overflow-y: auto;
      display: flex;
@@ Строка 68: / Строка 43: @@
 }
-.link-card-smuggling:focus-within + .link-card-smuggling-menu {
+.link-card--smuggling-menu__header {
-    visibility: visible;
-    opacity: 1;
-}
-.link-card-smuggling-menu:hover {
-    visibility: visible;
-    opacity: 1;
-}
-.link-card-smuggling-menu__header {
      display: flex;
      align-items: center;
@@ Строка 86: / Строка 51: @@
 }
-.link-card-smuggling-menu__body {
+.link-card--smuggling-menu__body {
      height: 100%;
      position: relative;
@@ Строка 94: / Строка 59: @@
 }
-.link-card-smuggling-menu__body-level {
+.link-card--smuggling-menu__body p {
-    margin-bottom: 8px;
-    background: #2c2c33;
-    padding: 4px 6px;
-    border-radius: 0.4em;
-    border: 1px solid #ffffff10;
-}
-.link-card-smuggling-menu__body p {
      margin: 0;
      margin-top: 13px;
@@ Строка 108: / Строка 65: @@
 }
-.link-card-smuggling-menu__body ul {
+.link-card--smuggling-menu__body ul {
      margin-top: 13px;
      margin-bottom: -13px;
@@ Строка 114: / Строка 71: @@
 @media (max-width: 800px) {
-     .link-card-smuggling  {
+     .link-card--smuggling  {
          display: flex;
          width: 100%;
@@ Строка 120: / Строка 77: @@
      }
-     .link-card-smuggling__name {
+     .link-card--smuggling__name {
-         background: #00000020;
+         background: #000000;
          padding: 4px 6px;
          font-size: 0.9em;
@@ Строка 128: / Строка 85: @@
      }
-     .link-card-smuggling__image {
+     .link-card--smuggling__image {
          padding: 4px;
      }
-     .link-card-smuggling-menu {
+     .link-card--smuggling-menu {
          width: 86%;
          height: 80%;
@@ Строка 139: / Строка 96: @@
 }}<!--
 --><div class="customCSS" style="display:none">
-.link-card-smuggling:hover {
+.link-card--smuggling:hover {
      filter: brightness(108%);
 }
-.link-card-smuggling-menu__body::-webkit-scrollbar {
+.link-card--smuggling-menu__body::-webkit-scrollbar {
      width: 12px;
 }
-.link-card-smuggling-menu__body::-webkit-scrollbar-track {
+.link-card--smuggling-menu__body::-webkit-scrollbar-track {
      background: #2f2f37;
 }
-.link-card-smuggling-menu__body::-webkit-scrollbar-thumb {
+.link-card--smuggling-menu__body::-webkit-scrollbar-thumb {
      background: #4b4b52;
      border: 3px solid #2f2f37;
      border-radius: 0px;
+}
+.link-card--smuggling:focus-within + .link-card--smuggling-menu {
+    visibility: visible;
+    opacity: 1;
+}
+.link-card--smuggling-menu:hover {
+    visibility: visible;
+    opacity: 1;
+}
+.link-card--smuggling-menu__body-level {
+    margin-bottom: 8px;
+    background: #2c2c33;
+    padding: 4px 6px;
+    border-radius: 0.4em;
+    border: 1px solid rgba(var(--color-lighter--rgba), var(--alpha-x));
 }
 </div>