Шаблон:recipe

Вернуться

Строка 1: Строка 1:
<includeonly>
<includeonly>
<div style="
<div style="
     display:inline-flex;
     display:grid;
     flex-direction:column;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
     gap:12px;
     background:#171B22;
     background:#171B22;
     border:1px solid #FFFFFF;
     border:1px solid #FFFFFF;
Строка 9: Строка 10:
     color:#FFFFFF;
     color:#FFFFFF;
     font-family:Arial,sans-serif;
     font-family:Arial,sans-serif;
">
<!-- НАЗВАНИЕ -->
<div style="
    min-height:28px;
    background:#202632;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:3px 10px;
    box-sizing:border-box;
    border-bottom:1px solid #FFFFFF;
">
    <div style="
        font-size:14px;
        font-weight:bold;
        color:#FFFFFF;
        text-align:center;
        line-height:18px;
    ">{{{title|Рецепт}}}
    </div>
</div>
<!-- ОСНОВНАЯ ЧАСТЬ -->
<div style="
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:20px;
     padding:12px;
     padding:12px;
     box-sizing:border-box;
     justify-items:center;
    align-items:start;
">
">


<!-- ИНГРЕДИЕНТЫ -->
     <!-- НАЗВАНИЕ (занимает всю ширину) -->
<div style="
    display:flex;
    align-items:flex-start;
    justify-content:center;
    gap:8px;
     flex-wrap:wrap;
">
 
<!-- ИНГРЕДИЕНТ 1 -->
{{#if:{{{ingredient1_name|}}}|
<div style="
    display:flex;
    flex-direction:column;
    align-items:center;
    width:70px;
">
     <div style="
     <div style="
         width:58px;
         grid-column: 1 / -1;
         height:58px;
         min-height:28px;
        background:#202632;
         display:flex;
         display:flex;
         align-items:center;
         align-items:center;
         justify-content:center;
         justify-content:center;
         overflow:hidden;
         padding:3px 10px;
     ">[[File:{{{ingredient1_img}}}|46px]]
        box-sizing:border-box;
        border:1px solid #FFFFFF;
        width:100%;
     ">
        <div style="
            font-size:14px;
            font-weight:bold;
            color:#FFFFFF;
            text-align:center;
            line-height:18px;
        ">{{{title|Рецепт}}}</div>
     </div>
     </div>
    <!-- ИНГРЕДИЕНТ 1 -->
    {{#if:{{{ingredient1_name|}}}|
     <div style="
     <div style="
         font-size:12px;
         display:flex;
        color:#FFFFFF;
        flex-direction:column;
        text-align:center;
        align-items:center;
        margin-top:5px;
        width:100%;
        line-height:16px;
    ">
    ">{{{ingredient1_name}}}{{#if:{{{ingredient1_amount|}}}|&nbsp;[{{{ingredient1_amount}}}]|}}
        <div style="
            width:58px;
            height:58px;
            display:flex;
            align-items:center;
            justify-content:center;
            overflow:hidden;
        ">[[File:{{{ingredient1_img}}}|46px]]</div>
        <div style="
            font-size:12px;
            color:#FFFFFF;
            text-align:center;
            margin-top:5px;
            line-height:16px;
        ">{{{ingredient1_name}}}{{#if:{{{ingredient1_amount|}}}|&nbsp;[{{{ingredient1_amount}}}]|}}</div>
     </div>
     </div>
</div>
    |}}
|}}


