7777 height : 80px ; /* Smaller on mobile */
7878 width : 100% ;
7979 }
80+
81+ nav ul {
82+ display : none;
83+ flex-direction : column;
84+ position : absolute;
85+ top : 60px ;
86+ left : 0 ;
87+ width : 100% ;
88+ background : # 0A4D68 ;
89+ padding : 20px ;
90+ }
91+
92+ nav ul .active {
93+ display : flex;
94+ }
95+
96+ .hamburger {
97+ display : block;
98+ }
99+
100+ header h1 {
101+ font-size : 2.5rem ;
102+ }
103+
104+ header p {
105+ font-size : 1.2rem ;
106+ }
107+
108+ .cta-button {
109+ padding : 10px 20px ;
110+ font-size : 1rem ;
111+ }
112+
113+ section h2 {
114+ font-size : 1.8rem ;
115+ }
116+
117+ .screenshots {
118+ grid-template-columns : repeat (auto-fit, minmax (200px , 1fr ));
119+ }
80120 }
81121
82122 nav ul {
398438 }
399439
400440 /* Responsive Design */
401- @media (max-width : 768px ) {
402- nav ul {
403- display : none;
404- flex-direction : column;
405- position : absolute;
406- top : 60px ;
407- left : 0 ;
408- width : 100% ;
409- background : # 0A4D68 ;
410- padding : 20px ;
411- }
412-
413- nav ul .active {
414- display : flex;
415- }
416-
417- .hamburger {
418- display : block;
419- }
420-
421- header h1 {
422- font-size : 2.5rem ;
423- }
424-
425- header p {
426- font-size : 1.2rem ;
427- }
428-
429- .cta-button {
430- padding : 10px 20px ;
431- font-size : 1rem ;
432- }
433-
434- section h2 {
435- font-size : 1.8rem ;
436- }
437-
438- .screenshots {
439- grid-template-columns : repeat (auto-fit, minmax (200px , 1fr ));
440- }
441- }
442-
443441 @media (max-width : 480px ) {
444442 header h1 {
445443 font-size : 2rem ;
686684 < li > < a href ="https://github.com/MicroPythonOS/MicroPythonOS/releases " target ="_blank " aria-label ="Download MicroPythonOS "> Download</ a > </ li >
687685 < li > < a href ="https://chat.MicroPythonOS.com " target ="_blank " aria-label ="Community Chat "> Community</ a > </ li >
688686 < li > < a href ="https://docs.MicroPythonOS.com " target ="_blank " aria-label ="Documentation "> Documentation</ a > </ li >
689- < li > < a href ="mailto:info@MicroPythonOS.com " target =" _blank " aria-label ="Contact MicroPythonOS "> Contact</ a > </ li >
687+ < li > < a href ="mailto:info@MicroPythonOS.com " aria-label ="Contact MicroPythonOS "> Contact</ a > </ li >
690688 </ ul >
691689 < div class ="hamburger " onclick ="toggleMenu() "> ☰</ div >
692690 </ div >
@@ -711,6 +709,7 @@ <h2>Why MicroPythonOS?</h2>
711709 < section >
712710 < h2 > Screenshots</ h2 >
713711 < div class ="screenshots ">
712+ <!-- Adding "data-play-overlay" to the <video/> tags below will show a nice "Play" button instead of autoplay, but for now, autoplay is more fun. -->
714713 <!-- <img src="screenshots/light/0.0.6/launcher.png" alt="Launcher Screenshot"/> -->
715714 < video autoplay loop muted playsinline poster ="screenshots/light/0.7.2/launcher_appstore.png " width ="320 " height ="240 " preload ="auto ">
716715 < source src ="screenshots/light/0.7.2/launcher-2026-01-28_19.19.21.mp4 " type ="video/mp4 ">
@@ -745,13 +744,14 @@ <h2>Screenshots</h2>
745744 <!-- <img src="screenshots/light/0.0.6/mpos_camera_qr_320x240.png" alt="Camera QR Code Screenshot"/> -->
746745 < img src ="screenshots/light/0.7.2/camera_qr_code.png " alt ="Camera QR Code Screenshot "/>
747746
747+
748+
748749 <!-- <img src="screenshots/light/0.0.6/osupdate_progress3.png" alt="OS Update Progress Screenshot"/> -->
749750 < video autoplay loop muted playsinline poster ="screenshots/light/0.7.2/osupdate_67.png " width ="320 " height ="240 " preload ="auto ">
750751 < source src ="screenshots/light/0.7.2/osupdate-2026-01-28_19.39.18_cut.mp4 " type ="video/mp4 ">
751752 < img src ="screenshots/light/0.7.2/osupdate_67.png " alt ="MicroPythonOS AppStore ">
752753 </ video >
753754 <!-- <img src="screenshots/dark/0.0.4/0.0.4_launcher1.png" alt="Dark Theme Launcher Screenshot"/> -->
754-
755755 < img src ="screenshots/light/0.0.6/image_viewer.png " alt ="Image Viewer Screenshot "/>
756756 < img src ="screenshots/dark/0.3.3/wifi_password.png " alt ="Dark Theme WiFi Password Screenshot "/>
757757 <!-- <img src="screenshots/dark/0.0.4/0.0.4_appstore_uninstall_draw.png" alt="Dark Theme App Store Uninstall Screenshot"/> -->
@@ -902,7 +902,7 @@ <h2>Possibilities</h2>
902902 < div class ="social-links ">
903903 < a href ="https://chat.MicroPythonOS.com " target ="_blank "> Community Chat</ a > |
904904 < a href ="https://github.com/MicroPythonOS " target ="_blank "> GitHub</ a > |
905- < a href ="mailto:info@MicroPythonOS.com " target =" _blank " > Email</ a >
905+ < a href ="mailto:info@MicroPythonOS.com "> Email</ a >
906906 </ div >
907907 </ footer >
908908
0 commit comments