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

AI update: שדרוג ויזואלי מקיף לאתר עמוס רוזמרין - מהנדס אריזה:

Browse Source 
## 1. תמונות אמיתיות (הוסף מ-Unsplash/Pexels CDN):

### Hero Sectio
This commit is contained in:
ccadmingit1
2026-10-11 16:57:28 +00:00
parent f3497f0671
commit c12e1c5dbd
8 changed files with 787 additions and 1177 deletions
Download Patch File Download Diff File Expand all files Collapse all files
about.html
+36 -103
View File
@@ -14,9 +14,7 @@
<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="particles-bg" aria-hidden="true">
<div class="particle"></div>
<div class="particle"></div>
<div class="particle"></div>
@@ -54,11 +52,8 @@
<main id="main-content">
<section class="page-hero">
<div class="container">
<span class="section-tag reveal-fade">
<span class="tag-icon">◈</span>
אודות
</span>
<h1 class="page-title reveal-fade gradient-text">הסיפור שלי</h1>
<span class="section-tag reveal-fade">אודות</span>
<h1 class="page-title gradient-text reveal-fade">הסיפור שלי</h1>
<p class="page-subtitle reveal-fade">למעלה מ-18 שנות ניסיון בפיתוח פתרונות אריזה לתעשייה הישראלית</p>
</div>
</section>
@@ -68,37 +63,22 @@
<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 class="profile-image-large">
<img src="https://images.unsplash.com/photo-1560250097-0b93528c311a?auto=format&fit=crop&w=600&q=80" alt="עמוס רוזמרין - מהנדס אריזה" loading="lazy">
<div class="profile-overlay"></div>
</div>
</div>
<div class="story-block reveal-fade">
<h3>מהנדס ייצור עצמאי מאז 2006</h3>
<h2>מהנדס ייצור עצמאי מאז 2006</h2>
<p>שמי עמוס רוזמרין, ואני מהנדס ייצור עצמאי המתמחה בפיתוח, התאמה ושיפור פתרונות אריזה גמישה וקופסאות קרטון לתעשיות המזון והחקלאות, ההיגיינה, הקוסמטיקה וחומרי הניקוי.</p>
</div>
<div class="story-block reveal-fade">
<h3>הגישה שלי</h3>
<h2>הגישה שלי</h2>
<p>המשימה שלי היא להבטיח אריזה אמינה, יעילה וחסכונית — המשמרת את איכות המוצר, עומדת בתקנים ומותאמת לקו הייצור שלכם.</p>
<p>אני פועל בשקיפות, דיוק ושירות אישי, עם דגש על איכות תהליך, צמצום תקלות וקיצור זמני הגעה לשוק.</p>
</div>
<div class="story-block reveal-fade">
<h3>שיתוף פעולה בינלאומי</h3>
<h2>שיתוף פעולה בינלאומי</h2>
<p>במהלך השנים פיתחתי שיתופי פעולה הדוקים עם יצרנים טורקיים מובילים, המאפשרים לי להציע מחירים תחרותיים ואיכות גבוהה ללקוחותיי בישראל.</p>
</div>
</div>
@@ -135,12 +115,13 @@
<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"/>
<path d="M12 24c0-6.627 5.373-12 12-12s12 5.373 12 12-5.373 12-12 12"/>
<path d="M24 36v8M20 40h8"/>
<path d="M24 4v4"/>
</svg>
</div>
<h3>מקצועיות</h3>
<p>ידע טכני מעמיק וניסיון רב שנים בתעשייה</p>
<h3>חדשנות</h3>
<p>מעקב אחר טכנולוגיות מתקדמות והטמעתן לטובת הלקוחות</p>
</div>
</aside>
</div>
@@ -149,12 +130,12 @@
<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 class="cta-gradient-orb"></div>
<div class="cta-gradient-orb secondary"></div>
</div>
<div class="container">
<div class="cta-content reveal-fade">
<h2 id="about-cta-heading" class="cta-title gradient-text">בואו נדבר על הפרויקט שלכם</h2>
<h2 id="about-cta-heading" class="cta-title">בואו נדבר על הפרויקט שלכם</h2>
<p class="cta-desc">אשמח לשמוע על הצרכים שלכם ולהציע פתרון אריזה מותאם</p>
<a href="contact.html" class="btn btn-primary btn-large btn-glow">בואו נדבר</a>
</div>
@@ -163,7 +144,6 @@
</main>
<footer class="site-footer">
<div class="footer-glow" aria-hidden="true"></div>
<div class="container">
<div class="footer-grid">
<div class="footer-brand">
@@ -199,81 +179,34 @@
<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 {
.profile-image-large {
position: relative;
flex-shrink: 0;
width: 100%;
max-width: 400px;
border-radius: var(--radius-xl);
overflow: hidden;
box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
}
.profile-image {
width: 150px;
height: 150px;
border-radius: 50%;
object-fit: cover;
border: 3px solid var(--color-accent);
box-shadow: var(--shadow-glow);
.profile-image-large img {
width: 100%;
height: auto;
display: block;
filter: grayscale(20%);
transition: filter var(--transition-medium);
}
.profile-decoration {
.profile-image-large:hover img {
filter: grayscale(0%);
}
.profile-overlay {
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;
}
inset: 0;
background: linear-gradient(135deg, rgba(14, 165, 233, 0.1) 0%, rgba(212, 175, 55, 0.05) 100%);
}
</style>
</body>