|
|
<!doctype html> |
|
|
<html> |
|
|
|
|
|
<head> |
|
|
<meta charset="utf-8" /> |
|
|
<meta name="viewport" content="width=device-width" /> |
|
|
<title>Reachy Mini Clock</title> |
|
|
<link rel="stylesheet" href="style.css" /> |
|
|
</head> |
|
|
|
|
|
<body> |
|
|
<div class="background-accent"></div> |
|
|
<header class="hero container"> |
|
|
<div class="badge">Reachy Mini</div> |
|
|
<h1>Reachy Mini Clock</h1> |
|
|
<p class="lead">Use Reachy Mini as a clock! The right antenna shows hours and the left antenna minutes.</p> |
|
|
<div class="hero-pills"> |
|
|
<span class="pill">Right antenna = hours</span> |
|
|
<span class="pill">Left antenna = minutes</span> |
|
|
<span class="pill">Hands-free, room-friendly timekeeping</span> |
|
|
</div> |
|
|
</header> |
|
|
|
|
|
<main class="container grid"> |
|
|
<section class="panel info"> |
|
|
<h2>How it works</h2> |
|
|
<ul class="steps"> |
|
|
<li> |
|
|
<span class="step-number">1</span> |
|
|
<div> |
|
|
<h3>Launch the app</h3> |
|
|
<p>Wake up Reachy Mini and start the clock app from your dashboard.</p> |
|
|
</div> |
|
|
</li> |
|
|
<li> |
|
|
<span class="step-number">2</span> |
|
|
<div> |
|
|
<h3>Pick your timezone</h3> |
|
|
<p>Use the app's GUI to select your timezone and save it!</p> |
|
|
</div> |
|
|
</li> |
|
|
<li> |
|
|
<span class="step-number">3</span> |
|
|
<div> |
|
|
<h3>Read the antennas</h3> |
|
|
<p>Glance at Reachy: the right antenna points to the hour while the left sweeps the minutes.</p> |
|
|
</div> |
|
|
</li> |
|
|
</ul> |
|
|
</section> |
|
|
|
|
|
<section class="panel visual"> |
|
|
<div class="placeholder"> |
|
|
<div class="placeholder-tag">Preview</div> |
|
|
<div class="placeholder-graphic"> |
|
|
<div class="dial"></div> |
|
|
<div class="antenna antenna-right"></div> |
|
|
<div class="antenna antenna-left"></div> |
|
|
</div> |
|
|
<p class="placeholder-caption">Placeholder image for the future Reachy Mini clock view.</p> |
|
|
</div> |
|
|
</section> |
|
|
</main> |
|
|
|
|
|
<footer class="footer"> |
|
|
<p> |
|
|
🤖 Reachy Mini Clock • |
|
|
<a href="https://github.com/pollen-robotics" target="_blank">Pollen Robotics</a> • |
|
|
<a href="https://huggingface.co/spaces/pollen-robotics/Reachy_Mini_Apps" target="_blank">Browse more apps</a> |
|
|
</p> |
|
|
</footer> |
|
|
</body> |
|
|
|
|
|
</html> |
|
|
|