صفحه اصلی/دسته بندی موضوعی - فراغیب
ظاهر
Esfandiari (بحث | مشارکتها) بدون خلاصۀ ویرایش |
Esfandiari (بحث | مشارکتها) بدون خلاصۀ ویرایش |
||
| خط ۵: | خط ۵: | ||
direction: rtl; | direction: rtl; | ||
margin: 40px auto; | margin: 40px auto; | ||
max-width: | max-width: 1400px; | ||
padding: 10px; | padding: 10px; | ||
font-family: tahoma, arial, sans-serif; | |||
} | } | ||
.wiki-category-grid { | .wiki-category-grid { | ||
display: grid !important; | display: grid !important; | ||
grid-template-columns: repeat(5, 1fr) !important; /* | grid-template-columns: repeat(5, 1fr) !important; /* ۵ ستونه در دسکتاپ */ | ||
gap: | gap: 20px !important; | ||
} | } | ||
. | .category-group { | ||
display: flex; | |||
flex-direction: column; | |||
text-decoration: none !important; | |||
transition: all 0.3s ease; | |||
} | |||
.main-card { | |||
background: #ffffff; | background: #ffffff; | ||
border: 1.5px solid #8ee0d8; | border: 1.5px solid #8ee0d8; | ||
border-radius: 8px; | border-radius: 8px 8px 0 0; /* فقط گوشههای بالا گرد */ | ||
padding: 15px | padding: 15px 10px; | ||
text-align: center; | text-align: center; | ||
color: #2d3748; | |||
font-weight: bold; | |||
font-size: clamp(14px, 1.2vw, 17px) !important; | |||
border-bottom: none; | |||
box-shadow: 0 2px 4px rgba(0,0,0,0.02); | box-shadow: 0 2px 4px rgba(0,0,0,0.02); | ||
} | |||
.sub-categories-list { | |||
background: #f9fdfd; | |||
border: 1.5px solid #8ee0d8; | |||
border-top: none; | |||
border-radius: 0 0 8px 8px; | |||
padding: 10px; | |||
margin: 0; | |||
list-style: none; | |||
text-align: right; | |||
flex-grow: 1; | |||
} | |||
.sub-category-item { | |||
color: #4a5568; | |||
font-size: clamp(10px, 0.9vw, 12px) !important; | |||
margin-bottom: 6px; | |||
line-height: 1.5; | |||
display: block; | |||
white-space: normal !important; /* اجازه شکستن خط برای زیردستهها */ | |||
text-align: justify; | |||
} | |||
.sub-category-item:last-child { | |||
margin-bottom: 0; | |||
} | |||
/* حالت هاور برای کل گروه */ | |||
.category-group:hover .main-card { | |||
background-color: #65c3ba; | |||
color: #ffffff; | |||
border-color: #65c3ba; | |||
} | |||
.category-group:hover .sub-categories-list { | |||
background-color: #ffffff; | |||
border-color: #65c3ba; | |||
} | |||
.category-group:hover .sub-category-item { | |||
color: #2d3748; | color: #2d3748; | ||
} | } | ||
.wiki-category- | /* تنظیمات نمایشگر موبایل و تبلت */ | ||
@media (max-width: 1024px) { | |||
.wiki-category-grid { | |||
grid-template-columns: repeat(3, 1fr) !important; | |||
} | |||
} | } | ||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
.wiki-category-grid { | .wiki-category-grid { | ||
grid-template-columns: repeat(2, 1fr) !important; | grid-template-columns: repeat(2, 1fr) !important; | ||
gap: | gap: 15px !important; | ||
} | } | ||
. | .main-card { | ||
padding: 12px | padding: 12px 5px; | ||
} | } | ||
} | } | ||
</style> | </style> | ||
<div class="wiki-category-container"> | <div class="wiki-category-container"> | ||
<div style="text-align: center; margin-bottom: 30px;"> | <div style="text-align: center; margin-bottom: 30px;"> | ||
<h2 style="color: #2c3e50; border-bottom: 2px solid #65c3ba; display: inline-block; padding-bottom: 10px; font-weight: bold; font-size: | <h2 style="color: #2c3e50; border-bottom: 2px solid #65c3ba; display: inline-block; padding-bottom: 10px; font-weight: bold; font-size: 26px;">دستهبندی موضوعی مشاغل</h2> | ||
<p style="color: #7f8c8d; font-size: | <p style="color: #7f8c8d; font-size: 15px; margin-top: 10px;">برای مشاهده کسبوکارها، حوزه فعالیت مورد نظر خود را انتخاب کنید.</p> | ||
</div> | </div> | ||
<div class="wiki-category-grid"> | <div class="wiki-category-grid"> | ||
<!-- آموزش و پرورش --> | <!-- آموزش و پرورش --> | ||
<a href="/wiki/Category:آموزش_و_پرورش" | <a href="/wiki/Category:آموزش_و_پرورش" class="category-group"> | ||
<div class=" | <div class="main-card">آموزش و پرورش</div> | ||
<ul class="sub-categories-list"> | |||
<li class="sub-category-item">مهد | |||
< | |||
</html> | </html> | ||
نسخهٔ ۶ ژوئیهٔ ۲۰۲۶، ساعت ۱۵:۴۶
دستهبندی موضوعی مشاغل
برای مشاهده کسبوکارها، حوزه فعالیت مورد نظر خود را انتخاب کنید.