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

Материал из МК14 | Space Station 14 Wiki
Нет описания правки
м (hotfix)
 
(не показано 9 промежуточных версий этого же участника)
Строка 1: Строка 1:
<div style="
<div style="
  border-left: 8px solid {{{color|#5E1A8B}}};
   background-color: #191d25;
   background-color: #191d25;
   padding: 0.6rem 1rem 0.6rem calc(1rem + 8px);
  color: #ddd;
   padding: 0.6rem 1rem;
   margin: 0.5em 0;
   margin: 0.5em 0;
   border-radius: 0.25rem;
   border-radius: 0.25rem;
Строка 9: Строка 11:
   box-sizing: border-box;
   box-sizing: border-box;
   font-family: inherit;
   font-family: inherit;
  position: relative;
  overflow: hidden;
">
">
   <div style="
   <div style="
     position: absolute;
     font-weight: bold;
     top: 0;
     font-size: 1em;
     left: 0;
     margin-bottom: 0.3rem;
    height: 100%;
     background-color: {{{color|#5E1A8B}}}33;  
    width: 8px;
     color: #fff;
     background-color: {{{color|#5E1A8B}}};
    margin-left: -1rem;
     opacity: 0.8;
    margin-right: -1rem;
  "></div>
    margin-top: -0.6rem;
  <div style="
    padding-left: 1rem;
     display: flex;
    padding-right: 1rem;
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
     display: flex;  
     align-items: center;
     align-items: center;
    gap: 12px;
    margin-bottom: 0.3rem;
   ">
   ">
    <div style="font-weight: bold; font-size: 1em; flex-grow: 1; color: {{{color|#5E1A8B}}};">{{{title|}}}</div>
     {{#ifeq: {{{icon|}}} | Circle
     {{#ifeq: {{{icon|}}} | Circle
       | <div style="flex-shrink: 0;">[[File:Circle.png|96px]]</div>
       | <div style="flex-shrink: 0; margin-right: 0.5rem;">[[File:Circle.png|25px|link=|left]]</div>
       | {{#ifeq: {{{icon|}}} | Triangle
       | {{#ifeq: {{{icon|}}} | Triangle
      | <div style="flex-shrink: 0;">[[File:Triangle.png|96px]]</div>
        | <div style="flex-shrink: 0; margin-right: 0.5rem;">[[File:Triangle.png|25px|link=|left]]</div>
      |  
        | {{#ifeq: {{{icon|}}} | CircleInfo
    }}
          | <div style="flex-shrink: 0; margin-right: 0.5rem;">[[File:CircleInfo.png|25px|link=|left]]</div>
          |  
          }}
        }}
     }}
     }}
    <div>{{{title|Внимание}}}</div>
   </div>
   </div>
   <p style="margin: 0; color: {{{color|#5E1A8B}}};">
   <p style="margin: 0;">
{{{info|}}}
    {{{info|Внимание}}}
   </p>
   </p>
</div>
</div>
Строка 45: Строка 49:
<pre>
<pre>
<nowiki>{{InfoBar</nowiki>
<nowiki>{{InfoBar</nowiki>
<nowiki>color=Цвет hex задней панели плашки</nowiki>
<nowiki>|color=Цвет hex задней панели плашки</nowiki>
<nowiki>title=Заголовок сверху</nowiki>
<nowiki>|title=Заголовок сверху</nowiki>
<nowiki>info=информация снизу</nowiki>
<nowiki>|icon=Triangle/Circle/CircleInfo (Может быть оставлена пустой тогда иконки не будет)</nowiki>
<nowiki>|info=информация снизу</nowiki>
<nowiki>}}</nowiki>
<nowiki>}}</nowiki>
</pre>
</pre>
[https://htmlcolorcodes.com/|Сайт для подбора цветов]
[https://htmlcolorcodes.com/|Сайт для подбора цветов]

Текущая версия от 05:44, 3 июля 2025

Внимание

Внимание

Небольшие плашки с текстом для пояснений/предупреждений Пример шаблон на странице в коде:

{{InfoBar
|color=Цвет hex задней панели плашки
|title=Заголовок сверху
|icon=Triangle/Circle/CircleInfo (Может быть оставлена пустой тогда иконки не будет)
|info=информация снизу
}}

для подбора цветов