پرش به محتوا

صفحه اصلی مشاغل/دسته بندی موضوعی - فراغیب

از فراغیب
صفحه‌ای تازه حاوی «<html> <div class="faraghaib-custom-container"> <!-- بخش جستجو --> <div class="fz-search-wrapper"> <input type="text" id="categorySearch" placeholder="جستجو در دسته‌بندی‌ها..."> </div> <!-- بخش فیلترها --> <div class="fz-filter-bar"> <button class="fz-filter-btn active" onclick="filterSelection(event, 'all')">همه دسته‌بندی‌ها</button> </d...» ایجاد کرد
 
بدون خلاصۀ ویرایش
 
(۴ نسخهٔ میانیِ ایجادشده توسط همین کاربر نشان داده نشد)
خط ۱۶: خط ۱۶:
     <div id="categoryGrid" class="fz-category-grid">
     <div id="categoryGrid" class="fz-category-grid">


         <!-- کارت‌های دسته‌بندی -->
         <!-- کارت‌های دسته‌بندی با لینک‌های دقیق درخواستی شما -->
         <a href="کافه های نسیم شهر" class="fz-card all">
         <a href="کافه های نسیم شهر" class="fz-card all">
             <span class="fz-title">کافه</span>
             <span class="fz-title">کافه</span>
خط ۳۷۰: خط ۳۷۰:


         <a href="جواهر فروشی های نسیم شهر" class="fz-card all">
         <a href="جواهر فروشی های نسیم شهر" class="fz-card all">
             <span class="fz-title">جواهر فروشی (جواهرات)</span>
             <span class="fz-title">جواهرات</span>
         </a>
         </a>


خط ۵۹۳: خط ۵۹۳:
         </a>
         </a>


         <a href="سینما های نسیم شهر" class="fz-card all">
         <a href="سينما های نسیم شهر" class="fz-card all">
             <span class="fz-title">سینما</span>
             <span class="fz-title">سینما</span>
         </a>
         </a>
خط ۶۴۱: خط ۶۴۱:
     padding: 15px !important;
     padding: 15px !important;
     background: #f9f9f9 !important;
     background: #f9f9f9 !important;
     border-radius: 15px !important;
     border-radius: 12px !important;
     border: 1px solid #c9e4d5 !important;
     border: 1px solid #c9e4d5 !important;
     display: block !important;
     display: block !important;
