AI update: שדרוג ויזואלי מקיף לאתר עמוס רוזמרין - מהנדס אריזה:
## 1. תמונות אמיתיות (הוסף מ-Unsplash/Pexels CDN): ### Hero Sectio
This commit is contained in:
+134
-7
@@ -14,6 +14,15 @@
|
||||
<body>
|
||||
<a href="#main-content" class="skip-link">דלג לתוכן הראשי</a>
|
||||
|
||||
<div class="particles-container" aria-hidden="true">
|
||||
<div class="particle"></div>
|
||||
<div class="particle"></div>
|
||||
<div class="particle"></div>
|
||||
<div class="particle"></div>
|
||||
<div class="particle"></div>
|
||||
<div class="particle"></div>
|
||||
</div>
|
||||
|
||||
<header class="site-header">
|
||||
<div class="header-container">
|
||||
<a href="index.html" class="logo">
|
||||
@@ -45,8 +54,11 @@
|
||||
<main id="main-content">
|
||||
<section class="page-hero">
|
||||
<div class="container">
|
||||
<span class="section-tag reveal-fade">אודות</span>
|
||||
<h1 class="page-title reveal-fade">הסיפור שלי</h1>
|
||||
<span class="section-tag reveal-fade">
|
||||
<span class="tag-icon">◈</span>
|
||||
אודות
|
||||
</span>
|
||||
<h1 class="page-title reveal-fade gradient-text">הסיפור שלי</h1>
|
||||
<p class="page-subtitle reveal-fade">למעלה מ-18 שנות ניסיון בפיתוח פתרונות אריזה לתעשייה הישראלית</p>
|
||||
</div>
|
||||
</section>
|
||||
@@ -55,17 +67,38 @@
|
||||
<div class="container">
|
||||
<div class="about-grid">
|
||||
<div class="about-story">
|
||||
<div class="about-profile-section reveal-fade">
|
||||
<div class="profile-image-wrapper">
|
||||
<img
|
||||
src="https://images.unsplash.com/photo-1560250097-0b93528c311a?auto=format&fit=crop&w=400&q=80"
|
||||
alt="תמונת פרופיל מקצועית"
|
||||
class="profile-image"
|
||||
loading="lazy"
|
||||
>
|
||||
<div class="profile-decoration"></div>
|
||||
</div>
|
||||
<div class="profile-info">
|
||||
<h2 class="gradient-text">עמוס רוזמרין</h2>
|
||||
<p class="profile-title">מהנדס ייצור | מומחה אריזות</p>
|
||||
<div class="profile-badges">
|
||||
<span class="profile-badge">???? 18+ שנות ניסיון</span>
|
||||
<span class="profile-badge">???? מומחה אריזה גמישה</span>
|
||||
<span class="profile-badge">???? שותפויות בינלאומיות</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="story-block reveal-fade">
|
||||
<h2>מהנדס ייצור עצמאי מאז 2006</h2>
|
||||
<h3>מהנדס ייצור עצמאי מאז 2006</h3>
|
||||
<p>שמי עמוס רוזמרין, ואני מהנדס ייצור עצמאי המתמחה בפיתוח, התאמה ושיפור פתרונות אריזה גמישה וקופסאות קרטון לתעשיות המזון והחקלאות, ההיגיינה, הקוסמטיקה וחומרי הניקוי.</p>
|
||||
</div>
|
||||
<div class="story-block reveal-fade">
|
||||
<h2>הגישה שלי</h2>
|
||||
<h3>הגישה שלי</h3>
|
||||
<p>המשימה שלי היא להבטיח אריזה אמינה, יעילה וחסכונית — המשמרת את איכות המוצר, עומדת בתקנים ומותאמת לקו הייצור שלכם.</p>
|
||||
<p>אני פועל בשקיפות, דיוק ושירות אישי, עם דגש על איכות תהליך, צמצום תקלות וקיצור זמני הגעה לשוק.</p>
|
||||
</div>
|
||||
<div class="story-block reveal-fade">
|
||||
<h2>שיתוף פעולה בינלאומי</h2>
|
||||
<h3>שיתוף פעולה בינלאומי</h3>
|
||||
<p>במהלך השנים פיתחתי שיתופי פעולה הדוקים עם יצרנים טורקיים מובילים, המאפשרים לי להציע מחירים תחרותיים ואיכות גבוהה ללקוחותיי בישראל.</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -99,23 +132,38 @@
|
||||
<h3>שירות אישי</h3>
|
||||
<p>ליווי צמוד והתאמה מדויקת לצרכים הייחודיים של כל לקוח</p>
|
||||
</div>
|
||||
<div class="value-card reveal-slide">
|
||||
<div class="value-icon" aria-hidden="true">
|
||||
<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<circle cx="24" cy="24" r="20"/>
|
||||
<path d="M16 24l6 6 10-12"/>
|
||||
</svg>
|
||||
</div>
|
||||
<h3>מקצועיות</h3>
|
||||
<p>ידע טכני מעמיק וניסיון רב שנים בתעשייה</p>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="cta-section" aria-labelledby="about-cta-heading">
|
||||
<div class="cta-bg" aria-hidden="true">
|
||||
<div class="cta-gradient-orb cta-orb-1"></div>
|
||||
<div class="cta-gradient-orb cta-orb-2"></div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="cta-content reveal-fade">
|
||||
<h2 id="about-cta-heading" class="cta-title">בואו נדבר על הפרויקט שלכם</h2>
|
||||
<h2 id="about-cta-heading" class="cta-title gradient-text">בואו נדבר על הפרויקט שלכם</h2>
|
||||
<p class="cta-desc">אשמח לשמוע על הצרכים שלכם ולהציע פתרון אריזה מותאם</p>
|
||||
<a href="contact.html" class="btn btn-primary btn-large">בואו נדבר</a>
|
||||
<a href="contact.html" class="btn btn-primary btn-large btn-glow">בואו נדבר</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer class="site-footer">
|
||||
<div class="footer-glow" aria-hidden="true"></div>
|
||||
<div class="container">
|
||||
<div class="footer-grid">
|
||||
<div class="footer-brand">
|
||||
@@ -149,5 +197,84 @@
|
||||
</footer>
|
||||
|
||||
<script src="script.js"></script>
|
||||
<style>
|
||||
.about-profile-section {
|
||||
display: flex;
|
||||
gap: var(--space-lg);
|
||||
align-items: center;
|
||||
margin-block-end: var(--space-xl);
|
||||
padding: var(--space-lg);
|
||||
background: var(--color-glass);
|
||||
backdrop-filter: blur(10px);
|
||||
border: 1px solid var(--color-glass-border);
|
||||
border-radius: var(--radius-xl);
|
||||
}
|
||||
|
||||
.profile-image-wrapper {
|
||||
position: relative;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.profile-image {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
border-radius: 50%;
|
||||
object-fit: cover;
|
||||
border: 3px solid var(--color-accent);
|
||||
box-shadow: var(--shadow-glow);
|
||||
}
|
||||
|
||||
.profile-decoration {
|
||||
position: absolute;
|
||||
inset: -10px;
|
||||
border: 2px dashed var(--color-gold);
|
||||
border-radius: 50%;
|
||||
opacity: 0.5;
|
||||
animation: spin 20s linear infinite;
|
||||
}
|
||||
|
||||
.profile-info h2 {
|
||||
font-size: 1.75rem;
|
||||
font-weight: 600;
|
||||
margin-block-end: var(--space-xs);
|
||||
}
|
||||
|
||||
.profile-title {
|
||||
color: var(--color-text-muted);
|
||||
margin-block-end: var(--space-md);
|
||||
}
|
||||
|
||||
.profile-badges {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: var(--space-xs);
|
||||
}
|
||||
|
||||
.profile-badge {
|
||||
background: rgba(14, 165, 233, 0.15);
|
||||
color: var(--color-accent);
|
||||
padding: var(--space-xs) var(--space-sm);
|
||||
border-radius: 50px;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
.story-block h3 {
|
||||
font-size: 1.25rem;
|
||||
font-weight: 500;
|
||||
margin-block-end: var(--space-sm);
|
||||
color: var(--color-accent);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.about-profile-section {
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.profile-badges {
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user