Ma3xak2 (обсуждение | вклад) Нет описания правки |
Ma3xak2 (обсуждение | вклад) Нет описания правки |
||
| (не показаны 2 промежуточные версии этого же участника) | |||
| Строка 1: | Строка 1: | ||
<includeonly> | <includeonly> | ||
<div style=" | <div style=" | ||
display:flex; | display:inline-flex; | ||
vertical-align:top; | |||
flex-direction:column; | flex-direction:column; | ||
background:#171B22; | background:#171B22; | ||
| Строка 9: | Строка 10: | ||
color:#FFFFFF; | color:#FFFFFF; | ||
font-family:Arial,sans-serif; | font-family:Arial,sans-serif; | ||
margin:4px; | |||
width:auto; | |||
max-width:350px; | |||
"> | |||
<!-- НАЗВАНИЕ --> | |||
<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:15px; | |||
padding:12px; | |||
box-sizing:border-box; | |||
flex-wrap:nowrap; | |||
"> | |||
<!-- ИНГРЕДИЕНТЫ --> | |||
<div style=" | |||
display:flex; | |||
align-items:flex-start; | |||
justify-content:center; | |||
gap:8px; | |||
flex-wrap:wrap; | |||
min-width:0; | |||
max-width:200px; | |||
"> | "> | ||
<!-- ИНГРЕДИЕНТ 1 --> | |||
{{#if:{{{ingredient1_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; | ||
align-items:center; | align-items:center; | ||
justify-content:center; | justify-content:center; | ||
overflow:hidden; | |||
">[[File:{{{ingredient1_img}}}|46px]] | |||
</div> | |||
"> | <div style=" | ||
<div style=" | font-size:12px; | ||
color:#FFFFFF; | |||
text-align:center; | |||
margin-top:5px; | |||
line-height:16px; | |||
">{{{ingredient1_name}}}{{#if:{{{ingredient1_amount|}}}| [{{{ingredient1_amount}}}]|}} | |||
">{{{ | </div> | ||
</div> | |||
|}} | |||
<!-- ИНГРЕДИЕНТ 2 --> | |||
{{#if:{{{ingredient2_name|}}}| | |||
<div style=" | |||
display:flex; | |||
flex-direction:column; | |||
align-items:center; | |||
width:70px; | |||
"> | |||
<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|}}}| [{{{ingredient2_amount}}}]|}} | |||
</div> | |||
</div> | |||
|}} | |||
<!-- ИНГРЕДИЕНТ 3 --> | |||
{{#if:{{{ingredient3_name|}}}| | |||
<div style=" | |||
display:flex; | |||
flex-direction:column; | |||
align-items:center; | |||
width:70px; | |||
"> | |||
<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|}}}| [{{{ingredient3_amount}}}]|}} | |||
</div> | |||
</div> | |||
|}} | |||
<!-- ИНГРЕДИЕНТ 4 --> | |||
{{#if:{{{ingredient4_name|}}}| | |||
<div style=" | |||
display:flex; | |||
flex-direction:column; | |||
align-items:center; | |||
width:70px; | |||
"> | |||
<div style=" | |||
width:58px; | |||
height:58px; | |||
display:flex; | |||
align-items:center; | |||
justify-content:center; | |||
overflow:hidden; | |||
">[[File:{{{ingredient4_img}}}|46px]] | |||
</div> | |||
<div style=" | |||
font-size:12px; | |||
color:#FFFFFF; | |||
text-align:center; | |||
margin-top:5px; | |||
line-height:16px; | |||
">{{{ingredient4_name}}}{{#if:{{{ingredient4_amount|}}}| [{{{ingredient4_amount}}}]|}} | |||
</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; | ||
align-items: | align-items:center; | ||
justify-content: | justify-content:center; | ||
overflow:hidden; | |||
">[[File:{{{ingredient5_img}}}|46px]] | |||
</div> | |||
"> | <div style=" | ||
font-size:12px; | |||
color:#FFFFFF; | |||
text-align:center; | |||
margin-top:5px; | |||
line-height:16px; | |||
">{{{ingredient5_name}}}{{#if:{{{ingredient5_amount|}}}| [{{{ingredient5_amount}}}]|}} | |||
</div> | |||
</div> | |||
|}} | |||
</div> | |||
<!-- СПОСОБ ПРИГОТОВЛЕНИЯ --> | |||
<div style=" | |||
display:flex; | |||
flex-direction:column; | |||
align-items:center; | |||
justify-content:center; | |||
flex-shrink:0; | |||
min-width:70px; | |||
border-left:1px solid #FFFFFF; | |||
padding-left:10px; | |||
"> | |||
<!-- АВТОМАТИЧЕСКАЯ КАРТИНКА МЕТОДА (с fallback) --> | |||
<div style=" | |||
width:60px; | |||
height:60px; | |||
display:flex; | |||
align-items:center; | |||
justify-content:center; | |||
overflow:hidden; | |||
">{{#switch:{{{method_name|}}} | |||
|Микроволновка={{#ifexist:File:Microwave.gif|[[File:Microwave.gif|60px]]|[[File:Microwave.png|60px]]}} | |||
|Смешивание={{#ifexist:File:Beaker.png|[[File:Beaker.png|60px]]|[[File:Beaker.gif|60px]]}} | |||
|Нож={{#ifexist:File:Knife.png|[[File:Knife.png|60px]]|[[File:Knife.gif|60px]]}} | |||
|Скалка={{#ifexist:File:RollingPin.png|[[File:RollingPin.png|60px]]|[[File:RollingPin.gif|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:10px; | |||
"> | |||
<div style=" | |||
display:flex; | |||
flex-direction:column; | |||
align-items:center; | |||
width:75px; | |||
"> | |||
<div style=" | <div style=" | ||
width:58px; | |||
height:58px; | |||
display:flex; | display:flex; | ||
align-items:center; | align-items:center; | ||
justify-content:center; | justify-content:center; | ||
overflow:hidden; | |||
">[[File:{{{result_img}}}|46px]] | |||
</div> | </div> | ||
<div style=" | <div style=" | ||
font-size:12px; | |||
color:#FFFFFF; | |||
text-align:center; | |||
margin-top:5px; | |||
line-height:16px; | |||
">{{{result_name|Результат}}} | |||
</div> | </div> | ||
</div> | |||
</div> | |||
</div> | |||
</div> | </div> | ||
</includeonly> | </includeonly> | ||