Admin/test: تفاوت میان نسخه‌ها

→ تفاوت با ویرایش قدیمی‌تر

دیداریویکی‌متن

نسخهٔ کنونی تا ‏۱۱/۴/۲۰۲۵ میلادی، ساعت ۱۶:۳۵

<!DOCTYPE html> لوح - صفحه اصلی

لوح

معرفی ویکی کسب‌وکار لوح

فروشگاه‌ها

کسب‌وکارهای فروش کالا و خدمات

کارگاه‌ها

تولیدکنندگان و صنایع کوچک

دفاتر خدماتی

خدمات مشاوره، مالی و حقوقی

رستوران‌ها و خوراک

رستوران‌ها، کافه‌ها و تهیه‌غذاها

فناوری و استارت‌آپ‌ها

نوآوری‌های دیجیتال و کسب‌وکارهای نوپا

آموزش و مهارت

مدارس، آموزشگاه‌ها و مربیان حرفه‌ای

کسب‌وکارهای ویژه

توضیح کوتاه درباره کسب‌وکار ویژه 1

توضیح کوتاه درباره کسب‌وکار ویژه 2

توضیح کوتاه درباره کسب‌وکار ویژه 3

@@ خط ۸: / خط ۸: @@
    body {margin:0; font-family: Tahoma, sans-serif; background:#f8f9fa; color:#333;}
    a {text-decoration:none; color:inherit;}
-   header {background: linear-gradient(90deg, #1f75fe, #e63946, #f1c40f); padding:15px 30px; display:flex; align-items:center; justify-content:space-between; color:#fff;}
+  /* هدر گرد و sticky */
+   header {
+    background: #87CEFA;
+    padding:10px 30px; /* کاهش ارتفاع */
+    display:flex;
+    align-items:center;
+    justify-content:space-between;
+    color:#fff;
+    position:sticky;
+    top:10px;
+    z-index:1000;
+    box-shadow:0 4px 12px rgba(0,0,0,0.2);
+    border-radius:15px;
+    margin:10px;
+  }
    header .logo {font-size:24px; font-weight:bold;}
-   header nav a {margin-left:20px; font-weight:bold;}
+   header nav a {margin-left:20px; font-weight:bold; transition:color 0.3s;}
+  header nav a:hover {color:#f1c40f;}
    section {padding:40px 20px;}
+  /* ویدیو */
    .video-intro {text-align:center; margin-bottom:50px;}
    .video-intro h2 {font-size:32px; color:#1f75fe; margin-bottom:15px;}
-   .video-intro iframe {width:100%; max-width:800px; height:450px; border-radius:10px; box-shadow:0 4px 12px rgba(0,0,0,0.2);}
+   .video-intro iframe {width:100%; max-width:800px; height:450px; border-radius:15px; box-shadow:0 6px 18px rgba(0,0,0,0.3);}
-   .categories {display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; margin-bottom:50px;}
-   .category-card {background:#fff; border-radius:12px; padding:20px; text-align:center; box-shadow:0 2px 10px rgba(0,0,0,0.1); transition:transform 0.3s, box-shadow 0.3s;}
+  /* دسته‌بندی مشاغل با رنگ‌های ترکیبی */
-   .category-card:hover {transform:translateY(-5px); box-shadow:0 6px 15px rgba(0,0,0,0.2);}
+   .categories {
-   .category-card img {width:80px; height:80px; margin-bottom:10px;}
+    display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
-   .category-card h3 {margin:10px 0 5px; color:#e63946;}
+    gap:25px; margin-bottom:50px; text-align:center;
+  }
+   .category-card {
+    background:#fff; border-radius:15px; padding:25px;
+    box-shadow:0 4px 15px rgba(0,0,0,0.15);
+    transition:transform 0.3s, box-shadow 0.3s, background 0.3s;
+    text-align:center;
+  }
+   .category-card:hover {
+    transform:translateY(-8px) scale(1.03);
+    box-shadow:0 8px 25px rgba(0,0,0,0.25);
+    background: linear-gradient(135deg,#1f75fe,#e63946,#ffd700);
+    color:#fff;
+  }
+   .category-card img {width:80px; height:80px; margin-bottom:15px;}
+   .category-card h3 {margin:10px 0 5px;}
    .category-card p {font-size:90%; color:#555;}
+  /* کسب‌وکارهای ویژه */
    .featured {margin-bottom:50px;}
-   .featured h2 {text-align:right; color:#f1c40f; margin-bottom:20px;}
+   .featured h2 {text-align:right; color:#f1c40f; margin-bottom:25px;}
-   .featured-list {display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px;}
+   .featured-list {display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:25px;}
-   .featured-item {background:#fff; border-radius:12px; padding:15px; box-shadow:0 2px 10px rgba(0,0,0,0.1);}
+   .featured-item {
-   .featured-item img {width:100%; height:140px; object-fit:cover; border-radius:8px; margin-bottom:10px;}
+    background:#fff; border-radius:15px; padding:20px;
-   footer {background:#1f75fe; color:#fff; padding:30px 20px;}
+    box-shadow:0 4px 15px rgba(0,0,0,0.15);
-  footer .footer-content {display:flex; flex-wrap:wrap; justify-content:space-between; gap:20px;}
+    transition:transform 0.3s, box-shadow 0.3s;
-   footer .contact, footer .symbols {flex:1; min-width:200px;}
+    text-align:center;
-  footer h3 {margin-bottom:10px; color:#f1c40f;}
+  }
-   footer p, footer a {font-size:90%; color:#fff;}
+  .featured-item:hover {
-   footer a:hover {text-decoration:underline;}
+    transform:translateY(-5px) scale(1.02);
+    box-shadow:0 8px 20px rgba(0,0,0,0.25);
+  }
+   .featured-item img {width:100%; height:150px; object-fit:cover; border-radius:12px; margin-bottom:10px;}
+  /* فوتر اختصاصی */
+   .custom-footer {
+    background: #1f75fe;
+    color:#fff;
+    padding:30px 20px;
+    text-align:center;
+    border-radius:15px;
+    margin:30px 10px;
+  }
+   .custom-footer h3 {margin-bottom:15px; color:#ffd700;}
+   .custom-footer p {margin:5px 0;}
+  .custom-footer a {color:#ffd700; margin:0 10px;}
+   .custom-footer a:hover {color:#ff4500;}
 </style>
 </head>
 <body>
-<!-- هدر -->
+<!-- هدر گرد و sticky -->
 <header>
    <div class="logo">لوح</div>
@@ خط ۵۰: / خط ۱۰۳: @@
 <section class="video-intro">
    <h2>معرفی ویکی کسب‌وکار لوح</h2>
-   <iframe src="https://www.aparat.com/video/video/embed/videohash/XYZ123" frameborder="0" allowfullscreen></iframe>
+   <iframe src="https://www.aparat.com/video/video/embed/videohash/xyz456" frameborder="0" allowfullscreen></iframe>
 </section>
-<!-- بخش دسته‌بندی مشاغل -->
+<!-- دسته‌بندی مشاغل با آیکون‌های آنلاین -->
 <section class="categories">
    <div class="category-card">
-     <img src="Store.png" alt="فروشگاه‌ها">
+     <img src="https://img.icons8.com/color/96/000000/shop.png" alt="فروشگاه‌ها">
      <h3>فروشگاه‌ها</h3>
      <p>کسب‌وکارهای فروش کالا و خدمات</p>
    </div>
    <div class="category-card">
-     <img src="Workshop.png" alt="کارگاه‌ها">
+     <img src="https://img.icons8.com/color/96/000000/factory.png" alt="کارگاه‌ها">
      <h3>کارگاه‌ها</h3>
      <p>تولیدکنندگان و صنایع کوچک</p>
    </div>
    <div class="category-card">
-     <img src="Office.png" alt="دفاتر خدماتی">
+     <img src="https://img.icons8.com/color/96/000000/briefcase.png" alt="دفاتر خدماتی">
      <h3>دفاتر خدماتی</h3>
      <p>خدمات مشاوره، مالی و حقوقی</p>
    </div>
    <div class="category-card">
-     <img src="Restaurant.png" alt="رستوران‌ها">
+     <img src="https://img.icons8.com/color/96/000000/restaurant.png" alt="رستوران‌ها">
      <h3>رستوران‌ها و خوراک</h3>
      <p>رستوران‌ها، کافه‌ها و تهیه‌غذاها</p>
    </div>
    <div class="category-card">
-     <img src="Tech.png" alt="فناوری">
+     <img src="https://img.icons8.com/color/96/000000/laptop.png" alt="فناوری">
      <h3>فناوری و استارت‌آپ‌ها</h3>
      <p>نوآوری‌های دیجیتال و کسب‌وکارهای نوپا</p>
    </div>
    <div class="category-card">
-     <img src="Education.png" alt="آموزش">
+     <img src="https://img.icons8.com/color/96/000000/school.png" alt="آموزش">
      <h3>آموزش و مهارت</h3>
      <p>مدارس، آموزشگاه‌ها و مربیان حرفه‌ای</p>
@@ خط ۸۷: / خط ۱۴۰: @@
 </section>
-<!-- بخش کسب‌وکارهای خاص -->
+<!-- کسب‌وکارهای ویژه با تصویر/آیکون پیش‌فرض -->
 <section class="featured">
    <h2>کسب‌وکارهای ویژه</h2>
    <div class="featured-list">
      <div class="featured-item">
-       <img src="Featured1.jpg" alt="کسب‌وکار ویژه 1">
+       <img src="https://img.icons8.com/color/150/000000/business.png" alt="کسب‌وکار ویژه 1">
        <p>توضیح کوتاه درباره کسب‌وکار ویژه 1</p>
      </div>
      <div class="featured-item">
-       <img src="Featured2.jpg" alt="کسب‌وکار ویژه 2">
+       <img src="https://img.icons8.com/color/150/000000/business.png" alt="کسب‌وکار ویژه 2">
        <p>توضیح کوتاه درباره کسب‌وکار ویژه 2</p>
      </div>
      <div class="featured-item">
-       <img src="Featured3.jpg" alt="کسب‌وکار ویژه 3">
+       <img src="https://img.icons8.com/color/150/000000/business.png" alt="کسب‌وکار ویژه 3">
        <p>توضیح کوتاه درباره کسب‌وکار ویژه 3</p>
      </div>
@@ خط ۱۰۶: / خط ۱۵۹: @@
 </section>
-<!-- فوتر -->
+<!-- فوتر اختصاصی بعد کسب‌وکارهای ویژه -->
-<footer>
+<section class="custom-footer">
-  <div class="footer-content">
+  <h3>راه‌های ارتباطی</h3>
-    <div class="contact">
+  <p>تلفن: ۰۲۱-۱۲۳۴۵۶۷۸</p>
-      <h3>تماس با ما</h3>
+  <p>آدرس: تهران، خیابان مثال، پلاک ۱۰</p>
-      <p>آدرس: تهران، خیابان مثال، پلاک ۱۲۳</p>
+  <p>
-      <p>تلفن: ۰۲۱-۱۲۳۴۵۶۷۸</p>
+     <a href="#">اینستاگرام</a> |
-      <p>ایمیل: info@lohwiki.ir</p>
+    <a href="#">تلگرام</a> |
-    </div>
+    <a href="#">واتس‌اپ</a>
-     <div class="symbols">
+  </p>
-      <h3>نمادها</h3>
+</section>
-      <p><img src="enamad.png" alt="نماد اعتماد" width="80"></p>
-      <p><img src="samandehi.png" alt="ساماندهی" width="80"></p>
+<!-- فوتر ویکی — بدون تغییر -->
-    </div>
-  </div>
-</footer>
 </body>
 </html>