خط ۶۵۱: خط ۶۵۱:
.fz-search-wrapper input {
.fz-search-wrapper input {
     width: 90%;
     width: 90%;
     padding: 10px 18px;
     padding: 10px 15px;
     border: 1px solid #c9e4d5;
     border: 1px solid #c9e4d5;
     border-radius: 25px;
     border-radius: 20px;
     outline: none;
     outline: none;
     font-size: 15px;
     font-size: 15px;
خط ۶۵۹: خط ۶۵۹:
     transition: 0.3s;
     transition: 0.3s;
}
}
.fz-search-wrapper input:focus { border-color: #16bd78; box-shadow: 0 0 5px rgba(22, 189, 120, 0.2); }
.fz-search-wrapper input:focus { border-color: #16bd78; }


/* استایل دکمه‌های فیلتر */
/* استایل دکمه‌های فیلتر */
.fz-filter-bar { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 20px; }
.fz-filter-bar { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 15px; }
.fz-filter-btn {
.fz-filter-btn {
     padding: 6px 18px;
     padding: 6px 18px;
خط ۶۶۹: خط ۶۶۹:
     background: #eee;
     background: #eee;
     cursor: pointer;
     cursor: pointer;
     font-size: 14px;
     font-size: 15px;
     font-family: 'IRANSans', 'IRANSansWeb', Tahoma, Arial, sans-serif !important;
     font-family: 'IRANSans', 'IRANSansWeb', Tahoma, Arial, sans-serif !important;
     transition: 0.3s;
     transition: 0.3s;
}
}
.fz-filter-btn.active { background: #16bd78 !important; color: white !important; font-weight: bold; }
.fz-filter-btn.active { background: #16bd78 !important; color: white !important; }


/* چیدمان شبکه کارت‌ها */
/* چیدمان شبکه کارت‌ها - دسکتاپ ۳ ستونه */
.fz-category-grid {
.fz-category-grid {
     display: grid !important;
     display: grid !important;
     grid-template-columns: repeat(4, 1fr) !important;
     grid-template-columns: repeat(3, 1fr) !important;
     gap: 12px !important;
     gap: 12px !important;
     width: 100% !important;
     width: 100% !important;
}
}


/* استایل کارت نهایی (تبدیل به تگ a شده است) */
/* استایل کارت */
.fz-card {
.fz-card {
     background: white !important;
     background: white !important;
     height: 42px !important;
     height: 48px !important;
     display: flex !important;
     display: flex !important;
     align-items: center !important;
     align-items: center !important;
خط ۶۹۲: خط ۶۹۲:
     padding: 0 10px !important;
     padding: 0 10px !important;
     border-radius: 8px !important;
     border-radius: 8px !important;
     box-shadow: 0 2px 5px rgba(0,0,0,0.05) !important;
     box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important;
     border-bottom: 4px solid #16bd78 !important; /* خط سبز رنگ پایین کارت‌ها */
     border-bottom: 3px solid #16bd78 !important;
     box-sizing: border-box !important;
     box-sizing: border-box !important;
     cursor: pointer;
     cursor: pointer;
     transition: all 0.2s ease;
     transition: all 0.2s ease;
    margin: 0 !important;
     text-decoration: none !important;
     text-decoration: none !important; /* حذف خط زیر لینک */
}
}


.fz-card:hover { transform: translateY(-3px); box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important; }
.fz-card:hover { transform: translateY(-3px); box-shadow: 0 4px 10px rgba(0,0,0,0.1) !important; }


/* استایل فونت داخل کارت */
/* استایل فونت داخل کارت */
.fz-title {
.fz-title {
     font-family: 'IRANSans', 'IRANSansWeb', Tahoma, Arial, sans-serif !important;
     font-family: 'IRANSans', 'IRANSansWeb', Tahoma, Arial, sans-serif !important;
     font-weight: 500 !important;
     font-weight: bold !important;
     color: #333 !important;
     color: #444 !important;
     font-size: 14px !important; /* اندازه برای خوانایی بهتر در کلمات طولانی */
     font-size: 15.4px !important;
     text-align: center;
     text-align: center;
     white-space: nowrap;
     white-space: nowrap;
     overflow: hidden;
     overflow: hidden;
     text-overflow: ellipsis;
     text-overflow: ellipsis;
    width: 100%;
}
}


/* واکنش‌گرایی موبایل */
/* واکنش‌گرایی بر اساس تعداد ستون‌ها */
@media (max-width: 992px) {
@media (max-width: 850px) {  
     .fz-category-grid { grid-template-columns: repeat(3, 1fr) !important; }
     .fz-category-grid {  
        grid-template-columns: repeat(2, 1fr) !important; /* تبلت ۲ ستونه */
    }  
}
}
@media (max-width: 768px) {
@media (max-width: 500px) {  
     .fz-category-grid { grid-template-columns: repeat(2, 1fr) !important; }
     .fz-category-grid {  
}
        grid-template-columns: repeat(1, 1fr) !important; /* موبایل تک ستونه */
@media (max-width: 480px) {
     }  
     .fz-category-grid { grid-template-columns: repeat(1, 1fr) !important; }
}
}


/* کلاس مخفی‌سازی برای فیلتر و جستجو */
.is-hidden { display: none !important; }
.is-hidden { display: none !important; }
</style>
</style>


<script>
<script>
// تابع فیلتر دسته‌بندی
function filterSelection(event, category) {
function filterSelection(event, category) {
     const cards = document.getElementsByClassName("fz-card");
     const cards = document.getElementsByClassName("fz-card");
     const buttons = document.getElementsByClassName("fz-filter-btn");
     const buttons = document.getElementsByClassName("fz-filter-btn");
   
    // حذف حالت فعال از همه دکمه‌ها
     for (let btn of buttons) btn.classList.remove("active");
     for (let btn of buttons) btn.classList.remove("active");
    // اضافه کردن حالت فعال به دکمه کلیک شده
     event.currentTarget.classList.add("active");
     event.currentTarget.classList.add("active");
    // نمایش یا عدم نمایش کارت‌ها
     for (let card of cards) {
     for (let card of cards) {
         if (category === 'all' || card.classList.contains(category)) {
         if (category === 'all' || card.classList.contains(category)) {
خط ۷۵۱: خط ۷۴۵:
}
}


// تابع جستجوی زنده
document.getElementById('categorySearch').addEventListener('keyup', function() {
document.getElementById('categorySearch').addEventListener('keyup', function() {
     const val = this.value.toLowerCase().trim();
     const val = this.value.toLowerCase().trim();
     const cards = document.getElementsByClassName("fz-card");
     const cards = document.getElementsByClassName("fz-card");
     for (let card of cards) {
     for (let card of cards) {
         const title = card.querySelector('.fz-title').innerText.toLowerCase();
         const title = card.querySelector('.fz-title').innerText.toLowerCase();

نسخهٔ کنونی تا ‏۹ اوت ۲۰۲۶، ساعت ۱۰:۵۲

کافه چاپخانه خشک شویی توتون فروش پارکینگ جوشکار طراح دکوراسیون داخلی تأمین کننده ظروف یکبار مصرف میخانه تأمین کننده تجهیزات ساختمانی تأمین کننده مواد غذایی فروشگاه محصولات چوبی تاکسی سرویس فروشگاه کرایه بازی های ویدئویی کارگاه فلزکاری فروشگاه کاغذ دیواری تعمیرگاه ابزار خرازی شرکت تأسیسات برق خدمات تعمیر یخچال خدمات شستشوی فرش فروشگاه دوربین باشگاه بردگیم خدمات خبررسانی برقکار خدمات بازاریابی اینترنتی مشاور گورستان کارخانه مواد شیمیایی کلوپ شبانه تأمین کننده لوله فروشگاه حراجی فروشگاه محصولات ارگانیک فروشگاه لوازم اینترنتی مهندسین مشاور عکاس استودیوی ضبط طراح گرافیک هم خانگی عرضه کننده محصولات پلاستیکی خدمات آسانسور استودیوی هنری پرنده فروشی دامداری فروشنده موتورسیکلت صنایع دستی فروشگاه شیشه و آینه خدمات کشاورزی فروشگاه لوازم هنری تأمین کننده سیستم های امنیتی طراحی معماری رستوران فست فود پیتزا کبابی قنادی شیرینی فروشی بستنی فروشی آبمیوه و بستنی نانوایی سوپرمارکت هایپرمارکت عمده فروشی قصابی میوه فروشی عطاری سالن زیبایی کلینیک زیبایی اسپا داروخانه بیمارستان کلینیک مطب پزشک مطب دندانپزشک آزمایشگاه پزشکی فیزیوتراپی عینک سازی فروشگاه لوازم پزشکی باشگاه ورزشی استخر باشگاه بدنسازی فروشگاه ورزشی پوشاک زنانه فروشگاه پوشاک پوشاک مردانه پوشاک کودک فروشگاه نوشت افزار کفش فروشی جواهرات فروشگاه کادو عطر و ادکلن فروشگاه لوازم آرایشی کیف و کوله فروشگاه حیوانات خانگی فروشگاه لوازم خانگی فروشگاه مبلمان پارچه فروشی گل فروشی فرش فروشی فروشگاه موبایل فروشگاه اسباب بازی فروشگاه کامپیوتر کافی نت تعمیرات موبایل لوازم برقی نمایندگی خودرو تعمیرگاه خودرو پمپ بنزین کارواش فروشگاه ابزار لوازم یدکی خودرو تعمیرات وسایل الکترونیک سازنده تأمین کننده تجهیزات صنعتی شرکت ساختمانی خیاط انبار بانک عابر بانک بیمه دفتر اسناد رسمی پست شهرداری اداره دولتی خدمات چاپ خدمات تاسیساتی آژانس تبلیغاتی مجتمع مسکونی بنگاه املاک دفتر شرکت انجمن / سازمان طراح وب سایت ارائه دهنده خدمات اینترنت ارائه دهنده خدمات مخابراتی آژانس مسافرتی ایستگاه قطار خدمات حمل و نقل مدرسه دانشگاه آموزشگاه زبان مرکز آموزشی کتابخانه کتابفروشی پارک سینما مرکز فرهنگی مرکز خرید شهربازی مزرعه مسجد محل برگزاری عروسی جاذبه های گردشگری استودیوی عکاسی