1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
|
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<meta name="description"
content="What's Left Timer — the simplest way to keep track of the moments that matter. Create unlimited countdowns for birthdays, deadlines, trips, and more." />
<meta name="keywords"
content="countdown timer, what's left timer, countdown app, birthday countdown, deadline tracker, event timer, simple countdown" />
<meta property="og:title" content="What's Left Timer — Every Second Counts" />
<meta property="og:description"
content="The simplest way to keep track of the moments that matter. Create unlimited countdowns for birthdays, deadlines, trips, and more." />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://sillylaird.ca/whatsleft/" />
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="What's Left Timer — Every Second Counts" />
<meta name="twitter:description"
content="The simplest way to keep track of the moments that matter. Create unlimited countdowns for any date." />
<link rel="canonical" href="https://sillylaird.ca/whatsleft/" />
<link rel="icon" href="/assets/img/lain.png" />
<title>What's Left Timer — SillyLaird</title>
<link rel="stylesheet" href="/assets/css/fonts.css" />
<link rel="stylesheet" href="/assets/css/site.css?v=1.5" />
<style>
.wl-hero {
text-align: center;
padding: var(--space-3xl) var(--space-lg);
}
.wl-hero h1 {
font-size: var(--fs-3xl);
margin: 0 0 var(--space-sm);
letter-spacing: -0.02em;
}
.wl-tagline {
font-size: var(--fs-lg);
color: var(--muted);
margin: 0 0 var(--space-2xl);
max-width: 540px;
margin-inline: auto;
}
.wl-demo {
display: flex;
justify-content: center;
gap: var(--space-lg);
flex-wrap: wrap;
margin: var(--space-2xl) auto;
max-width: 500px;
}
.wl-demo-unit {
text-align: center;
min-width: 70px;
}
.wl-demo-num {
font-size: var(--fs-2xl);
font-weight: 700;
font-variant-numeric: tabular-nums;
display: block;
}
.wl-demo-label {
font-size: var(--fs-xs);
color: var(--muted);
text-transform: uppercase;
letter-spacing: 0.08em;
}
.wl-section {
max-width: 640px;
margin: 0 auto;
padding: var(--space-2xl) var(--space-lg);
}
.wl-section h2 {
font-size: var(--fs-xl);
margin: 0 0 var(--space-md);
}
.wl-features {
list-style: none;
padding: 0;
margin: var(--space-lg) 0;
}
.wl-features li {
padding: var(--space-sm) 0;
border-bottom: 1px solid var(--border);
font-size: var(--fs-base);
}
.wl-features li:last-child {
border-bottom: none;
}
.wl-cta {
text-align: center;
padding: var(--space-2xl) var(--space-lg) var(--space-3xl);
}
.wl-cta p {
font-size: var(--fs-lg);
color: var(--muted);
max-width: 480px;
margin: 0 auto var(--space-lg);
}
.wl-badge-row {
display: flex;
justify-content: center;
gap: var(--space-md);
flex-wrap: wrap;
margin-top: var(--space-lg);
}
.wl-badge {
display: inline-block;
padding: var(--space-sm) var(--space-lg);
border: 1px solid var(--border);
border-radius: var(--r);
color: var(--ink);
text-decoration: none;
font-size: var(--fs-sm);
transition: border-color 0.2s;
}
.wl-badge:hover {
border-color: var(--accent);
}
.wl-separator {
width: 60px;
border: none;
border-top: 1px solid var(--border);
margin: var(--space-xl) auto;
}
</style>
</head>
<body>
<a class="skip-link" href="#main">Skip to content</a>
<?php include $_SERVER['DOCUMENT_ROOT'] . '/partials/header.php'; ?>
<main id="main" class="wrap stack">
<section class="wl-hero" aria-labelledby="wl-title">
<h1 id="wl-title">What's Left Timer</h1>
<p class="wl-tagline">Every second counts. The simplest way to keep track of the moments that matter.</p>
<div class="wl-demo" aria-label="Live countdown demo">
<div class="wl-demo-unit">
<span class="wl-demo-num" id="wl-days">--</span>
<span class="wl-demo-label">Days</span>
</div>
<div class="wl-demo-unit">
<span class="wl-demo-num" id="wl-hours">--</span>
<span class="wl-demo-label">Hours</span>
</div>
<div class="wl-demo-unit">
<span class="wl-demo-num" id="wl-mins">--</span>
<span class="wl-demo-label">Minutes</span>
</div>
<div class="wl-demo-unit">
<span class="wl-demo-num" id="wl-secs">--</span>
<span class="wl-demo-label">Seconds</span>
</div>
</div>
<p style="font-size: var(--fs-xs); color: var(--muted);">until New Year's Day</p>
</section>
<hr class="wl-separator" />
<section class="wl-section">
<h2>Keep your countdowns front and center</h2>
<p>
What's Left Timer keeps your most important countdowns front and center — birthdays, deadlines, trips, and more.
Add a countdown, give it a name, and always know exactly how much time you have left.
</p>
<p>
Whether you're counting down to a vacation, a big deadline, a birthday, or just the weekend —
What's Left Timer keeps everything organized in one clean, distraction-free place.
</p>
</section>
<section class="wl-section">
<h2>Features</h2>
<ul class="wl-features">
<li>Create unlimited countdowns for any date</li>
<li>See days, hours, minutes, and seconds at a glance</li>
<li>Clean, intuitive interface that stays out of your way</li>
<li>Instant updates — always accurate, always current</li>
</ul>
</section>
<hr class="wl-separator" />
<section class="wl-cta">
<p>No clutter. No complexity. Just your countdowns, clearly laid out and ready when you need them.</p>
<p><strong>Download What's Left Timer and start counting down to what's next.</strong></p>
<div class="wl-badge-row">
<a class="wl-badge" href="https://apps.apple.com/us/app/whats-left-timer/id6760128000">App Store</a>
</div>
</section>
</main>
<?php include $_SERVER['DOCUMENT_ROOT'] . '/partials/footer.php'; ?>
<script src="/assets/js/pages/whatsleft.js" defer></script>
</body>
</html>
|
