دایره های کنار هم - فراغیب
ظاهر
Esfandiari (بحث | مشارکتها) بدون خلاصۀ ویرایش |
Esfandiari (بحث | مشارکتها) بدون خلاصۀ ویرایش |
||
| خط ۱: | خط ۱: | ||
<div style="display:flex; flex-direction:row; flex-wrap:wrap; gap: | <div style="display: flex; flex-direction: row; flex-wrap: wrap; gap: 15px; justify-content: center; align-items: flex-start; width: 100%; margin: 15px 0; box-sizing: border-box;"> | ||
<div style="display:flex; flex-direction:column; align-items:center; gap: | <!-- آیتم اول --> | ||
<div style="display: flex; flex-direction: column; align-items: center; gap: 8px; flex: 1 1 150px; max-width: 180px; box-sizing: border-box;"> | |||
{{کانتینرعکس دایره|تصویر={{{تصویر1|}}}}} | {{کانتینرعکس دایره|تصویر={{{تصویر1|}}}}} | ||
{{#if:{{{کپشن1|}}}| | {{#if:{{{کپشن1|}}}| | ||
<div style="display:block; font-size: | <div style="display: block; font-size: 0.95em; line-height: 1.4; text-align: center; color: #333; word-wrap: break-word; width: 100%;"> | ||
{{{کپشن1}}} | {{{کپشن1}}} | ||
</div> | </div> | ||
}} | }} | ||
</div> | </div> | ||
<div style="display:flex; flex-direction:column; align-items:center; gap: | <!-- آیتم دوم --> | ||
<div style="display: flex; flex-direction: column; align-items: center; gap: 8px; flex: 1 1 150px; max-width: 180px; box-sizing: border-box;"> | |||
{{کانتینرعکس دایره|تصویر={{{تصویر2|}}}}} | {{کانتینرعکس دایره|تصویر={{{تصویر2|}}}}} | ||
{{#if:{{{کپشن2|}}}| | {{#if:{{{کپشن2|}}}| | ||
<div style="display:block; font-size: | <div style="display: block; font-size: 0.95em; line-height: 1.4; text-align: center; color: #333; word-wrap: break-word; width: 100%;"> | ||
{{{کپشن2}}} | {{{کپشن2}}} | ||
</div> | </div> | ||
}} | }} | ||
</div> | </div> | ||
<div style="display:flex; flex-direction:column; align-items:center; gap: | <!-- آیتم سوم --> | ||
<div style="display: flex; flex-direction: column; align-items: center; gap: 8px; flex: 1 1 150px; max-width: 180px; box-sizing: border-box;"> | |||
{{کانتینرعکس دایره|تصویر={{{تصویر3|}}}}} | {{کانتینرعکس دایره|تصویر={{{تصویر3|}}}}} | ||
{{#if:{{{کپشن3|}}}| | {{#if:{{{کپشن3|}}}| | ||
<div style="display:block; font-size: | <div style="display: block; font-size: 0.95em; line-height: 1.4; text-align: center; color: #333; word-wrap: break-word; width: 100%;"> | ||
{{{کپشن3}}} | {{{کپشن3}}} | ||
</div> | </div> | ||
}} | }} | ||
</div> | </div> | ||
<div style="display:flex; flex-direction:column; align-items:center; gap: | <!-- آیتم چهارم --> | ||
<div style="display: flex; flex-content: column; flex-direction: column; align-items: center; gap: 8px; flex: 1 1 150px; max-width: 180px; box-sizing: border-box;"> | |||
{{کانتینرعکس دایره|تصویر={{{تصویر4|}}}}} | {{کانتینرعکس دایره|تصویر={{{تصویر4|}}}}} | ||
{{#if:{{{کپشن4|}}}| | {{#if:{{{کپشن4|}}}| | ||
<div style="display:block; font-size: | <div style="display: block; font-size: 0.95em; line-height: 1.4; text-align: center; color: #333; word-wrap: break-word; width: 100%;"> | ||
{{{کپشن4}}} | {{{کپشن4}}} | ||
</div> | </div> | ||
}} | }} | ||
</div> | </div> | ||
<div style="display:flex; flex-direction:column; align-items:center; gap: | <!-- آیتم پنجم --> | ||
<div style="display: flex; flex-direction: column; align-items: center; gap: 8px; flex: 1 1 150px; max-width: 180px; box-sizing: border-box;"> | |||
{{کانتینرعکس دایره|تصویر={{{تصویر5|}}}}} | {{کانتینرعکس دایره|تصویر={{{تصویر5|}}}}} | ||
{{#if:{{{کپشن5|}}}| | {{#if:{{{کپشن5|}}}| | ||
<div style="display:block; font-size: | <div style="display: block; font-size: 0.95em; line-height: 1.4; text-align: center; color: #333; word-wrap: break-word; width: 100%;"> | ||
{{{کپشن5}}} | {{{کپشن5}}} | ||
</div> | </div> | ||
}} | }} | ||