<!-- ИНГРЕДИЕНТ 2 -->
    <!-- ИНГРЕДИЕНТ 2 -->
{{#if:{{{ingredient2_name|}}}|
    {{#if:{{{ingredient2_name|}}}|
<div style="
    display:flex;
    flex-direction:column;
    align-items:center;
    width:70px;
">
     <div style="
     <div style="
        width:58px;
        height:58px;
         display:flex;
         display:flex;
        flex-direction:column;
         align-items:center;
         align-items:center;
         justify-content:center;
         width:100%;
        overflow:hidden;
    ">
    ">[[File:{{{ingredient2_img}}}|46px]]
        <div style="
            width:58px;
            height:58px;
            display:flex;
            align-items:center;
            justify-content:center;
            overflow:hidden;
        ">[[File:{{{ingredient2_img}}}|46px]]</div>
        <div style="
            font-size:12px;
            color:#FFFFFF;
            text-align:center;
            margin-top:5px;
            line-height:16px;
        ">{{{ingredient2_name}}}{{#if:{{{ingredient2_amount|}}}|&nbsp;[{{{ingredient2_amount}}}]|}}</div>
     </div>
     </div>
    |}}
    <!-- ИНГРЕДИЕНТ 3 -->
    {{#if:{{{ingredient3_name|}}}|
     <div style="
     <div style="
         font-size:12px;
         display:flex;
        color:#FFFFFF;
        flex-direction:column;
        text-align:center;
        align-items:center;
        margin-top:5px;
        width:100%;
        line-height:16px;
    ">
    ">{{{ingredient2_name}}}{{#if:{{{ingredient2_amount|}}}|&nbsp;[{{{ingredient2_amount}}}]|}}
        <div style="
            width:58px;
            height:58px;
            display:flex;
            align-items:center;
            justify-content:center;
            overflow:hidden;
        ">[[File:{{{ingredient3_img}}}|46px]]</div>
        <div style="
            font-size:12px;
            color:#FFFFFF;
            text-align:center;
            margin-top:5px;
            line-height:16px;
        ">{{{ingredient3_name}}}{{#if:{{{ingredient3_amount|}}}|&nbsp;[{{{ingredient3_amount}}}]|}}</div>
     </div>
     </div>
</div>
    |}}
|}}


<!-- ИНГРЕДИЕНТ 3 -->
    <!-- ИНГРЕДИЕНТ 4 -->
{{#if:{{{ingredient3_name|}}}|
    {{#if:{{{ingredient4_name|}}}|
<div style="
    display:flex;
    flex-direction:column;
    align-items:center;
    width:70px;
">
     <div style="
     <div style="
        width:58px;
        height:58px;
         display:flex;
         display:flex;
        flex-direction:column;
         align-items:center;
         align-items:center;
         justify-content:center;
         width:100%;
        overflow:hidden;
    ">
    ">[[File:{{{ingredient3_img}}}|46px]]
        <div style="
    </div>
            width:58px;
    <div style="
            height:58px;
        font-size:12px;
            display:flex;
        color:#FFFFFF;
            align-items:center;
        text-align:center;
            justify-content:center;
        margin-top:5px;
            overflow:hidden;
        line-height:16px;
        ">[[File:{{{ingredient4_img}}}|46px]]</div>
    ">{{{ingredient3_name}}}{{#if:{{{ingredient3_amount|}}}|&nbsp;[{{{ingredient3_amount}}}]|}}
        <div style="
            font-size:12px;
            color:#FFFFFF;
            text-align:center;
            margin-top:5px;
            line-height:16px;
        ">{{{ingredient4_name}}}{{#if:{{{ingredient4_amount|}}}|&nbsp;[{{{ingredient4_amount}}}]|}}</div>
     </div>
     </div>
</div>
    |}}
|}}


<!-- ИНГРЕДИЕНТ 4 -->
    <!-- ИНГРЕДИЕНТ 5 -->
{{#if:{{{ingredient4_name|}}}|
    {{#if:{{{ingredient5_name|}}}|
<div style="
    display:flex;
    flex-direction:column;
    align-items:center;
    width:70px;
">
     <div style="
     <div style="
        width:58px;
        height:58px;
         display:flex;
         display:flex;
        flex-direction:column;
         align-items:center;
         align-items:center;
         justify-content:center;
         width:100%;
        overflow:hidden;
    ">
    ">[[File:{{{ingredient4_img}}}|46px]]
        <div style="
    </div>
            width:58px;
    <div style="
            height:58px;
        font-size:12px;
            display:flex;
        color:#FFFFFF;
            align-items:center;
        text-align:center;
            justify-content:center;
        margin-top:5px;
            overflow:hidden;
        line-height:16px;
        ">[[File:{{{ingredient5_img}}}|46px]]</div>
    ">{{{ingredient4_name}}}{{#if:{{{ingredient4_amount|}}}|&nbsp;[{{{ingredient4_amount}}}]|}}
        <div style="
            font-size:12px;
            color:#FFFFFF;
            text-align:center;
            margin-top:5px;
            line-height:16px;
        ">{{{ingredient5_name}}}{{#if:{{{ingredient5_amount|}}}|&nbsp;[{{{ingredient5_amount}}}]|}}</div>
     </div>
     </div>
</div>
    |}}
|}}


