client-sites/site-27666
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

AI update: בצע שני שיפורים בדף הדמו של שרית הספרית: 1) הוסף פופ-אפ מכירה שנפתח אוטומטית כ-5 שניות אחרי כניסת המבקר לדף, ונגיש גם דר

Browse Source
This commit is contained in:
ccadmingit1
2026-08-19 19:25:40 +00:00
parent 28a1454f9e
commit a07967408a
3 changed files with 682 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+175 -45
View File
@@ -28,6 +28,7 @@
</a>
<ul class="nav-links" id="nav-links">
<li><a href="#services">שירותים</a></li>
<li><a href="#gallery">גלריה</a></li>
<li><a href="#about">עלינו</a></li>
<li><a href="#reviews">ביקורות</a></li>
<li><a href="#contact">צור קשר</a></li>
@@ -66,13 +67,9 @@
</a>
</div>
<div class="hero-visual reveal" aria-hidden="true">
<div class="hero-scissors">
<svg viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg" class="scissors-icon">
<circle cx="30" cy="90" r="18" stroke="currentColor" stroke-width="3" fill="none"/>
<circle cx="90" cy="90" r="18" stroke="currentColor" stroke-width="3" fill="none"/>
<path d="M30 72 L60 30 L90 72" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<circle cx="60" cy="50" r="4" fill="currentColor"/>
</svg>
<div class="hero-image-container">
<img src="https://images.unsplash.com/photo-1560066984-138dadb4c035?w=600&h=700&fit=crop&crop=center" alt="סלון שיער מודרני" class="hero-image" loading="eager">
<div class="hero-image-overlay"></div>
</div>
<div class="hero-decorations">
<span class="deco-dot deco-dot-1"></span>
@@ -92,63 +89,120 @@
</header>
<div class="services-grid">
<article class="service-card reveal">
<div class="service-icon">
<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
<path d="M10 38 L20 8 M20 8 L24 18 L28 8 M28 8 L38 38"/>
<path d="M14 28 H34"/>
</svg>
<div class="service-image">
<img src="https://images.unsplash.com/photo-1522337360788-8b13dee7a37e?w=400&h=250&fit=crop&crop=center" alt="תספורת נשית מקצועית" loading="lazy">
</div>
<div class="service-content">
<div class="service-icon">
<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
<path d="M10 38 L20 8 M20 8 L24 18 L28 8 M28 8 L38 38"/>
<path d="M14 28 H34"/>
</svg>
</div>
<h3>תספורות</h3>
<p>תספורת מותאמת אישית לכל סגנון ומבנה פנים. משיחת ייעוץ ועד לתוצאה מושלמת — כי כל אישה&nbsp;ייחודית.</p>
</div>
<h3>תספורות</h3>
<p>תספורת מותאמת אישית לכל סגנון ומבנה פנים. משיחת ייעוץ ועד לתוצאה מושלמת — כי כל אישה&nbsp;ייחודית.</p>
</article>
<article class="service-card reveal">
<div class="service-icon">
<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
<circle cx="24" cy="24" r="16"/>
<circle cx="24" cy="24" r="8"/>
<circle cx="24" cy="24" r="2" fill="currentColor"/>
</svg>
<div class="service-image">
<img src="https://images.unsplash.com/photo-1527799820374-dcf8d9d4a388?w=400&h=250&fit=crop&crop=center" alt="צביעת שיער מקצועית" loading="lazy">
</div>
<div class="service-content">
<div class="service-icon">
<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
<circle cx="24" cy="24" r="16"/>
<circle cx="24" cy="24" r="8"/>
<circle cx="24" cy="24" r="2" fill="currentColor"/>
</svg>
</div>
<h3>צביעות שיער</h3>
<p>מגוון טכניקות צביעה — מאומברה עדינה ועד שינוי צבע דרמטי. חומרים איכותיים&nbsp;בלבד.</p>
</div>
<h3>צביעות שיער</h3>
<p>מגוון טכניקות צביעה — מאומברה עדינה ועד שינוי צבע דרמטי. חומרים איכותיים&nbsp;בלבד.</p>
</article>
<article class="service-card reveal">
<div class="service-icon">
<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
<path d="M8 40 Q24 10 40 40"/>
<path d="M12 36 Q24 16 36 36"/>
<path d="M16 32 Q24 20 32 32"/>
</svg>
<div class="service-image">
<img src="https://images.unsplash.com/photo-1519699047748-de8e457a634e?w=400&h=250&fit=crop&crop=center" alt="החלקת שיער מקצועית" loading="lazy">
</div>
<div class="service-content">
<div class="service-icon">
<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
<path d="M8 40 Q24 10 40 40"/>
<path d="M12 36 Q24 16 36 36"/>
<path d="M16 32 Q24 20 32 32"/>
</svg>
</div>
<h3>החלקות</h3>
<p>החלקות קראטין וברזילאיות לשיער חלק, בריא וזוהר לאורך&nbsp;זמן.</p>
</div>
<h3>החלקות</h3>
<p>החלקות קראטין וברזילאיות לשיער חלק, בריא וזוהר לאורך&nbsp;זמן.</p>
</article>
<article class="service-card reveal">
<div class="service-icon">
<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
<path d="M24 8 V16 M24 32 V40"/>
<path d="M8 24 H16 M32 24 H40"/>
<circle cx="24" cy="24" r="10"/>
<path d="M24 18 V24 L28 28"/>
</svg>
<div class="service-image">
<img src="https://images.unsplash.com/photo-1487412947147-5cebf100ffc2?w=400&h=250&fit=crop&crop=center" alt="טיפולי שיער מקצועיים" loading="lazy">
</div>
<div class="service-content">
<div class="service-icon">
<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
<path d="M24 8 V16 M24 32 V40"/>
<path d="M8 24 H16 M32 24 H40"/>
<circle cx="24" cy="24" r="10"/>
<path d="M24 18 V24 L28 28"/>
</svg>
</div>
<h3>טיפולי שיער</h3>
<p>טיפולים מזינים ומשקמים לשיער פגום, יבש או צבוע. החזרת הברק&nbsp;והחיות.</p>
</div>
<h3>טיפולי שיער</h3>
<p>טיפולים מזינים ומשקמים לשיער פגום, יבש או צבוע. החזרת הברק&nbsp;והחיות.</p>
</article>
</div>
</div>
</section>
<section id="gallery" class="gallery">
<div class="container">
<header class="section-header reveal">
<span class="section-tag">העבודות שלנו</span>
<h2 class="section-title">גלריית עיצובי שיער</h2>
</header>
<div class="gallery-grid">
<div class="gallery-item gallery-item-large reveal">
<img src="https://images.unsplash.com/photo-1562322140-8baeececf3df?w=600&h=500&fit=crop&crop=center" alt="עיצוב שיער מקצועי" loading="lazy">
<div class="gallery-overlay">
<span>עיצוב וסטיילינג</span>
</div>
</div>
<div class="gallery-item reveal">
<img src="https://images.unsplash.com/photo-1605497788044-5a32c7078486?w=400&h=300&fit=crop&crop=center" alt="תספורת נשית אלגנטית" loading="lazy">
<div class="gallery-overlay">
<span>תספורת אלגנטית</span>
</div>
</div>
<div class="gallery-item reveal">
<img src="https://images.unsplash.com/photo-1522337094846-8a818192de1f?w=400&h=300&fit=crop&crop=center" alt="צביעת שיער מודרנית" loading="lazy">
<div class="gallery-overlay">
<span>צביעה מודרנית</span>
</div>
</div>
<div class="gallery-item reveal">
<img src="https://images.unsplash.com/photo-1620331311520-246422fd82f9?w=400&h=300&fit=crop&crop=center" alt="כיסא מספרה מודרני" loading="lazy">
<div class="gallery-overlay">
<span>הסטודיו שלנו</span>
</div>
</div>
<div class="gallery-item reveal">
<img src="https://images.unsplash.com/photo-1633681926022-84c23e8cb2d6?w=400&h=300&fit=crop&crop=center" alt="מוצרי טיפוח לשיער" loading="lazy">
<div class="gallery-overlay">
<span>מוצרים איכותיים</span>
</div>
</div>
</div>
</div>
</section>
<section id="about" class="about">
<div class="container">
<div class="about-layout">
<div class="about-visual reveal" aria-hidden="true">
<div class="about-visual reveal">
<div class="about-frame">
<div class="about-pattern">
<span></span><span></span><span></span>
<span></span><span></span><span></span>
<span></span><span></span><span></span>
</div>
<img src="https://images.unsplash.com/photo-1521590832167-7bcbfaa6381f?w=500&h=600&fit=crop&crop=center" alt="פנים המספרה" class="about-image" loading="lazy">
<div class="about-badge">
<span class="about-badge-number">15+</span>
<span class="about-badge-text">שנות ניסיון</span>
@@ -307,6 +361,82 @@
</div>
</footer>
<!-- Floating CTA Button -->
<button class="floating-cta" id="floating-cta" aria-label="פתיחת חלון רכישה">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
<path d="M12 2L2 7l10 5 10-5-10-5z"/>
<path d="M2 17l10 5 10-5"/>
<path d="M2 12l10 5 10-5"/>
</svg>
<span>האתר שלך מוכן!</span>
</button>
<!-- Sales Popup -->
<div class="popup-overlay" id="popup-overlay" aria-hidden="true">
<div class="popup" role="dialog" aria-modal="true" aria-labelledby="popup-title">
<button class="popup-close" id="popup-close" aria-label="סגירת חלון">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M18 6L6 18M6 6l12 12"/>
</svg>
</button>
<div class="popup-content">
<div class="popup-icon">
<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="2">
<circle cx="24" cy="24" r="20"/>
<path d="M16 24l5 5 11-11"/>
</svg>
</div>
<h2 id="popup-title" class="popup-title">האתר שלך מוכן ומחכה לך</h2>
<div class="popup-options">
<a href="#" class="popup-option popup-option-code">
<div class="popup-option-icon">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M16 18l6-6-6-6"/>
<path d="M8 6l-6 6 6 6"/>
</svg>
</div>
<div class="popup-option-content">
<h3>הורדת קוד המקור</h3>
<p>קבלת כל קבצי האתר לשימושך</p>
</div>
<svg class="popup-option-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M19 12H5M12 19l-7-7 7-7"/>
</svg>
</a>
<a href="#" class="popup-option popup-option-full">
<div class="popup-option-icon">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<rect x="2" y="3" width="20" height="14" rx="2"/>
<path d="M8 21h8M12 17v4"/>
</svg>
</div>
<div class="popup-option-content">
<h3>אחסון מלא + קוד</h3>
<p>כולל דומיין, אחסון וניהול שוטף</p>
</div>
<svg class="popup-option-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M19 12H5M12 19l-7-7 7-7"/>
</svg>
</a>
</div>
<div class="popup-warning">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"/>
<line x1="12" y1="9" x2="12" y2="13"/>
<line x1="12" y1="17" x2="12.01" y2="17"/>
</svg>
<p><strong>שימו לב:</strong> אתר הדגמה זה יימחק תוך 30 יום אם לא תתקבל רכישה או פנייה מצדכם.</p>
</div>
<div class="popup-extras">
<p>רוצים שינויים בעיצוב, עמודים נוספים או תמונות מותאמות אישית? זו אפשרות בתשלום נפרד — <a href="tel:0504001413">צרו קשר</a> ונתאים לכם הצעה.</p>
</div>
</div>
</div>
</div>
<script src="script.js"></script>
</body>
</html>