Ma3xak2 (обсуждение | вклад) Нет описания правки |
Ma3xak2 (обсуждение | вклад) Нет описания правки |
||
| Строка 1: | Строка 1: | ||
<includeonly> | <includeonly> | ||
< | <td style=" | ||
vertical-align: top; | |||
background: #171B22; | |||
background:#171B22; | border: 1px solid #FFFFFF; | ||
border:1px solid #FFFFFF; | box-sizing: border-box; | ||
box-sizing:border-box; | overflow: hidden; | ||
overflow:hidden; | color: #FFFFFF; | ||
color:#FFFFFF; | font-family: Arial, sans-serif; | ||
font-family:Arial,sans-serif; | padding: 12px; | ||
margin: 0; | |||
"> | "> | ||
<!-- НАЗВАНИЕ --> | <!-- НАЗВАНИЕ --> | ||
<div style=" | <div style=" | ||
min-height:28px; | min-height: 28px; | ||
background:#202632; | background: #202632; | ||
display:flex; | display: flex; | ||
align-items:center; | align-items: center; | ||
justify-content:center; | justify-content: center; | ||
padding:3px 10px; | padding: 3px 10px; | ||
box-sizing:border-box; | box-sizing: border-box; | ||
border-bottom:1px solid #FFFFFF; | border-bottom: 1px solid #FFFFFF; | ||
margin: -12px -12px 12px -12px; /* компенсация отступов ячейки */ | |||
"> | "> | ||
<div style=" | <div style=" | ||
font-size:14px; | font-size: 14px; | ||
font-weight:bold; | font-weight: bold; | ||
color:#FFFFFF; | color: #FFFFFF; | ||
text-align:center; | text-align: center; | ||
line-height:18px; | line-height: 18px; | ||
">{{{title|Рецепт}}}</div> | ">{{{title|Рецепт}}}</div> | ||
</div> | </div> | ||
<!-- | <!-- ОСНОВНАЯ ЧАСТЬ: ингредиенты + метод + результат --> | ||
<div style=" | <div style=" | ||
display:flex; | display: flex; | ||
align-items: | align-items: center; | ||
justify-content: center; | |||
gap: 15px; | |||
box-sizing:border-box; | box-sizing: border-box; | ||
"> | "> | ||
<!-- | <!-- ИНГРЕДИЕНТЫ --> | ||
<div style=" | <div style=" | ||
display: | display: flex; | ||
align-items: flex-start; | |||
gap:8px; | justify-content: center; | ||
flex: | gap: 8px; | ||
flex-wrap: wrap; | |||
min-width: 0; | |||
"> | "> | ||
{{#if:{{{ingredient1_name|}}}|<div style="display:flex; flex-direction:column; align-items:center; width:70px;"> | |||
{{#if:{{{ingredient1_name|}}}| | <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|}}}| [{{{ingredient1_amount}}}]|}}</div> | |||
</div>|}} | |||
<!-- Аналогично для ingredient2_... ingredient5_... --> | |||
</div> | |||
<div style=" | |||
<div style=" | |||
</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> | ||
|}} | <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 style=" | <div style=" | ||
display:flex | display: flex; | ||
align-items: flex-start; | |||
align-items | justify-content: center; | ||
border-left: 1px solid #FFFFFF; | |||
padding-left: 15px; | |||
border-left:1px solid #FFFFFF; | |||
padding-left:15px | |||
"> | "> | ||
<div style="display:flex; flex-direction:column; align-items:center; width:75px;"> | |||
<div style=" | <div style="width:58px;height:58px;display:flex;align-items:center;justify-content:center;overflow:hidden;">[[File:{{{result_img}}}|46px]]</div> | ||
<div style="font-size:12px;color:#FFFFFF;text-align:center;margin-top:5px;line-height:16px;">{{{result_name|Результат}}}</div> | |||
<div style=" | |||
<div style=" | |||
</div> | </div> | ||
</div> | </div> | ||
</div> | </div> | ||
</ | </td> | ||
</includeonly> | </includeonly> | ||