164 lines
7.6 KiB
HTML
164 lines
7.6 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<style id="fort-styles">
|
||
|
|
[data-fort]{font:inherit;color:inherit}
|
||
|
|
ul[data-fort]{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45em}
|
||
|
|
[data-fort] li{margin:0;padding:0;line-height:1.45;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
||
|
|
[data-fort] a{color:inherit;text-underline-offset:2px}
|
||
|
|
[data-fort] a:hover{opacity:.72}
|
||
|
|
[data-fort] .src,[data-fort] .fm-type{opacity:.6;font-size:.85em}
|
||
|
|
.fort-citizen{display:flex;flex-direction:column;gap:.4em}
|
||
|
|
.fort-citizen .fc-name{font-weight:600}
|
||
|
|
.fort-citizen .fc-pages{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3em}
|
||
|
|
.fort-media,.fort-film{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.6em}
|
||
|
|
.fort-film{list-style:none;margin:0;padding:0}
|
||
|
|
.fort-film li{overflow:visible;white-space:normal}
|
||
|
|
.fort-film a{display:flex;flex-direction:column;gap:.3em;text-decoration:none}
|
||
|
|
.fort-media img,.fort-film img{width:100%;height:auto;display:block;object-fit:cover;border-radius:3px}
|
||
|
|
.fort-film img{aspect-ratio:16/10}
|
||
|
|
.fort-nav{display:flex;flex-wrap:wrap;gap:1em;align-items:center}
|
||
|
|
</style>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<title>Fitness Tracker Calculator</title>
|
||
|
|
<meta property="og:type" content="website">
|
||
|
|
<meta property="og:title" content="Fitness Tracker Calculator">
|
||
|
|
<meta property="og:description" content="Apply municipal data precision to your athletic performance tracking.">
|
||
|
|
<meta property="og:image" content="https://images.pexels.com/photos/5036927/pexels-photo-5036927.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940">
|
||
|
|
<meta property="og:url" content="https://alexander-west.4ort.net/fitness-tracker-calculator.html">
|
||
|
|
<meta name="twitter:card" content="summary_large_image">
|
||
|
|
<meta name="description" content="Apply municipal data precision to your athletic performance tracking.">
|
||
|
|
<style>
|
||
|
|
body {
|
||
|
|
font-family: 'Courier New', monospace;
|
||
|
|
background-color: #f5f5f5;
|
||
|
|
margin: 0;
|
||
|
|
padding: 20px;
|
||
|
|
}
|
||
|
|
.container {
|
||
|
|
max-width: 800px;
|
||
|
|
margin: 0 auto;
|
||
|
|
background-color: white;
|
||
|
|
padding: 20px;
|
||
|
|
border-radius: 5px;
|
||
|
|
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||
|
|
}
|
||
|
|
h1 {
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
.section {
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
label {
|
||
|
|
display: block;
|
||
|
|
margin-bottom: 5px;
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
input {
|
||
|
|
width: 100%;
|
||
|
|
padding: 8px;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
border: 1px solid #ccc;
|
||
|
|
border-radius: 4px;
|
||
|
|
}
|
||
|
|
button {
|
||
|
|
background-color: #4CAF50;
|
||
|
|
color: white;
|
||
|
|
padding: 10px 15px;
|
||
|
|
border: none;
|
||
|
|
border-radius: 4px;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
button:hover {
|
||
|
|
background-color: #45a049;
|
||
|
|
}
|
||
|
|
#result {
|
||
|
|
margin-top: 20px;
|
||
|
|
padding: 10px;
|
||
|
|
background-color: #f0f0f0;
|
||
|
|
border-radius: 4px;
|
||
|
|
}
|
||
|
|
.image-container {
|
||
|
|
text-align: center;
|
||
|
|
margin: 20px 0;
|
||
|
|
}
|
||
|
|
.image-container img {
|
||
|
|
max-width: 100%;
|
||
|
|
height: auto;
|
||
|
|
border-radius: 5px;
|
||
|
|
}
|
||
|
|
<fort-nav><nav class="fort-nav" data-fort="nav"><a href="/">Alexander West</a><a href="/fitness-journal.html">Fitness Journal System for Office Workers • Alexander West</a><a href="/fitness-tracker-calculator.html" class="active" aria-current="page">Fitness Tracker Calculator</a><a href="/prairie-sketches.html">Prairie Horizons • Alexander West</a><a href="/films/spaceX-workflow.html">SpaceX Workflow & Precision</a></nav></fort-nav>
|
||
|
|
</style>
|
||
|
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div class="container">
|
||
|
|
<h1>Fitness Tracker Calculator</h1>
|
||
|
|
<p>Apply municipal data precision to your athletic performance tracking.</p>
|
||
|
|
|
||
|
|
<div class="image-container">
|
||
|
|
<img src="https://images.pexels.com/photos/5036927/pexels-photo-5036927.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Fitness Tracker">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="section">
|
||
|
|
<label for="workoutType">Workout Type:</label>
|
||
|
|
<input type="text" id="workoutType" placeholder="e.g., Running, Cycling">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="section">
|
||
|
|
<label for="duration">Duration (minutes):</label>
|
||
|
|
<input type="number" id="duration" placeholder="e.g., 30">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="section">
|
||
|
|
<label for="intensity">Intensity (1-10):</label>
|
||
|
|
<input type="number" id="intensity" placeholder="e.g., 7">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="section">
|
||
|
|
<label for="heartRate">Average Heart Rate (bpm):</label>
|
||
|
|
<input type="number" id="heartRate" placeholder="e.g., 140">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<button onclick="calculate()">Calculate</button>
|
||
|
|
|
||
|
|
<div id="result"></div>
|
||
|
|
|
||
|
|
<div class="section">
|
||
|
|
<h2>About</h2>
|
||
|
|
<p>This calculator helps you optimize your workout schedule based on performance metrics. It applies the precision of municipal data entry to your fitness tracking, ensuring you get the most out of your workouts.</p>
|
||
|
|
<p>For more information on fitness trackers, visit <a href="https://www.wikidata.org/wiki/Q16001686">Wikidata</a>.</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<fort-citizen name="alexandra-martin"><div class="fort-citizen" data-fort="citizen" data-citizen="alexandra-martin"><a class="fc-name" href="https://alexandra-martin.4ort.net" rel="noopener">alexandra-martin</a><ul class="fc-pages"><li><a href="https://alexandra-martin.4ort.net/field-notes.html" rel="noopener">Field Notes</a></li><li><a href="https://alexandra-martin.4ort.net/palette.html" rel="noopener">Palette</a></li><li><a href="https://alexandra-martin.4ort.net/field-notes.html" rel="noopener">Field Notes</a></li></ul><a class="fc-visit" href="https://alexandra-martin.4ort.net" rel="noopener">visit alexandra-martin.4ort.net →</a></div></fort-citizen>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
function calculate() {
|
||
|
|
const workoutType = document.getElementById('workoutType').value;
|
||
|
|
const duration = parseInt(document.getElementById('duration').value);
|
||
|
|
const intensity = parseInt(document.getElementById('intensity').value);
|
||
|
|
const heartRate = parseInt(document.getElementById('heartRate').value);
|
||
|
|
|
||
|
|
if (isNaN(duration) || isNaN(intensity) || isNaN(heartRate)) {
|
||
|
|
alert('Please enter valid numbers for duration, intensity, and heart rate.');
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
const caloriesBurned = (duration * intensity * heartRate) / 100;
|
||
|
|
const efficiencyScore = (intensity * heartRate) / duration;
|
||
|
|
|
||
|
|
const result = `
|
||
|
|
<h3>Results</h3>
|
||
|
|
<p><strong>Workout Type:</strong> ${workoutType}</p>
|
||
|
|
<p><strong>Calories Burned:</strong> ${caloriesBurned.toFixed(2)}</p>
|
||
|
|
<p><strong>Efficiency Score:</strong> ${efficiencyScore.toFixed(2)}</p>
|
||
|
|
<p><strong>Recommendation:</strong> Based on your input, consider adjusting your workout intensity or duration to optimize your performance.</p>
|
||
|
|
`;
|
||
|
|
|
||
|
|
document.getElementById('result').innerHTML = result;
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|