commit 7bff1ec583cae452bba436857f9facb0a894eade

Author: root <root@hub.scroll.pub> Date: 2024-12-27 09:09:06 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..da70b95 --- /dev/null +++ b/body.html @@ -0,0 +1,90 @@ +<header> + <nav> + <div class="logo">💪 WorkoutGuide</div> + <div class="menu-toggle"> + <span></span> + <span></span> + <span></span> + </div> + <ul class="nav-links"> + <li><a href="#tips">Tips</a></li> + <li><a href="#monday">Monday</a></li> + <li><a href="#tuesday">Tuesday</a></li> + <li><a href="#wednesday">Wednesday</a></li> + <li><a href="#thursday">Thursday</a></li> + <li><a href="#friday">Friday</a></li> + <li><a href="#saturday">Saturday</a></li> + </ul> + </nav> +</header> + +<main> + <section class="hero"> + <h1>4-Week Workout Program</h1> + <p>Complete exercise guide with tutorials and form tips</p> + </section> + + <section id="tips" class="tips-section"> + <h2>💡 General Tips</h2> + <div class="tips-grid"> + <div class="tip-card"> + <span class="tip-icon">🎯</span> + <p>Focus on mind-muscle connection</p> + </div> + <div class="tip-card"> + <span class="tip-icon">⏱️</span> + <p>Take 2-5 mins breaks between sets</p> + </div> + <div class="tip-card"> + <span class="tip-icon">📈</span> + <p>You grow more in stretched positions</p> + </div> + <div class="tip-card"> + <span class="tip-icon">✅</span> + <p>Prioritize form over weight/reps</p> + </div> + </div> + </section> + + <div class="workout-days"> + <section id="monday" class="day-section"> + <h2>Monday: Legs 🦵</h2> + <div class="exercise-tabs"> + <button class="tab active" data-tab="warmup">Warm-up</button> + <button class="tab" data-tab="main">Main Exercises</button> + <button class="tab" data-tab="stretches">Stretches</button> + </div> + + <div class="tab-content active" id="warmup"> + <!-- Warm-up content --> + </div> + + <div class="tab-content" id="main"> + <!-- Main exercises content --> + </div> + + <div class="tab-content" id="stretches"> + <!-- Stretches content --> + </div> + </section> + + <!-- Repeat similar structure for other days --> + </div> +</main> + +<footer> + <div class="footer-content"> + <div class="footer-section"> + <h3>Quick Links</h3> + <ul> + <li><a href="#tips">Tips</a></li> + <li><a href="#monday">Monday</a></li> + <li><a href="#tuesday">Tuesday</a></li> + </ul> + </div> + <div class="footer-section"> + <h3>Important Notes</h3> + <p>Always consult with a healthcare provider before starting any exercise program.</p> + </div> + </div> +</footer> diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..f443dc4 --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://workout-guide.scroll.pub +metaTags +editButton /edit.html +title 4-Week Workout Guide - Complete Exercise Program +style.css +body.html +script.js diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..9b75ba9 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# workout-guide.scroll.pub +Website generated by Claude from prompt: create a simple response webpage for a workout plan. the plan should have days and execrsises which i have mentioned below it should also have tips and video links i have mentioned below. <plan># 🏋️‍♀️ Workout Program with Tutorial Links This plan is for 1st 4 weeks of your workout journey. ## 💡 General Tips - Focus on mind-muscle connection - Take 2-5 mins breaks between sets - You grow more in stretched positions - Prioritize form over weight/reps - Slow movement while moving weight in a downward motion / negatives (controlled eccentric) - Proper breathing is crucial - 10-12 minutes cardio every alternate day at the end ## Monday: Legs 🦵 ### Warm-up | Exercise | Duration/Reps | Tutorial Links | Form Tips | | --- | --- | --- | --- | | Warmup and Cycling | 5-7 mins cycling 2-3 min warmup | [Full Leg Warm-up Guide](https://www.youtube.com/watch?v=pCEpcIo-O4I) | | | Bodyweight Squats | 2 sets × 20 reps | [MuscleWiki Guide](https://musclewiki.com/bodyweight/female/glutes/bodyweight-squat/) | Practice basic movement pattern | ### Main Exercises | Exercise | Sets × Reps | Weight | Tutorial Links | Form Tips | Common Mistakes | Muscles involved | | --- | --- | --- | --- | --- | --- | --- | | Smith Machine Squats | #1-2: 15-20 reps (empty bar) #3-4: 10-12 reps (+2.5kg/side) | Start: Empty bar Progress: +2.5kg plates | 1. [Basic Tutorial](https://www.youtube.com/watch?v=8Kls95w2jFA) 2. [Form Guide](https://www.youtube.com/watch?v=Uv_DKDl7EjA) 3. [Quick Tips](https://www.youtube.com/shorts/rhbIFJj4UYc) | - Wider stance - Breathing crucial - Keep chest up | Watch for: - Knee moving inward (it should be outwards) - Back rounding | Quads,Glutes | | Dumbbell RDL | 3 × 12-15 reps | 5kg dumbbells | 1. [MuscleWiki Guide](https://musclewiki.com/dumbbells/female/lowerback/dumbbell-romanian-deadlift/) 2. [Common Mistakes](https://www.youtube.com/shorts/d-hn_0sEpRQ) 3. [Avoiding back pain](https://www.youtube.com/shorts/wFSMH3PPu9Y) | - Hip hinge movement - Feel hamstring stretch | - Not hinging at hips. - Rounding back | Glutes, Ham | | Leg Extension | 3 × 15 reps | 25-30kg | [Machine Guide](https://musclewiki.com/machine/female/quads/machine-leg-extension/) | Control movement | Don't swing | Quad | | Calf Raises | 3 × 15-17 reps | 10kg | 1. [Machine Guide](https://musclewiki.com/machine/female/calves/machine-standing-calf-raises/) 2. [Form Tips](https://www.youtube.com/shorts/xK6DoHBXTdw) | Hold 1sec at bottom | Don't rush reps | | ### Stretches | Stretch | Duration | Tutorial Link | Key Focus | | --- | --- | --- | --- | | Quad Stretch 1 | 30s/side | [Variation Two](https://musclewiki.com/stretches/female/quads/quads-stretch-variation-two/) | Feel front thigh stretch | | Quad Stretch 2 | 30s/side | [Variation Three](https://musclewiki.com/stretches/female/quads/quads-stretch-variation-three/) | Alternative position | | Glute Stretch | 30s/side | [Glute Guide](https://musclewiki.com/stretches/female/glutes/glutes-stretch-variation-three/) | Feel hip stretch | | Hamstring Stretch | 15-20s/side | [Ham Guide](https://musclewiki.com/stretches/female/hamstrings/hamstrings-stretch-variation-four/) | Gentle stretch | --- ## Tuesday: Shoulders & Abs 💪 ### Warm-up | Exercise | Duration | Tutorial Link | Notes | | --- | --- | --- | --- | | Shoulder Mobility | 5-7 mins | [Warm-up Guide](https://www.youtube.com/watch?v=ztQRlsR44M8) | Complete all movements | ### Main Exercises | Exercise | Sets × Reps | Weight | Tutorial Links | Form Tips | | --- | --- | --- | --- | --- | | Dumbbell Seated Overhead Press | 3 × 12-15 reps 1 × 6 reps | 2.5kg dumbbells 5kg (last set) | [Press Tutorial](https://musclewiki.com/dumbbells/female/shoulders/dumbbell-seated-overhead-press/) | - Core tight - Full Range of motion | | Lateral Raises | 3 × 15-20 reps 1 × 6-8 reps | 2.5kg dumbbells 5kg (last set) | [Raise Guide](https://musclewiki.com/dumbbells/female/shoulders/dumbbell-lateral-raise/) | - No swinging - Control movement | | Rear Delt Fly | 3 × 12-15 reps | 2.5kg dumbbells | [Fly Guide](https://musclewiki.com/dumbbells/female/shoulders/dumbbell-seated-rear-delt-fly/) | Squeeze at top | | | | | | | ### Abs | Exercise | Sets × Reps | Tutorial Links | Key Points | | --- | --- | --- | --- | | Laying Leg Raises | 3 × 15-20 | [Lower Ab Guide](https://musclewiki.com/bodyweight/female/abdominals/laying-leg-raises/) | Control descent | | Crunches | 3 × 15-20 | [Crunch Guide](https://musclewiki.com/bodyweight/female/abdominals/crunches/) | Curl up slowly | | Plank | 1-2 mins | [Plank Form](https://musclewiki.com/bodyweight/female/abdominals/hand-plank/) | Keep body straight | ### Stretches | Stretch | Duration | Tutorial Link | | --- | --- | --- | | Shoulder Stretch 1 | 20s/side | [Variation One](https://musclewiki.com/stretches/female/shoulders/shoulders-stretch-variation-one/) | | Shoulder Stretch 2 | 20s/side | [Variation Four](https://musclewiki.com/stretches/female/shoulders/shoulders-stretch-variation-four/) |  --- ## Wednesday: Chest & Triceps 💪 ### Warm-up | Exercise | Duration/Reps | Tutorial Links | Form Tips | | --- | --- | --- | --- | | Modified Push-ups | Target: 30-35 reps | [Modified Push-up Guide](https://www.youtube.com/shorts/A9eYDfkh7zQ) | - Can bend knees - Focus on form | ### Main Exercises | Exercise | Sets × Reps | Weight | Tutorial Links | Form Tips | | --- | --- | --- | --- | --- | | Dumbbell Incline Bench Press | 3 × 15 reps 1 × 6 reps (last set) | 2.5kg dumbbells 5kg (last set) | [Incline Press Guide](https://musclewiki.com/dumbbells/female/anterior-deltoid/dumbbell-incline-bench-press/) | - Control movement - Full ROM | | Dumbbell Bench Press | 3 × 12-15 reps 1 × 4-5 reps (last set) | 2.5kg dumbbells 5kg (last set) | [Bench Press Guide](https://musclewiki.com/dumbbells/female/triceps/dumbbell-bench-press/) | - Keep back flat - Drive through chest | | Machine Pec Fly | 3 × 12-15 reps 1 × 6-8 reps (last set) | 10kg 15kg (last set) | [Pec Fly Guide](https://musclewiki.com/machine/female/chest/machine-pec-fly/) | - Squeeze at peak - Control return | | Dumbbell Overhead Tricep Extension | 4 × 12 reps | 7.5kg | [Tricep Extension Guide](https://musclewiki.com/dumbbells/female/triceps/dumbbell-overhead-tricep-extension) | - Keep elbows in - Full extension | | Rope/Bar Pushdown | 3 × 12-15 reps | Start light | 1. [Cable Guide 2.](https://musclewiki.com/cables/female/triceps/cable-rope-pushdown/) [Form Video](https://www.youtube.com/watch?v=odbyvJm7d8s) | - Elbows at sides - Control motion | ### Stretches | Stretch | Duration | Tutorial Link | | --- | --- | --- | | Chest Stretch 1 | 15-20s each | [Variation One](https://musclewiki.com/stretches/female/chest/chest-stretch-variation-one/) | | Chest Stretch 2 | 15-20s each | [Variation Three](https://musclewiki.com/stretches/female/chest/chest-stretch-variation-three/) | | | | | --- ## Thursday: Back & Biceps 💪 ### Main Exercises | Exercise | Sets × Reps | Weight | Tutorial Links | Form Tips | Muscle Involved | | --- | --- | --- | --- | --- | --- | | Machine Pulldowns | 4 × 12 reps | 10-15kg | [Pulldown Guide](https://musclewiki.com/machine/female/lats/machine-pulldown/) [Form Tips 1](https://www.youtube.com/shorts/oJ0x9fsmESs) [Form Tips 2](https://www.youtube.com/shorts/5s6KGLTMgoI) | - Stay in place - No momentum - Push with lats | Lats | | Machine Seated Cable Rows | 3 × 12-15 reps | 10-15kg | [Row Guide](https://musclewiki.com/machine/female/biceps/machine-seated-cable-row/) [useful tips](https://www.youtube.com/watch?v=J7woEcgtArY) [tips-2](https://www.youtube.com/watch?v=UCXxvVItLoM) [elbow position guide](https://www.youtube.com/shorts/eA6JBY6PV4A) | - Squeeze back - Control return | Mid back, lats | | Bend over Dumbbell Rows | 3 × 10 reps | 5 kg | 1. [Row Guide](https://www.youtube.com/watch?v=DMo3HJoawrU) 2. [Guide-2](https://www.youtube.com/shorts/Fxh6U_AurhI) 3. [Avoiding lower back pain 1](https://www.youtube.com/shorts/wFSMH3PPu9Y) 4. [Avoiding lower back pain 2](https://www.youtube.com/shorts/ijfcwBxbd1k) | - Hip hinge - Brace core (breath air into your stomach) | Mid back, lats, lower back | | Back Extension | 3 × 12-15 reps | Bodyweight | [Extension Guide](https://musclewiki.com/machine/female/lowerback/machine-45-degree-back-extension/) | - Control movement - No jerking | Lower back, Glutes | | Dumbbell Curls | 3 × 15 reps | 2.5kg dumbbells | [Curl Guide](https://musclewiki.com/dumbbells/female/biceps/dumbbell-curl/) | - Static elbows - Control tempo - Controlled negatives | inner biceps (long head) | | Hammer Curls | 3 × 12-15 reps | 2.5kg dumbbells | [Hammer Curl Guide](https://musclewiki.com/dumbbells/female/biceps/dumbbell-hammer-curl/) | - No elbow movement - Full ROM | outer bicep (short head) | ### Stretches | Stretch | Duration | Tutorial Link | | --- | --- | --- | | Lats Stretch 1 | 20-30s each | [Variation One](https://musclewiki.com/stretches/female/lats/lats-stretch-variation-one/) | | Lats Stretch 2 | 20-30s each | [Variation Two](https://musclewiki.com/stretches/female/lats/lats-stretch-variation-two/) | | Mid Back Stretch | 20-30s | [Trap Stretch](https://musclewiki.com/stretches/female/traps-middle/traps-mid-back-stretch-variation-one/) | | Lower Back Stretch 1 | 20-30s | [Variation One](https://musclewiki.com/stretches/female/lowerback/lower-back-stretch-variation-one/) | | Lower Back Stretch 2 | 20-30s | [Variation Two](https://musclewiki.com/stretches/female/lowerback/lower-back-stretch-variation-two/) | --- ## Friday: Legs (Day 2) 🦵 ### Warm-up | Exercise | Duration/Reps | Tutorial Links | Notes | | --- | --- | --- | --- | | Cycling | 5-7 mins | [Warm-up Guide](https://www.youtube.com/watch?v=pCEpcIo-O4I) | Light resistance | | Body Weight Squats | 2 × 15-20 reps | Same as Monday | Focus on form | ### Main Exercises | Exercise | Sets × Reps | Weight | Tutorial Links | Form Tips | Muscle involved | | --- | --- | --- | --- | --- | --- | | Goblet Squats | 4 × 15-20 reps | 10kg dumbbell | [Squat Guide](https://musclewiki.com/dumbbells/female/glutes/dumbbell-goblet-squat/) [Form Video](https://www.youtube.com/watch?v=jHtONlh5_ZM) | - Elevated heels - Keep chest up | Quads | | Leg Press | 3 × 20 reps | 20-20kg plates | [Press Guide](https://musclewiki.com/machine/female/glutes/machine-leg-press/) | - Full ROM - Control descent | Quads | | Hip Thrusts | 3 × 15 reps | Light weight | [Thrust Guide](https://musclewiki.com/barbell/female/glutes/barbell-hip-thrust/) | - Bridge hips high - Squeeze glutes | Glutes | | Walking Lunges | 2-3 × 20 reps | 2.5kg dumbbells | [Lunge Guide](https://www.youtube.com/watch?v=Z6R8A5tcrTc) | - Long steps - Control balance | Glutes, Ham | | Leg Curl | 3 × 12-15 reps | 30kg | [Curl Guide](https://musclewiki.com/machine/female/hamstrings/machine-hamstring-curl/) | - Full contraction - Control return | Ham | Note: Either Choose Hip thrusts/ Lunges with big strides for glutes --- ## Saturday: Optional Cardio & Abs 🏃‍♀️ ### Light Cardio Options - 20-30 minutes walking/cycling - Keep intensity moderate - Focus on recovery ### Abs (Optional) - Choose some exercises from Tuesday's ab workout - Focus on core stability exercises. - [Dr Mcgill big 3](https://www.youtube.com/shorts/C89EKtI8a3o) --- ## Mobility techniques 1. Hip hinge : [Guide](https://www.youtube.com/shorts/JhKrt0JA3v4) [Guide-2](https://www.youtube.com/shorts/bMo2XS_AlyQ) (will avoid lower back pain) 2. Bracing : [Bracing guide for lifting](https://www.youtube.com/watch?v=TRmayQcweUc&t=474s). (helpful for back pain and proper posture) </plan> \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..a76a79a --- /dev/null +++ b/script.js @@ -0,0 +1,57 @@ +document.addEventListener('DOMContentLoaded', () => { + // Navigation menu toggle + const menuToggle = document.querySelector('.menu-toggle'); + const navLinks = document.querySelector('.nav-links'); + + menuToggle?.addEventListener('click', () => { + navLinks.classList.toggle('active'); + }); + + // Smooth scroll for navigation links + document.querySelectorAll('a[href^="#"]').forEach(anchor => { + anchor.addEventListener('click', function (e) { + e.preventDefault(); + const target = document.querySelector(this.getAttribute('href')); + if (target) { + target.scrollIntoView({ + behavior: 'smooth' + }); + } + }); + }); + + // Tab functionality + const tabs = document.querySelectorAll('.tab'); + tabs.forEach(tab => { + tab.addEventListener('click', () => { + // Remove active class from all tabs + tabs.forEach(t => t.classList.remove('active')); + // Add active class to clicked tab + tab.classList.add('active'); + + // Show corresponding content + const tabContents = document.querySelectorAll('.tab-content'); + tabContents.forEach(content => content.classList.remove('active')); + const targetContent = document.querySelector(`#${tab.dataset.tab}`); + if (targetContent) { + targetContent.classList.add('active'); + } + }); + }); + + // Intersection Observer for animations + const observer = new IntersectionObserver((entries) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('visible'); + } + }); + }, { + threshold: 0.1 + }); + + // Observe all section elements + document.querySelectorAll('section').forEach(section => { + observer.observe(section); + }); +}); diff --git a/style.css b/style.css new file mode 100644 index 0000000..bffe7c7 --- /dev/null +++ b/style.css @@ -0,0 +1,156 @@ +:root { + --primary: #2a6df4; + --secondary: #1e293b; + --accent: #38bdf8; + --background: #f8fafc; + --text: #334155; + --card-bg: #ffffff; +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; + line-height: 1.6; + color: var(--text); + background: var(--background); +} + +/* Header & Navigation */ +header { + background: var(--card-bg); + box-shadow: 0 2px 10px rgba(0,0,0,0.1); + position: fixed; + width: 100%; + top: 0; + z-index: 1000; +} + +nav { + max-width: 1200px; + margin: 0 auto; + padding: 1rem; + display: flex; + justify-content: space-between; + align-items: center; +} + +.logo { + font-size: 1.5rem; + font-weight: bold; + color: var(--primary); +} + +.nav-links { + display: flex; + gap: 2rem; + list-style: none; +} + +.nav-links a { + text-decoration: none; + color: var(--text); + font-weight: 500; + transition: color 0.3s ease; +} + +.nav-links a:hover { + color: var(--primary); +} + +/* Hero Section */ +.hero { + height: 60vh; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + text-align: center; + background: linear-gradient(135deg, var(--primary), var(--accent)); + color: white; + padding: 2rem; + margin-top: 60px; +} + +.hero h1 { + font-size: 3rem; + margin-bottom: 1rem; +} + +/* Tips Section */ +.tips-section { + padding: 4rem 2rem; + max-width: 1200px; + margin: 0 auto; +} + +.tips-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: 2rem; + margin-top: 2rem; +} + +.tip-card { + background: var(--card-bg); + padding: 2rem; + border-radius: 10px; + box-shadow: 0 4px 6px rgba(0,0,0,0.1); + transition: transform 0.3s ease; +} + +.tip-card:hover { + transform: translateY(-5px); +} + +.tip-icon { + font-size: 2rem; + margin-bottom: 1rem; + display: block; +} + +/* Workout Days */ +.day-section { + padding: 4rem 2rem; + max-width: 1200px; + margin: 0 auto; +} + +.exercise-tabs { + display: flex; + gap: 1rem; + margin-bottom: 2rem; +} + +.tab { + padding: 0.75rem 1.5rem; + border: none; + background: var(--card-bg); + border-radius: 5px; + cursor: pointer; + transition: all 0.3s ease; +} + +.tab.active { + background: var(--primary); + color: white; +} + +/* Responsive Design */ +@media (max-width: 768px) { + .nav-links { + display: none; + } + + .menu-toggle { + display: block; + } + + .hero h1 { + font-size: 2rem; + } +}