Skip to content

Commit 7bbb54b

Browse files
nikoschamnikoscham
committed
Add mailing list at the main page
1 parent 95620b6 commit 7bbb54b

3 files changed

Lines changed: 131 additions & 27 deletions

File tree

‎feascript-website.css‎

Lines changed: 78 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
*/
99

1010
/* ─────────────────────────────────────────────────────────────
11-
1. RESET & BASE STYLES
11+
RESET & BASE STYLES
1212
───────────────────────────────────────────────────────────── */
1313

1414
* {
@@ -32,7 +32,7 @@ body {
3232
}
3333

3434
/* ─────────────────────────────────────────────────────────────
35-
2. TYPOGRAPHY
35+
TYPOGRAPHY
3636
───────────────────────────────────────────────────────────── */
3737

3838
h1,
@@ -73,7 +73,7 @@ a {
7373
}
7474

7575
/* ─────────────────────────────────────────────────────────────
76-
3. LAYOUT & NAVIGATION
76+
LAYOUT & NAVIGATION
7777
───────────────────────────────────────────────────────────── */
7878

7979
/* Top logo */
@@ -293,7 +293,7 @@ footer {
293293
}
294294

295295
/* ─────────────────────────────────────────────────────────────
296-
4. CONTENT ELEMENTS
296+
CONTENT ELEMENTS
297297
───────────────────────────────────────────────────────────── */
298298

299299
ul {
@@ -368,8 +368,75 @@ mjx-container {
368368
margin: 1em 0;
369369
}
370370

371+
/* Maillist form */
372+
.maillist-card {
373+
max-width: 400px;
374+
background: white;
375+
border-radius: 10px;
376+
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
377+
padding: 16px;
378+
margin: 1em 0;
379+
}
380+
381+
.maillist-card h2 {
382+
margin-top: 0;
383+
}
384+
385+
.maillist-field label {
386+
display: block;
387+
color: #555;
388+
margin-bottom: 6px;
389+
}
390+
391+
.maillist-row {
392+
display: flex;
393+
gap: 10px;
394+
align-items: center;
395+
flex-wrap: wrap;
396+
}
397+
398+
.maillist-row input[type="email"] {
399+
width: 100%;
400+
padding: 10px 12px;
401+
border: 1px solid #ddd;
402+
border-radius: 6px;
403+
font-family: inherit;
404+
font-size: 100%;
405+
line-height: 1.2;
406+
}
407+
408+
.maillist-row input[type="email"]:focus {
409+
outline: none;
410+
border-color: #aaa;
411+
box-shadow: 0 0 0 3px rgba(247, 231, 183, 0.8);
412+
}
413+
414+
.maillist-button {
415+
padding: 10px 14px;
416+
border: 1px solid #e0c97f;
417+
border-radius: 6px;
418+
background: #f7e7b7;
419+
color: #333;
420+
font-family: inherit;
421+
font-size: 100%;
422+
cursor: pointer;
423+
}
424+
425+
.maillist-button:hover {
426+
transform: translateY(-1px);
427+
}
428+
429+
.maillist-responses {
430+
margin-top: 10px;
431+
}
432+
433+
.maillist-honeypot {
434+
position: absolute;
435+
left: -5000px;
436+
}
437+
371438
/* ─────────────────────────────────────────────────────────────
372-
5. INTERACTIVE COMPONENTS
439+
INTERACTIVE COMPONENTS
373440
───────────────────────────────────────────────────────────── */
374441

375442
/* Loading spinner */
@@ -515,7 +582,7 @@ mjx-container {
515582
}
516583

517584
/* ─────────────────────────────────────────────────────────────
518-
6. TUTORIALS
585+
TUTORIALS
519586
───────────────────────────────────────────────────────────── */
520587

521588
.tutorials-list {
@@ -632,7 +699,7 @@ mjx-container {
632699
}
633700

634701
/* ─────────────────────────────────────────────────────────────
635-
7. FEATURES LIST
702+
FEATURES LIST
636703
───────────────────────────────────────────────────────────── */
637704

638705
.features-list {
@@ -646,10 +713,10 @@ mjx-container {
646713
}
647714

648715
/* ─────────────────────────────────────────────────────────────
649-
8. STUDIO
716+
STUDIO
650717
───────────────────────────────────────────────────────────── */
651718

652-
/* Waitlist form */
719+
/* Maillist form */
653720
.waitlist-card {
654721
max-width: 400px;
655722
background: white;
@@ -663,18 +730,6 @@ mjx-container {
663730
margin-top: 0;
664731
}
665732

666-
.waitlist-indicates-required {
667-
font-size: 90%;
668-
color: #555;
669-
margin-top: -0.2em;
670-
margin-bottom: 0.8em;
671-
}
672-
673-
.waitlist-card .asterisk {
674-
color: #f39c12;
675-
font-weight: bold;
676-
}
677-
678733
.waitlist-field label {
679734
display: block;
680735
color: #555;
@@ -790,7 +845,7 @@ mjx-container {
790845
}
791846

792847
/* ─────────────────────────────────────────────────────────────
793-
9. MEDIA QUERIES
848+
MEDIA QUERIES
794849
───────────────────────────────────────────────────────────── */
795850

796851
/* Small screens: up to 500px */
@@ -923,7 +978,7 @@ mjx-container {
923978
}
924979

925980
#banner img {
926-
width: 250px;
981+
width: 100%;
927982
}
928983

929984
h1 {

‎index.html‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -156,6 +156,47 @@ <h1 class="top">
156156
<p class="image-caption">
157157
Heat conduction around the FEAScript logo (mesh generated by Gmsh, solved with FEAScript)
158158
</p>
159+
160+
<div id="maillist" class="maillist-card" aria-label="FEAScript maillist">
161+
<h2>Join the mailing list</h2>
162+
<p
163+
class="waitlist-disclosure"
164+
style="font-size: 0.9em; color: #666; margin-top: -5px; margin-bottom: 15px"
165+
>
166+
Receive project updates and news
167+
</p>
168+
169+
<form
170+
action="https://feascript.us10.list-manage.com/subscribe/post?u=83b4dec50b84e136c2e82c6a4&amp;id=4aa4a60f27&amp;f_id=009362e3f0"
171+
method="post"
172+
id="mc-embedded-subscribe-form"
173+
name="mc-embedded-subscribe-form"
174+
target="_blank"
175+
>
176+
<div class="maillist-field">
177+
<label for="mce-EMAIL">Email Address</label>
178+
<div class="maillist-row">
179+
<input type="email" name="EMAIL" id="mce-EMAIL" autocomplete="email" required value="" />
180+
<input
181+
type="submit"
182+
name="subscribe"
183+
id="mc-embedded-subscribe"
184+
class="maillist-button"
185+
value="Subscribe"
186+
/>
187+
</div>
188+
</div>
189+
190+
<div id="mce-responses" class="maillist-responses" aria-live="polite">
191+
<div class="response" id="mce-error-response" style="display: none"></div>
192+
<div class="response" id="mce-success-response" style="display: none"></div>
193+
</div>
194+
195+
<div class="maillist-honeypot" aria-hidden="true">
196+
<input type="text" name="b_83b4dec50b84e136c2e82c6a4_4aa4a60f27" tabindex="-1" value="" />
197+
</div>
198+
</form>
199+
</div>
159200
</div>
160201

161202
<h1>A JavaScript Finite Element Simulation Library</h1>
@@ -968,6 +1009,10 @@ <h2 id="documentation"><a name="Documentation"></a>Documentation</h2>
9681009
/></a>
9691010
</p>
9701011
</div>
1012+
<p>
1013+
You can also join the <b>FEAScript mailing list</b> to receive project updates and news:
1014+
<a href="https://mailchi.mp/e29600955ffe/join-the-mailing-list">Subscribe here</a>
1015+
</p>
9711016

9721017
<h2 id="licensing"><a name="Licensing"></a>Licensing</h2>
9731018
<p>

‎studio.html‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -160,10 +160,13 @@ <h1>FEAScript Studio: A Browser-Based Visual Editor</h1>
160160

161161
<div id="waitlist" class="waitlist-card" aria-label="FEAScript Studio waitlist">
162162
<h2>Join the Waitlist</h2>
163-
<p class="waitlist-disclosure" style="font-size: 0.9em; color: #666; margin-top: -5px; margin-bottom: 15px;">
164-
By joining the waitlist, you will also be subscribed to our mailing list to receive project updates and news
163+
<p
164+
class="waitlist-disclosure"
165+
style="font-size: 0.9em; color: #666; margin-top: -5px; margin-bottom: 15px"
166+
>
167+
By joining the waitlist, you will also be subscribed to our mailing list to receive project updates
168+
and news
165169
</p>
166-
<div class="waitlist-indicates-required"><span class="asterisk">*</span> indicates required</div>
167170

168171
<form
169172
action="https://feascript.us10.list-manage.com/subscribe/post?u=83b4dec50b84e136c2e82c6a4&amp;id=4aa4a60f27&amp;f_id=009362e3f0"
@@ -173,7 +176,7 @@ <h2>Join the Waitlist</h2>
173176
target="_blank"
174177
>
175178
<div class="waitlist-field">
176-
<label for="mce-EMAIL">Email Address <span class="asterisk">*</span></label>
179+
<label for="mce-EMAIL">Email Address</label>
177180
<div class="waitlist-row">
178181
<input type="email" name="EMAIL" id="mce-EMAIL" autocomplete="email" required value="" />
179182
<input
@@ -191,6 +194,7 @@ <h2>Join the Waitlist</h2>
191194
<div class="response" id="mce-success-response" style="display: none"></div>
192195
</div>
193196

197+
<!-- Anti-bot protection -->
194198
<div class="waitlist-honeypot" aria-hidden="true">
195199
<input type="text" name="b_83b4dec50b84e136c2e82c6a4_4aa4a60f27" tabindex="-1" value="" />
196200
</div>

0 commit comments

Comments
 (0)