Skip to content

Commit 6bdf2d0

Browse files
cassiodevelopercassiodeveloper
committed
menu
1 parent b20ee9d commit 6bdf2d0

2 files changed

Lines changed: 175 additions & 196 deletions

File tree

‎css/style.css‎

Lines changed: 20 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ body {
3333

3434
a { color:inherit; text-decoration:none }
3535

36-
.wrap { max-width:var(--max); margin:0 auto; padding:36px 20px 90px }
36+
.wrap { max-width:var(--max); margin:0 auto; padding:35px 20px}
3737

3838
.top {
3939
display:flex;
@@ -287,4 +287,23 @@ footer {
287287

288288
.hero {
289289
backdrop-filter: blur(10px);
290+
}
291+
292+
.featurebase {
293+
display: block;
294+
padding: 7px;
295+
font-size: 12px;
296+
margin: 0;
297+
background: #fff;
298+
color: #000;
299+
position: fixed;
300+
bottom: 0;
301+
right: 0;
302+
border-top: 1px solid rgba(0, 0, 0, 0.125);
303+
border-left: 1px solid rgba(0, 0, 0, 0.125);
304+
border-top-left-radius: 12px;
305+
z-index: 99;
306+
font-weight: bold;
307+
text-decoration: none;
308+
transition: all 0.2s ease;
290309
}

‎index.html‎

Lines changed: 155 additions & 195 deletions
Original file line numberDiff line numberDiff line change
@@ -57,209 +57,169 @@
5757
}
5858
</script>
5959
</head>
60-
61-
<body>
62-
<div class="wrap">
63-
64-
<!-- TOP -->
65-
<div class="top">
66-
<div class="brand">
67-
<div class="mark" aria-hidden="true"></div>
68-
<div>Easy Ironing</div>
69-
</div>
70-
71-
<nav class="nav">
72-
<a href="#how">How</a>
73-
<a href="#features">Features</a>
74-
<a href="#faq">FAQ</a>
75-
</nav>
76-
</div>
77-
78-
<!-- HERO -->
79-
<section class="hero" aria-label="Hero">
80-
<div class="hero-inner">
81-
82-
<div>
83-
<div class="tag">🧺 Telegram bot · ⚡ Instant · 🔒 Private by default</div>
84-
85-
<h1>Stop ruining clothes.<br />
86-
<span class="soft">Iron with precision.</span>
87-
</h1>
88-
89-
<p class="sub">
90-
Send a care-label photo on Telegram.<br>
91-
Get fabric-aware instructions in seconds.<br>
92-
No signup. No email.
93-
</p>
94-
95-
<div class="cta">
96-
<a class="btn primary" href="https://t.me/EasyIroningBot" target="_blank" rel="noreferrer">
97-
🚀 Open in Telegram <small>Free (1 image)</small>
98-
</a>
99-
<a class="btn ghost" href="#how">See how it works</a>
100-
</div>
101-
102-
<div style="margin-top:10px; font-size:13px; color:rgba(229,231,235,.55)">
103-
✓ No personal data stored
104-
✓ Payments handled by Stripe
105-
✓ Photos not saved
106-
</div>
107-
108-
<div style="margin-top:14px; font-size:13px; color:rgba(229,231,235,.55)">
109-
By using Easy Ironing you agree to our
110-
<a href="/terms.html" style="text-decoration:underline">Terms</a>
111-
and
112-
<a href="/privacy.html" style="text-decoration:underline">Privacy Policy</a>.
113-
</div>
114-
115-
<div class="pills">
116-
<span class="pill">🧵 Fabric-aware</span>
117-
<span class="pill">🔥 Temperature guidance</span>
118-
<span class="pill">💨 Steam tips</span>
119-
<span class="pill">⚠️ Important alerts</span>
120-
<span class="pill">🧾 chatId only</span>
60+
<body>
61+
<div class="wrap">
62+
<div class="top">
63+
<div class="brand">
64+
<div class="mark" aria-hidden="true"></div>
65+
<div>Easy Ironing</div>
12166
</div>
122-
123-
<div class="steps" id="how">
124-
<div class="step">
125-
<b>1) 📸 Photo</b>
126-
<span>Take a clear photo of the label.</span>
67+
<nav class="nav">
68+
<a href="#how">How</a>
69+
<a href="#features">Features</a>
70+
<a href="#faq">FAQ</a>
71+
<a href="https://cassiodeveloper.featurebase.app/en">Ideas + Bugs</a>
72+
</nav>
73+
</div>
74+
<section class="hero" aria-label="Hero">
75+
<div class="hero-inner">
76+
<div>
77+
<div class="tag">🧺 Telegram bot · ⚡ Instant · 🔒 Private by default</div>
78+
<h1>Stop ruining clothes.<br />
79+
<span class="soft">Iron with precision.</span>
80+
</h1>
81+
<p class="sub">
82+
Send a care-label photo on Telegram.<br>
83+
Get fabric-aware instructions in seconds.<br>
84+
No signup. No email.
85+
</p>
86+
<div class="cta">
87+
<a class="btn primary" href="https://t.me/EasyIroningBot" target="_blank" rel="noreferrer">
88+
🚀 Open in Telegram <small>Free (1 image)</small>
89+
</a>
90+
<a class="btn ghost" href="#how">See how it works</a>
91+
</div>
92+
<div style="margin-top:10px; font-size:13px; color:rgba(229,231,235,.55)">
93+
✓ No personal data stored
94+
✓ Payments handled by Stripe
95+
✓ Photos not saved
96+
</div>
97+
<div style="margin-top:14px; font-size:13px; color:rgba(229,231,235,.55)">
98+
By using Easy Ironing you agree to our
99+
<a href="/terms.html" style="text-decoration:underline">Terms</a>
100+
and
101+
<a href="/privacy.html" style="text-decoration:underline">Privacy Policy</a>.
102+
</div>
103+
<div class="pills">
104+
<span class="pill">🧵 Fabric-aware</span>
105+
<span class="pill">🔥 Temperature guidance</span>
106+
<span class="pill">💨 Steam tips</span>
107+
<span class="pill">⚠️ Important alerts</span>
108+
<span class="pill">🧾 chatId only</span>
109+
</div>
110+
<div class="steps" id="how">
111+
<div class="step">
112+
<b>1) 📸 Photo</b>
113+
<span>Take a clear photo of the label.</span>
114+
</div>
115+
<div class="step">
116+
<b>2) ✅ Send</b>
117+
<span>Send it directly in Telegram.</span>
118+
</div>
119+
<div class="step">
120+
<b>3) 🧺 Iron</b>
121+
<span>Follow the safe instructions.</span>
122+
</div>
123+
</div>
127124
</div>
128-
<div class="step">
129-
<b>2) ✅ Send</b>
130-
<span>Send it directly in Telegram.</span>
125+
<div class="phone" aria-label="Example chat">
126+
<div class="phone-top">
127+
<div class="phone-title">Easy Ironing</div>
128+
<div class="mono" style="color:rgba(229,231,235,.65)">online</div>
129+
</div>
130+
<div class="chat">
131+
<div class="bubble me">
132+
<div class="imgph">Label photo</div>
133+
</div>
134+
<div class="bubble bot">
135+
🔥 Medium heat (max 150°C)<br>
136+
💨 Steam allowed<br>
137+
🔄 Iron inside out<br>
138+
⚠️ Avoid prints
139+
</div>
140+
<div class="bubble me">Finally clear instructions.</div>
141+
</div>
131142
</div>
132-
<div class="step">
133-
<b>3) 🧺 Iron</b>
134-
<span>Follow the safe instructions.</span>
143+
</div>
144+
</section>
145+
<section id="features" class="section grid" aria-label="Features">
146+
<div class="card">
147+
<div class="pad">
148+
<div class="kicker">Practical</div>
149+
<h2>Precise temperature</h2>
150+
<p>Heat levels based on actual fabric rules, not guesswork.</p>
135151
</div>
136152
</div>
137-
</div>
138-
139-
<!-- PHONE MOCK -->
140-
<div class="phone" aria-label="Example chat">
141-
<div class="phone-top">
142-
<div class="phone-title">Easy Ironing</div>
143-
<div class="mono" style="color:rgba(229,231,235,.65)">online</div>
153+
<div class="card">
154+
<div class="pad">
155+
<div class="kicker">Safe</div>
156+
<h2>Damage prevention</h2>
157+
<p>Warnings for prints, synthetics and delicate fibers.</p>
158+
</div>
144159
</div>
145-
146-
<div class="chat">
147-
<div class="bubble me">
148-
<div class="imgph">Label photo</div>
160+
<div class="card">
161+
<div class="pad">
162+
<div class="kicker">Private</div>
163+
<h2>Privacy by design</h2>
164+
<p>We use only your Telegram chatId. No account. No profile.</p>
149165
</div>
150-
151-
<div class="bubble bot">
152-
🔥 Medium heat (max 150°C)<br>
153-
💨 Steam allowed<br>
154-
🔄 Iron inside out<br>
155-
⚠️ Avoid prints
166+
</div>
167+
<div class="card">
168+
<div class="pad">
169+
<div class="kicker">Premium</div>
170+
<h2>Unlimited with Premium</h2>
171+
<p>Simple monthly subscription. Cancel anytime.</p>
156172
</div>
157-
158-
<div class="bubble me">Finally clear instructions.</div>
159173
</div>
160-
</div>
161-
162-
</div>
163-
</section>
164-
165-
<!-- FEATURES -->
166-
<section id="features" class="section grid" aria-label="Features">
167-
168-
<div class="card">
169-
<div class="pad">
170-
<div class="kicker">Practical</div>
171-
<h2>Precise temperature</h2>
172-
<p>Heat levels based on actual fabric rules, not guesswork.</p>
173-
</div>
174-
</div>
175-
176-
<div class="card">
177-
<div class="pad">
178-
<div class="kicker">Safe</div>
179-
<h2>Damage prevention</h2>
180-
<p>Warnings for prints, synthetics and delicate fibers.</p>
181-
</div>
182-
</div>
183-
184-
<div class="card">
185-
<div class="pad">
186-
<div class="kicker">Private</div>
187-
<h2>Privacy by design</h2>
188-
<p>We use only your Telegram chatId. No account. No profile.</p>
189-
</div>
190-
</div>
191-
192-
<div class="card">
193-
<div class="pad">
194-
<div class="kicker">Premium</div>
195-
<h2>Unlimited with Premium</h2>
196-
<p>Simple monthly subscription. Cancel anytime.</p>
197-
</div>
198-
</div>
199-
200-
</section>
201-
202-
<!-- FAQ -->
203-
<section id="faq" class="section card" aria-label="FAQ">
204-
<div class="pad">
205-
206-
<div class="kicker">FAQ</div>
207-
208-
<h2>Do you store my photos?</h2>
209-
<p>
210-
Photos are processed to generate instructions and are not stored as permanent history.
211-
</p>
212-
213-
<h2 style="margin-top:18px;">What data do you store?</h2>
214-
<p>
215-
Only your Telegram chatId to manage usage limits and Premium access.
216-
We do not collect name, email, or personal details.
217-
</p>
218-
219-
<h2 style="margin-top:18px;">How are payments handled?</h2>
220-
<p>
221-
Payments are processed securely by Stripe.
222-
We do not store card details and we do not have access to payment credentials.
223-
</p>
224-
225-
<h2 style="margin-top:18px;">Free vs Premium?</h2>
226-
<p>
227-
Free allows 1 image. Premium unlocks unlimited usage.
228-
</p>
229-
230-
</div>
231-
</section>
232-
233-
<!-- FINAL CTA -->
234-
<section class="final">
235-
<div>
236-
<div class="kicker">Ready?</div>
237-
<h2 style="margin:8px 0 6px">
238-
Iron correctly. Every time.
239-
</h2>
240-
<p>Stop guessing and start ironing safely.</p>
241-
</div>
242-
243-
<div class="cta">
244-
<a class="btn primary" href="https://t.me/EasyIroningBot" target="_blank" rel="noreferrer">
245-
🧺 Open Easy Ironing
246-
</a>
247-
</div>
248-
</section>
249-
250-
<!-- FOOTER -->
251-
<footer>
252-
<div>© <span id="y"></span> Easy Ironing</div>
253-
254-
<div style="display:flex; gap:14px; flex-wrap:wrap">
255-
<a href="/privacy.html">Privacy</a>
256-
<a href="/terms.html">Terms</a>
257-
<a href="https://t.me/EasyIroningBot" target="_blank" rel="noreferrer">Telegram</a>
174+
</section>
175+
<section id="faq" class="section card" aria-label="FAQ">
176+
<div class="pad">
177+
<div class="kicker">FAQ</div>
178+
<h2>Do you store my photos?</h2>
179+
<p>
180+
Photos are processed to generate instructions and are not stored as permanent history.
181+
</p>
182+
<h2 style="margin-top:18px;">What data do you store?</h2>
183+
<p>
184+
Only your Telegram chatId to manage usage limits and Premium access.
185+
We do not collect name, email, or personal details.
186+
</p>
187+
<h2 style="margin-top:18px;">How are payments handled?</h2>
188+
<p>
189+
Payments are processed securely by Stripe.
190+
We do not store card details and we do not have access to payment credentials.
191+
</p>
192+
<h2 style="margin-top:18px;">Free vs Premium?</h2>
193+
<p>
194+
Free allows 1 image. Premium unlocks unlimited usage.
195+
</p>
196+
</div>
197+
</section>
198+
<section class="final">
199+
<div>
200+
<div class="kicker">Ready?</div>
201+
<h2 style="margin:8px 0 6px">
202+
Iron correctly. Every time.
203+
</h2>
204+
<p>Stop guessing and start ironing safely.</p>
205+
</div>
206+
<div class="cta">
207+
<a class="btn primary" href="https://t.me/EasyIroningBot" target="_blank" rel="noreferrer">
208+
🧺 Open Easy Ironing
209+
</a>
210+
</div>
211+
</section>
212+
<footer>
213+
<div>© <span id="y"></span> Easy Ironing</div>
214+
<div style="display:flex; gap:14px; flex-wrap:wrap">
215+
<a href="/privacy.html">Privacy</a>
216+
<a href="/terms.html">Terms</a>
217+
<a href="https://t.me/EasyIroningBot" target="_blank" rel="noreferrer">Telegram</a>
218+
<a href="https://cassiodeveloper.featurebase.app/en">Ideas + Bugs</a>
219+
</div>
220+
</footer>
221+
<a target="_blank" class="featurebase" href="https://cassiodeveloper.featurebase.app/en">💡 Ideas + 🪲 Bugs</a>
258222
</div>
259-
</footer>
260-
261-
</div>
262-
263-
<script src="js/script.js" type="text/javascript"></script>
264-
</body>
223+
<script src="js/script.js" type="text/javascript"></script>
224+
</body>
265225
</html>

0 commit comments

Comments
 (0)