<!-- ИНГРЕДИЕНТ 5 -->
    <!-- СПОСОБ ПРИГОТОВЛЕНИЯ -->
{{#if:{{{ingredient5_name|}}}|
<div style="
    display:flex;
    flex-direction:column;
    align-items:center;
    width:70px;
">
     <div style="
     <div style="
        width:58px;
        height:58px;
         display:flex;
         display:flex;
        flex-direction:column;
         align-items:center;
         align-items:center;
         justify-content:center;
         width:100%;
        overflow:hidden;
    ">
    ">[[File:{{{ingredient5_img}}}|46px]]
        <div style="
    </div>
            width:60px;
    <div style="
            height:60px;
        font-size:12px;
            display:flex;
        color:#FFFFFF;
            align-items:center;
        text-align:center;
            justify-content:center;
        margin-top:5px;
            overflow:hidden;
         line-height:16px;
        ">{{#switch:{{{method_name|}}}
    ">{{{ingredient5_name}}}{{#if:{{{ingredient5_amount|}}}|&nbsp;[{{{ingredient5_amount}}}]|}}
            |Микроволновка=[[File:Microwave.gif|60px]]
            |Смешивание=[[File:Beaker.png|60px]]
            |Нож=[[File:Knife.png|60px]]
            |Скалка=[[File:RollingPin.png|60px]]
            |#default=[[File:Microwave.gif|60px]]
        }}</div>
        <div style="
            font-size:13px;
            font-weight:bold;
            line-height:17px;
            text-align:center;
            color:#FFFFFF;
            margin-top:4px;
         ">{{{method_name|Приготовление}}}{{#if:{{{method_time|}}}|<br>{{{method_time}}}|}}</div>
     </div>
     </div>
</div>
|}}
</div>
<!-- СПОСОБ ПРИГОТОВЛЕНИЯ -->
<div style="
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    min-width:80px;
    border-left:1px solid #FFFFFF;
    padding-left:15px;
">
<!-- АВТОМАТИЧЕСКАЯ КАРТИНКА МЕТОДА -->
<div style="
    width:60px;
    height:60px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
">{{#switch:{{{method_name|}}}
|Микроволновка=[[File:Microwave.gif|60px]]
|Смешивание=[[File:Beaker.png|60px]]
|Нож=[[File:Knife.png|60px]]
|Скалка=[[File:RollingPin.png|60px]]
|#default=[[File:Microwave.gif|60px]]
}}
</div>
<div style="
    font-size:13px;
    font-weight:bold;
    line-height:17px;
    text-align:center;
    color:#FFFFFF;
    margin-top:4px;
">{{{method_name|Приготовление}}}{{#if:{{{method_time|}}}|<br>{{{method_time}}}|}}
</div>
</div>


<!-- РЕЗУЛЬТАТ -->
    <!-- РЕЗУЛЬТАТ -->
<div style="
    display:flex;
    align-items:flex-start;
    justify-content:center;
    border-left:1px solid #FFFFFF;
    padding-left:15px;
">
     <div style="
     <div style="
         display:flex;
         display:flex;
         flex-direction:column;
         flex-direction:column;
         align-items:center;
         align-items:center;
         width:75px;
         width:100%;
     ">
     ">
         <div style="
         <div style="
Строка 255: Строка 212:
             justify-content:center;
             justify-content:center;
             overflow:hidden;
             overflow:hidden;
         ">[[File:{{{result_img}}}|46px]]
         ">[[File:{{{result_img}}}|46px]]</div>
        </div>
 
         <div style="
         <div style="
             font-size:12px;
             font-size:12px;
Строка 264: Строка 219:
             margin-top:5px;
             margin-top:5px;
             line-height:16px;
             line-height:16px;
         ">{{{result_name|Результат}}}
         ">{{{result_name|Результат}}}</div>
        </div>
     </div>
     </div>
</div>


</div>
</div>
</div>
</includeonly>
</includeonly>