{"project":{"id":"Mj5E5ze","userId":"davidyarham@gmail.com","username":null,"userPicture":null,"name":"IRONLOG (ANIS)","visible":true,"contributors":"","githubRepo":null,"forkedFrom":null,"isTemplate":false,"tags":"","files":{"folder":"","files":[{"name":"index.html","content":"\n\n\n \n \n Untitled\n \n\n\n\n\n\n\n\n
\n\t
\n\t\t

IRONLOG

\n\t\t

Track your gains

\n\t
\n\n\t
\n\t\t
\n\t\t\t

Log Workout

\n\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t
\n\t\t\t\t\n\t\t\t
\n\t\t
\n\n\t\t
\n\t\t\t

Weekly Overview

\n\t\t\t
\n\t\t\t\t\n\t\t\t
\n\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t0\n\t\t\t\t\tWorkouts This Week\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t0\n\t\t\t\t\tTotal Minutes\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t0\n\t\t\t\t\tAvg Intensity\n\t\t\t\t
\n\t\t\t
\n\t\t
\n\n\t\t
\n\t\t\t

Recent Workouts

\n\t\t\t
\n\t\t\t\t

No workouts logged yet. Start your journey!

\n\t\t\t
\n\t\t
\n\t
\n
\n \n\n"},{"name":"main.js","content":"const workouts = JSON.parse(localStorage.getItem('workouts')) || [];\nlet chart;\n\nconst typeIcons = {\n\tstrength: 'dumbbell',\n\tcardio: 'heart-pulse',\n\thiit: 'zap',\n\tflexibility: 'stretch-horizontal',\n\tsports: 'trophy'\n};\n\nconst typeLabels = {\n\tstrength: 'Strength Training',\n\tcardio: 'Cardio',\n\thiit: 'HIIT',\n\tflexibility: 'Flexibility/Yoga',\n\tsports: 'Sports'\n};\n\nfunction saveWorkouts() {\n\tlocalStorage.setItem('workouts', JSON.stringify(workouts));\n}\n\nfunction getWeekDates() {\n\tconst today = new Date();\n\tconst dayOfWeek = today.getDay();\n\tconst monday = new Date(today);\n\tmonday.setDate(today.getDate() - (dayOfWeek === 0 ? 6 : dayOfWeek - 1));\n\n\tconst dates = [];\n\tfor (let i = 0; i < 7; i++) {\n\t\tconst date = new Date(monday);\n\t\tdate.setDate(monday.getDate() + i);\n\t\tdates.push(date.toISOString().split('T')[0]);\n\t}\n\treturn dates;\n}\n\nfunction getWeeklyData() {\n\tconst weekDates = getWeekDates();\n\tconst days = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];\n\n\tconst durationData = weekDates.map(date => {\n\t\tconst dayWorkouts = workouts.filter(w => w.date === date);\n\t\treturn dayWorkouts.reduce((sum, w) => sum + w.duration, 0);\n\t});\n\n\tconst intensityData = weekDates.map(date => {\n\t\tconst dayWorkouts = workouts.filter(w => w.date === date);\n\t\tif (dayWorkouts.length === 0) return 0;\n\t\tconst avg = dayWorkouts.reduce((sum, w) => sum + w.intensity, 0) / dayWorkouts.length;\n\t\treturn Math.round(avg * 10) / 10;\n\t});\n\n\treturn {\n\t\tdays,\n\t\tdurationData,\n\t\tintensityData\n\t};\n}\n\nfunction initChart() {\n\tconst ctx = document.getElementById('weeklyChart').getContext('2d');\n\tconst {\n\t\tdays,\n\t\tdurationData,\n\t\tintensityData\n\t} = getWeeklyData();\n\n\tchart = new Chart(ctx, {\n\t\ttype: 'bar',\n\t\tdata: {\n\t\t\tlabels: days,\n\t\t\tdatasets: [{\n\t\t\t\tlabel: 'Duration (min)',\n\t\t\t\tdata: durationData,\n\t\t\t\tbackgroundColor: 'rgba(255, 59, 48, 0.8)',\n\t\t\t\tborderRadius: 6,\n\t\t\t\tyAxisID: 'y'\n\t\t\t},\n\t\t\t{\n\t\t\t\tlabel: 'Avg Intensity',\n\t\t\t\tdata: intensityData,\n\t\t\t\ttype: 'line',\n\t\t\t\tborderColor: '#ff9500',\n\t\t\t\tbackgroundColor: 'rgba(255, 149, 0, 0.1)',\n\t\t\t\tborderWidth: 3,\n\t\t\t\tpointBackgroundColor: '#ff9500',\n\t\t\t\tpointRadius: 5,\n\t\t\t\ttension: 0.3,\n\t\t\t\tfill: true,\n\t\t\t\tyAxisID: 'y1'\n\t\t\t}\n\t\t\t]\n\t\t},\n\t\toptions: {\n\t\t\tresponsive: true,\n\t\t\tmaintainAspectRatio: false,\n\t\t\tinteraction: {\n\t\t\t\tintersect: false,\n\t\t\t\tmode: 'index'\n\t\t\t},\n\t\t\tplugins: {\n\t\t\t\tlegend: {\n\t\t\t\t\tlabels: {\n\t\t\t\t\t\tcolor: '#8e8e93',\n\t\t\t\t\t\tfont: {\n\t\t\t\t\t\t\tfamily: 'Inter, system-ui'\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t\tscales: {\n\t\t\t\tx: {\n\t\t\t\t\tgrid: {\n\t\t\t\t\t\tcolor: 'rgba(255,255,255,0.05)'\n\t\t\t\t\t},\n\t\t\t\t\tticks: {\n\t\t\t\t\t\tcolor: '#8e8e93'\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\ty: {\n\t\t\t\t\tposition: 'left',\n\t\t\t\t\tgrid: {\n\t\t\t\t\t\tcolor: 'rgba(255,255,255,0.05)'\n\t\t\t\t\t},\n\t\t\t\t\tticks: {\n\t\t\t\t\t\tcolor: '#8e8e93'\n\t\t\t\t\t},\n\t\t\t\t\ttitle: {\n\t\t\t\t\t\tdisplay: true,\n\t\t\t\t\t\ttext: 'Duration (min)',\n\t\t\t\t\t\tcolor: '#8e8e93'\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\ty1: {\n\t\t\t\t\tposition: 'right',\n\t\t\t\t\tmin: 0,\n\t\t\t\t\tmax: 10,\n\t\t\t\t\tgrid: {\n\t\t\t\t\t\tdisplay: false\n\t\t\t\t\t},\n\t\t\t\t\tticks: {\n\t\t\t\t\t\tcolor: '#ff9500'\n\t\t\t\t\t},\n\t\t\t\t\ttitle: {\n\t\t\t\t\t\tdisplay: true,\n\t\t\t\t\t\ttext: 'Intensity',\n\t\t\t\t\t\tcolor: '#ff9500'\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t});\n}\n\nfunction updateChart() {\n\tconst {\n\t\tdurationData,\n\t\tintensityData\n\t} = getWeeklyData();\n\tchart.data.datasets[0].data = durationData;\n\tchart.data.datasets[1].data = intensityData;\n\tchart.update();\n}\n\nfunction updateStats() {\n\tconst weekDates = getWeekDates();\n\tconst weekWorkouts = workouts.filter(w => weekDates.includes(w.date));\n\n\tdocument.getElementById('totalWorkouts').textContent = weekWorkouts.length;\n\tdocument.getElementById('totalMinutes').textContent = weekWorkouts.reduce((sum, w) => sum + w.duration, 0);\n\n\tconst avgInt = weekWorkouts.length > 0 ?\n\t\t(weekWorkouts.reduce((sum, w) => sum + w.intensity, 0) / weekWorkouts.length).toFixed(1) :\n\t\t'0';\n\tdocument.getElementById('avgIntensity').textContent = avgInt;\n}\n\nfunction renderWorkouts() {\n\tconst list = document.getElementById('workoutList');\n\n\tif (workouts.length === 0) {\n\t\tlist.innerHTML = '

No workouts logged yet. Start your journey!

';\n\t\treturn;\n\t}\n\n\tconst sorted = [...workouts].sort((a, b) => new Date(b.date) - new Date(a.date));\n\n\tlist.innerHTML = sorted.slice(0, 10).map((w, i) => `\n
\n
\n \n
\n
\n
${typeLabels[w.type] || w.type}
\n
${new Date(w.date).toLocaleDateString('en-US', { weekday: 'short', month: 'short', day: 'numeric' })}
\n
\n
\n
${w.duration} min
\n
Intensity: ${w.intensity}/10
\n
\n \n
\n `).join('');\n\n\tlucide.createIcons();\n}\n\nfunction deleteWorkout(index) {\n\tworkouts.splice(index, 1);\n\tsaveWorkouts();\n\trenderWorkouts();\n\tupdateChart();\n\tupdateStats();\n}\n\ndocument.getElementById('workoutForm').addEventListener('submit', (e) => {\n\te.preventDefault();\n\n\tconst workout = {\n\t\tdate: document.getElementById('workoutDate').value,\n\t\ttype: document.getElementById('workoutType').value,\n\t\tduration: parseInt(document.getElementById('duration').value),\n\t\tintensity: parseInt(document.getElementById('intensity').value),\n\t\texercises: document.getElementById('exercises').value,\n\t\tid: Date.now()\n\t};\n\n\tworkouts.push(workout);\n\tsaveWorkouts();\n\trenderWorkouts();\n\tupdateChart();\n\tupdateStats();\n\n\te.target.reset();\n\tdocument.getElementById('workoutDate').value = new Date().toISOString().split('T')[0];\n});\n\ndocument.getElementById('workoutList').addEventListener('click', (e) => {\n\tconst deleteBtn = e.target.closest('.workout-card__delete');\n\tif (deleteBtn) {\n\t\tconst index = parseInt(deleteBtn.dataset.index);\n\t\tdeleteWorkout(index);\n\t}\n});\n\n// Initialize\ndocument.getElementById('workoutDate').value = new Date().toISOString().split('T')[0];\ninitChart();\nrenderWorkouts();\nupdateStats();\nlucide.createIcons();"},{"name":"style.css","content":":root {\n\tcolor-scheme: dark;\n\tfont-family: 'Inter', system-ui, sans-serif;\n\t--color-bg: #0a0a0b;\n\t--color-surface: #141416;\n\t--color-surface-elevated: #1c1c1f;\n\t--color-border: #2a2a2e;\n\t--color-text: #f5f5f7;\n\t--color-text-muted: #8e8e93;\n\t--color-accent: #ff3b30;\n\t--color-accent-secondary: #ff9500;\n\t--color-success: #30d158;\n\t--radius-sm: 8px;\n\t--radius-md: 12px;\n\t--radius-lg: 16px;\n}\n\n* {\n\tbox-sizing: border-box;\n\tmargin: 0;\n\tpadding: 0;\n}\n\nbody {\n\tbackground: var(--color-bg);\n\tcolor: var(--color-text);\n\tmin-height: 100vh;\n}\n\n.app {\n\tmax-width: 900px;\n\tmargin: 0 auto;\n\tpadding: 2rem 1.5rem;\n}\n\n.header {\n\ttext-align: center;\n\tmargin-bottom: 3rem;\n}\n\n.header__title {\n\tfont-size: 3rem;\n\tfont-weight: 900;\n\tletter-spacing: -0.03em;\n\tbackground: linear-gradient(135deg, var(--color-text) 0%, var(--color-text-muted) 100%);\n\t-webkit-background-clip: text;\n\t-webkit-text-fill-color: transparent;\n\tbackground-clip: text;\n}\n\n.header__title--accent {\n\tbackground: linear-gradient(135deg, var(--color-accent) 0%, var(--color-accent-secondary) 100%);\n\t-webkit-background-clip: text;\n\tbackground-clip: text;\n}\n\n.header__subtitle {\n\tcolor: var(--color-text-muted);\n\tfont-size: 1rem;\n\tmargin-top: 0.25rem;\n\ttext-transform: uppercase;\n\tletter-spacing: 0.2em;\n}\n\n.main {\n\tdisplay: grid;\n\tgap: 2rem;\n}\n\n.section__title {\n\tfont-size: 1.25rem;\n\tfont-weight: 700;\n\tmargin-bottom: 1.25rem;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 0.5rem;\n}\n\n.section__title::before {\n\tcontent: '';\n\twidth: 4px;\n\theight: 1.25rem;\n\tbackground: linear-gradient(180deg, var(--color-accent), var(--color-accent-secondary));\n\tborder-radius: 2px;\n}\n\n.log-section,\n.chart-section,\n.history-section {\n\tbackground: var(--color-surface);\n\tborder: 1px solid var(--color-border);\n\tborder-radius: var(--radius-lg);\n\tpadding: 1.5rem;\n}\n\n.form {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 1rem;\n}\n\n.form__row {\n\tdisplay: grid;\n\tgrid-template-columns: 1fr 1fr;\n\tgap: 1rem;\n}\n\n.form__group {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 0.5rem;\n}\n\n.form__label {\n\tfont-size: 0.875rem;\n\tfont-weight: 500;\n\tcolor: var(--color-text-muted);\n}\n\n.form__input {\n\tbackground: var(--color-surface-elevated);\n\tborder: 1px solid var(--color-border);\n\tborder-radius: var(--radius-sm);\n\tpadding: 0.75rem 1rem;\n\tfont-size: 1rem;\n\tcolor: var(--color-text);\n\tfont-family: inherit;\n\ttransition: border-color 0.2s, box-shadow 0.2s;\n}\n\n.form__input:focus {\n\toutline: none;\n\tborder-color: var(--color-accent);\n\tbox-shadow: 0 0 0 3px rgba(255, 59, 48, 0.15);\n}\n\n.form__input--textarea {\n\tresize: vertical;\n\tmin-height: 80px;\n}\n\n.btn {\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n\tgap: 0.5rem;\n\tpadding: 0.875rem 1.5rem;\n\tfont-size: 1rem;\n\tfont-weight: 600;\n\tborder: none;\n\tborder-radius: var(--radius-sm);\n\tcursor: pointer;\n\ttransition: transform 0.2s, box-shadow 0.2s;\n\tfont-family: inherit;\n}\n\n.btn--primary {\n\tbackground: linear-gradient(135deg, var(--color-accent), var(--color-accent-secondary));\n\tcolor: white;\n}\n\n.btn--primary:hover {\n\ttransform: translateY(-2px);\n\tbox-shadow: 0 8px 24px rgba(255, 59, 48, 0.3);\n}\n\n.btn--primary:active {\n\ttransform: translateY(0);\n}\n\n.btn svg {\n\twidth: 18px;\n\theight: 18px;\n}\n\n.chart-container {\n\tbackground: var(--color-surface-elevated);\n\tborder-radius: var(--radius-md);\n\tpadding: 1rem;\n\tmargin-bottom: 1.5rem;\n\theight: 250px;\n}\n\n.stats {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(3, 1fr);\n\tgap: 1rem;\n}\n\n.stat {\n\ttext-align: center;\n\tpadding: 1rem;\n\tbackground: var(--color-surface-elevated);\n\tborder-radius: var(--radius-md);\n}\n\n.stat__value {\n\tdisplay: block;\n\tfont-size: 2rem;\n\tfont-weight: 800;\n\tbackground: linear-gradient(135deg, var(--color-accent), var(--color-accent-secondary));\n\t-webkit-background-clip: text;\n\t-webkit-text-fill-color: transparent;\n\tbackground-clip: text;\n}\n\n.stat__label {\n\tfont-size: 0.75rem;\n\tcolor: var(--color-text-muted);\n\ttext-transform: uppercase;\n\tletter-spacing: 0.05em;\n}\n\n.workout-list {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 0.75rem;\n\tmax-height: 400px;\n\toverflow-y: auto;\n}\n\n.workout-list__empty {\n\ttext-align: center;\n\tcolor: var(--color-text-muted);\n\tpadding: 2rem;\n}\n\n.workout-card {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 1rem;\n\tpadding: 1rem;\n\tbackground: var(--color-surface-elevated);\n\tborder-radius: var(--radius-md);\n\tborder-left: 3px solid var(--color-accent);\n}\n\n.workout-card__icon {\n\twidth: 44px;\n\theight: 44px;\n\tbackground: linear-gradient(135deg, var(--color-accent), var(--color-accent-secondary));\n\tborder-radius: var(--radius-sm);\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tflex-shrink: 0;\n}\n\n.workout-card__icon svg {\n\twidth: 22px;\n\theight: 22px;\n\tcolor: white;\n}\n\n.workout-card__content {\n\tflex: 1;\n\tmin-width: 0;\n}\n\n.workout-card__type {\n\tfont-weight: 600;\n\tmargin-bottom: 0.25rem;\n}\n\n.workout-card__meta {\n\tfont-size: 0.875rem;\n\tcolor: var(--color-text-muted);\n}\n\n.workout-card__stats {\n\ttext-align: right;\n\tflex-shrink: 0;\n}\n\n.workout-card__duration {\n\tfont-weight: 700;\n\tfont-size: 1.125rem;\n}\n\n.workout-card__intensity {\n\tfont-size: 0.75rem;\n\tcolor: var(--color-text-muted);\n}\n\n.workout-card__delete {\n\tbackground: none;\n\tborder: none;\n\tcolor: var(--color-text-muted);\n\tcursor: pointer;\n\tpadding: 0.5rem;\n\tborder-radius: var(--radius-sm);\n\ttransition: color 0.2s, background 0.2s;\n}\n\n.workout-card__delete:hover {\n\tcolor: var(--color-accent);\n\tbackground: rgba(255, 59, 48, 0.1);\n}\n\n.workout-card__delete svg {\n\twidth: 18px;\n\theight: 18px;\n}\n\n@media (max-width: 600px) {\n\t.app {\n\t\tpadding: 1rem;\n\t}\n\n\t.header__title {\n\t\tfont-size: 2rem;\n\t}\n\n\t.form__row {\n\t\tgrid-template-columns: 1fr;\n\t}\n\n\t.stats {\n\t\tgrid-template-columns: 1fr;\n\t}\n\n\t.workout-card {\n\t\tflex-wrap: wrap;\n\t}\n}"}],"folders":[]},"variants":null,"createdAt":"2026-02-01T18:28:28.254Z","updatedAt":"2026-02-05T00:29:12.080Z","hasThumbnail":true}}