alina
/
Pebble-Time-Watchface-Squared-4.0
1
1
Fork 0
Code Releases Activity
Pebble-Time-Watchface-Squar.../config/squared414/index.html

297 lines
12 KiB
HTML
Raw Permalink Blame History

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Squared 4.0 Settings</title>
<link rel="stylesheet" href="css/slate.min.css">
<link rel="stylesheet" href="squared.min.css">
<body>
<div class="item-container">
<div class="item-container-header">Colors</div>
<div class="item-container-content">
<label class="item bwhide">
Numbers
<select id="num_color" dir='rtl' class="item-select">
<option>White</option>
<option selected="selected">Diamond</option>
<option>Ruby</option>
<option>Fire</option>
<option>Forest</option>
<option>Quartz</option>
<option>Red</option>
<option>Green</option>
<option>Blue</option>
<option>Yellow</option>
<option>Cyan</option>
<option>Magenta</option>
<option>Violet</option>
<option>Orange</option>
<option>Vivid Cerulean</option>
<option>Chrome Yellow</option>
<option>Spring Green</option>
<option>Black</option>
<option>Dark Gray</option>
<option>Light Gray</option>
</select>
</label>
<label class="item bwhide">
Ornaments
<select id="orn_color" dir='rtl' class="item-select">
<option>Diamond</option>
<option selected="selected">Ruby</option>
<option>Fire</option>
<option>Forest</option>
<option>Quartz</option>
<option>Red</option>
<option>Green</option>
<option>Blue</option>
<option>Yellow</option>
<option>Cyan</option>
<option>Magenta</option>
<option>Violet</option>
<option>Orange</option>
<option>Vivid Cerulean</option>
<option>Chrome Yellow</option>
<option>Spring Green</option>
<option>Black</option>
<option>Dark Gray</option>
<option>Light Gray</option>
<option>White</option>
</select>
</label>
<label class="item bwhide">
Background
<select id="bg_color" dir='rtl' class="item-select">
<option selected="selected">Black</option>
<option>White</option>
<option>Dark Gray</option>
<option>Light Gray</option>
<option>Red</option>
<option>Green</option>
<option>Blue</option>
<option>Yellow</option>
<option>Cyan</option>
<option>Magenta</option>
<option>Violet</option>
<option>Orange</option>
<option>Vivid Cerulean</option>
<option>Chrome Yellow</option>
<option>Spring Green</option>
</select>
</label>
<label class='item colorhide'>
Three Colors
<input id='monochrome' type='checkbox' checked class='item-toggle'>
</label>
<label class='item colorhide'>
Invert colors
<input id='invert' type='checkbox' class='item-toggle'>
</label>
</div>
<div class='item-container-footer bwhide'>
Diamond, Ruby, Fire, Forest and Quartz are magical facetted colors.
</div>
</div>
<div class="preview">
<img class="preview-b preview-b-round" src="img/b-Black.png" />
<div class="preview-scaler">
<img class="preview-b" src="img/b-Black.png" />
<img class="preview-o" src="img/b-Black.png" />
<img class="preview-n" src="img/b-Black.png" />
<div class="preview-zero showzero">
<img class="preview-b" src="img/b-Black.png" />
</div>
<div class="preview-zero2 showzero eurodate">
<img class="preview-b" src="img/b-Black.png" />
</div>
<div class="preview-zero showzero">
<img class="preview-o2 showzero eurodate" src="img/b-Black.png" />
</div>
<div class="preview-zero2 smallzero showzero eurodate">
<img class="preview-o2 showzero eurodate" src="img/b-Black.png" />
</div>
<div class="preview-eurodate eurodate">
<img class="preview-b" src="img/b-Black.png" />
<img class="preview-o" src="img/b-Black.png" />
<img class="preview-n" src="img/b-Black.png" />
<img class="preview-b showzero" src="img/b-Black.png" />
<img class="preview-o2 showzero" src="img/0-Ruby.png" />
<div class="preview-centeralign">
<img class="preview-b" src="img/b-Black.png" />
<img class="preview-n" src="img/b-Black.png" />
<div class="preview-centeralign-digit2">
<img class="preview-b" src="img/b-Black.png" />
<img class="preview-o" src="img/b-Black.png" />
</div>
</div>
</div>
<div class="preview-eurodate2 eurodate">
<img class="preview-b" src="img/b-Black.png" />
<img class="preview-o" src="img/b-Black.png" />
<img class="preview-n" src="img/b-Black.png" />
</div>
</div>
<img class="preview-r recthide" src="img/r-Black.png" />
</div>
</div>
<div class="previewbezel"></div>
<div class='item-container'>
<div class='item-container-header'>Appearance</div>
<div class='item-container-content'>
<label class='item'>
Leading Zeroes
<input id='zero' type='checkbox' class='item-toggle'>
</label>
<label class='item roundhide'>
Large Numbers
<input id='size' type='checkbox' class='item-toggle'>
</label>
</div>
</div>
<div class="item-container">
<div class="item-container-header">Bottom Row</div>
<div class='item-container-content'>
<label class="item">
Bottom Row Shows
<select id="bottomrow" dir='rtl' class="item-select">
<option selected="selected" value="0">Date</option>
<option value="1">Battery Level</option>
<option value="2" class="nohealthhide">Step Goal</option>
<option value="3" class="nohrhide">Heart Rate</option>
</select>
</label>
</div>
</div>
<div class='item-container' id="date-settings">
<div class='item-container-header'>Date</div>
<div class='item-container-content'>
<label class='item'>
European Date (dd/mm)
<input id='date' type='checkbox' class='item-toggle'>
</label>
<label class='item'>
Center-Align Date
<input id='center' type='checkbox' class='item-toggle'>
</label>
<label class='item'>
Replace Month With Weekday
<input id='weekday' type='checkbox' class='item-toggle'>
</label>
</div>
</div>
<div class="item-container">
<div class="item-container-header">Wrist Flick<span class="hide dioriteshow"> / Tap</span></div>
<div class='item-container-content'>
<label class="item">
Flick of the Wrist<span class="hide dioriteshow"> / Tap</span> Shows
<select id="wristflick" dir='rtl' class="item-select">
<option selected="selected" value="0">Nothing</option>
<option value="1">Battery Level</option>
<option value="2" class="nohealthhide">Step Goal</option>
</select>
</label>
</div>
<div class='item-container-footer hide dioriteshow'>
On Pebble 2 all you need to activate this is a gentle tap, or even just <a href="https://www.instagram.com/p/BNIJUDFAhli/">a snap of your Fingers!</a> #protip #ohsnap
</div>
</div>
<div class='item-container' id="step-settings">
<div class='item-container-header'>Daily Step Goal</div>
<div class='item-container-content'>
<div class='item'>
Squared gets your steps from Pebble Health.<br />Please use this slider to set your daily goal.
</div>
<label class="item">
<input type="range" id="stepgoal" class="item-slider" name="stepgoal" value="10000" min="1000" max="25000" step="1000">
<div class="item-input-wrapper item-slider-text">
<input type="text" class="item-input" name="stepgoal" id="stepgoallabel" value="10000">
</div>
</label>
<label id="quips" class='item'>
Cheeky Quips & Encouragement
<input id='cheeky' type='checkbox' checked class='item-toggle'>
</label>
</div>
<div class='item-container-footer' id="stepgoaltext">
Good, 10,000 steps are rumored to be recommended by the WHO.
</div>
</div>
<div class='item-container'>
<div class='item-container-header'>Animation</div>
<div class='item-container-content'>
<label class='item'>
Quick Animations
<input id='delay' type='checkbox' class='item-toggle'>
</label>
<label class='item'>
Battery Saver
<input id='nightsaver' type='checkbox' class='item-toggle'>
</label>
</div>
</div>
<div class='item-container hide show-on-nightsaver'>
<div class='item-container-header'>Battery Saver</div>
<div class='item-container-content'>
<label class="item">
Stop Animations at
<select id="ns_start" dir='rtl' class="item-select">
<option value="14">2:00pm</option>
<option value="16">4:00pm</option>
<option value="18">6:00pm</option>
<option value="20">8:00pm</option>
<option value="22">10:00pm</option>
<option selected="selected" value="0">Midnight</option>
<option value="2">2:00am</option>
<option value="4">4:00am</option>
<option value="6">6:00am</option>
<option value="8">8:00am</option>
<option value="10">10:00am</option>
<option value="12">Noon</option>
</select>
</label>
<label class="item">
Continue Animations at
<select id="ns_stop" dir='rtl' class="item-select">
<option value="0">Midnight</option>
<option value="2">2:00am</option>
<option value="4">4:00am</option>
<option selected="selected" value="6">6:00am</option>
<option value="8">8:00am</option>
<option value="10">10:00am</option>
<option value="12">Noon</option>
<option value="14">2:00pm</option>
<option value="16">4:00pm</option>
<option value="18">6:00pm</option>
<option value="20">8:00pm</option>
<option value="22">10:00pm</option>
</select>
</label>
</div>
</div>
<div class='item-container'>
<div class='item-container-header'>Advanced</div>
<div class='item-container-content'>
<label class='item'>
Vibrate on Disconnect
<input id='btvibe' type='checkbox' class='item-toggle'>
</label>
<label class='item bwhide'>
High Contrast While Charging
<input id='contrast' type='checkbox' class='item-toggle'>
</label>
<label class='item'>
Backlight on While Charging
<input id='backlight' type='checkbox' class='item-toggle'>
</label>
</div>
</div>
<div class="item-container">
<div class="button-container">
<input id="send" type="button" class="item-button" value="SEND">
</div>
</div>
<script src="js/slate.min.js"></script>
<script src="js/main.js"></script>
</body> <!-- hey, why are you reading my source? -->
</html>
View Git Blame Copy Permalink