commit e9a52fe445db681b30142f217964cb203111075a

Author: root <root@hub.scroll.pub> Date: 2024-12-27 09:11:22 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..dd884ad --- /dev/null +++ b/body.html @@ -0,0 +1,77 @@ +<header> + <nav> + <div class="logo">FitPlan</div> + <div class="nav-links"> + <a href="#general-tips">Tips</a> + <a href="#workout-days">Workouts</a> + <a href="#mobility">Mobility</a> + </div> + </nav> +</header> + +<main> + <section class="hero"> + <h1>4-Week Workout Program</h1> + <p>Your complete guide to starting your fitness journey</p> + </section> + + <section id="general-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> + + <section id="workout-days" class="workouts-section"> + <h2>Workout Schedule</h2> + <div class="day-tabs"> + <button class="tab-btn active" data-day="monday">Monday</button> + <button class="tab-btn" data-day="tuesday">Tuesday</button> + <button class="tab-btn" data-day="wednesday">Wednesday</button> + <button class="tab-btn" data-day="thursday">Thursday</button> + <button class="tab-btn" data-day="friday">Friday</button> + <button class="tab-btn" data-day="saturday">Saturday</button> + </div> + + <div id="workout-content" class="workout-content"> + <!-- Dynamic content will be loaded here via JavaScript --> + </div> + </section> + + <section id="mobility" class="mobility-section"> + <h2>Mobility Techniques</h2> + <div class="mobility-cards"> + <div class="mobility-card"> + <h3>Hip Hinge</h3> + <div class="video-container"> + <iframe src="https://www.youtube.com/embed/JhKrt0JA3v4" allowfullscreen></iframe> + </div> + </div> + <div class="mobility-card"> + <h3>Bracing</h3> + <div class="video-container"> + <iframe src="https://www.youtube.com/embed/TRmayQcweUc" allowfullscreen></iframe> + </div> + </div> + </div> + </section> +</main> + +<footer> + <p>Built with 💪 for fitness enthusiasts</p> +</footer> diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..873d0e7 --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://fitplan.scroll.pub +metaTags +editButton /edit.html +title 4-Week Workout Program +style.css +body.html +script.js diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..615672a --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# fitplan2.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..2cecfbf --- /dev/null +++ b/script.js @@ -0,0 +1,84 @@ +const workoutData = { + monday: { + title: "Legs 🦵", + exercises: [ + { + name: "Smith Machine Squats", + sets: "4", + reps: "15-20, 10-12", + weight: "Empty bar + 2.5kg/side" + }, + { + name: "Dumbbell RDL", + sets: "3", + reps: "12-15", + weight: "5kg dumbbells" + } + // Add more exercises + ] + }, + tuesday: { + title: "Shoulders & Abs 💪", + exercises: [ + { + name: "Dumbbell Seated Overhead Press", + sets: "4", + reps: "12-15, 6", + weight: "2.5kg-5kg dumbbells" + } + // Add more exercises + ] + } + // Add more days +}; + +document.addEventListener('DOMContentLoaded', () => { + // Tab switching functionality + const tabs = document.querySelectorAll('.tab-btn'); + const workoutContent = document.getElementById('workout-content'); + + function showWorkout(day) { + const workout = workoutData[day]; + if (!workout) return; + + let html = ` + <h3>${workout.title}</h3> + <div class="exercise-list"> + `; + + workout.exercises.forEach(exercise => { + html += ` + <div class="exercise-card"> + <h4>${exercise.name}</h4> + <p>Sets: ${exercise.sets}</p> + <p>Reps: ${exercise.reps}</p> + <p>Weight: ${exercise.weight}</p> + </div> + `; + }); + + html += '</div>'; + workoutContent.innerHTML = html; + } + + tabs.forEach(tab => { + tab.addEventListener('click', () => { + tabs.forEach(t => t.classList.remove('active')); + tab.classList.add('active'); + showWorkout(tab.dataset.day); + }); + }); + + // Show Monday workout by default + showWorkout('monday'); + + // Smooth scrolling for navigation links + document.querySelectorAll('a[href^="#"]').forEach(anchor => { + anchor.addEventListener('click', function (e) { + e.preventDefault(); + document.querySelector(this.getAttribute('href')).scrollIntoView({ + behavior: 'smooth' + }); + }); + }); +}); diff --git a/style.css b/style.css new file mode 100644 index 0000000..19b0dca --- /dev/null +++ b/style.css @@ -0,0 +1,187 @@ +:root { + --primary-color: #2a6dff; + --secondary-color: #ff6b6b; + --background-color: #f8f9fa; + --text-color: #333; + --card-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: 'Inter', system-ui, sans-serif; + line-height: 1.6; + color: var(--text-color); + background: var(--background-color); +} + +header { + background: white; + box-shadow: var(--card-shadow); + 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-color); +} + +.nav-links a { + margin-left: 2rem; + text-decoration: none; + color: var(--text-color); + transition: color 0.3s ease; +} + +.nav-links a:hover { + color: var(--primary-color); +} + +main { + margin-top: 4rem; + padding: 2rem; +} + +.hero { + text-align: center; + padding: 4rem 0; + background: linear-gradient(135deg, var(--primary-color), var(--secondary-color)); + color: white; + border-radius: 1rem; + margin-bottom: 3rem; +} + +.hero h1 { + font-size: 3rem; + margin-bottom: 1rem; +} + +.tips-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: 2rem; + margin-top: 2rem; +} + +.tip-card { + background: white; + padding: 2rem; + border-radius: 1rem; + box-shadow: var(--card-shadow); + text-align: center; + transition: transform 0.3s ease; +} + +.tip-card:hover { + transform: translateY(-5px); +} + +.tip-icon { + font-size: 2rem; + margin-bottom: 1rem; + display: block; +} + +.day-tabs { + display: flex; + flex-wrap: wrap; + gap: 1rem; + margin-bottom: 2rem; +} + +.tab-btn { + padding: 0.75rem 1.5rem; + border: none; + background: white; + border-radius: 0.5rem; + cursor: pointer; + transition: all 0.3s ease; +} + +.tab-btn.active { + background: var(--primary-color); + color: white; +} + +.workout-content { + background: white; + padding: 2rem; + border-radius: 1rem; + box-shadow: var(--card-shadow); +} + +.mobility-cards { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 2rem; + margin-top: 2rem; +} + +.mobility-card { + background: white; + border-radius: 1rem; + overflow: hidden; + box-shadow: var(--card-shadow); +} + +.mobility-card h3 { + padding: 1rem; + background: var(--primary-color); + color: white; +} + +.video-container { + position: relative; + padding-bottom: 56.25%; + height: 0; +} + +.video-container iframe { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; +} + +footer { + text-align: center; + padding: 2rem; + background: white; + margin-top: 4rem; +} + +@media (max-width: 768px) { + .nav-links { + display: none; + } + + .hero h1 { + font-size: 2rem; + } + + main { + padding: 1rem; + } + + .tip-card { + padding: 1.5rem; + } +}