build: 55712324-398e-4334-a254-fc30c84b2e47

2026-05-20 11:18:13 +00:00
commit 14a6b9a471
67 changed files with 4277 additions and 0 deletions
@@ -0,0 +1,111 @@
+import React from 'react';
+import {
+  IonApp,
+  IonContent,
+  IonPage,
+  IonButton,
+  IonIcon,
+  setupIonicReact,
+} from '@ionic/react';
+import {
+  star,
+  chevronForward,
+  calculator,
+  flash,
+  leaf,
+  flask,
+} from 'ionicons/icons';
+
+import '@ionic/react/css/core.css';
+import '@ionic/react/css/normalize.css';
+import '@ionic/react/css/structure.css';
+import '@ionic/react/css/typography.css';
+import '@ionic/react/css/padding.css';
+import '@ionic/react/css/float-elements.css';
+import '@ionic/react/css/text-alignment.css';
+import '@ionic/react/css/text-transformation.css';
+import '@ionic/react/css/flex-utils.css';
+import '@ionic/react/css/display.css';
+
+import './theme/variables.css';
+import './App.css';
+
+const urlMode = new URLSearchParams(window.location.search).get('mode');
+setupIonicReact({ mode: (urlMode === 'md' ? 'md' : 'ios') as 'ios' | 'md' });
+
+const WelcomeScreen: React.FC = () => {
+  return (
+    <IonPage>
+      <IonContent fullscreen className="welcome-content">
+        <div className="background-shapes">
+          <div className="shape-1"></div>
+          <div className="shape-2"></div>
+        </div>
+
+        <div className="content-wrapper">
+          <div className="hero-section">
+            <div className="badge">
+              <span>IGCSE Excellence</span>
+            </div>
+
+            <h1 className="hero-title">
+              Unlock Your
+              <br />
+              <span className="text-gradient">Full Potential</span>
+            </h1>
+
+            <p className="hero-subtitle">
+              Master Mathematics, Sciences, and more with interactive bite-sized
+              lessons tailored for your exams.
+            </p>
+
+            <div className="subject-pills">
+              <div className="subject-pill">
+                <div className="subject-icon icon-math">
+                  <IonIcon icon={calculator} />
+                </div>
+                <span className="subject-name">Maths</span>
+              </div>
+              <div className="subject-pill">
+                <div className="subject-icon icon-physics">
+                  <IonIcon icon={flash} />
+                </div>
+                <span className="subject-name">Physics</span>
+              </div>
+              <div className="subject-pill">
+                <div className="subject-icon icon-bio">
+                  <IonIcon icon={leaf} />
+                </div>
+                <span className="subject-name">Biology</span>
+              </div>
+              <div className="subject-pill">
+                <div className="subject-icon icon-chem">
+                  <IonIcon icon={flask} />
+                </div>
+                <span className="subject-name">Chemistry</span>
+              </div>
+            </div>
+          </div>
+
+          <div className="action-section">
+            <IonButton expand="block" className="start-button">
+              Get Started
+              <IonIcon icon={chevronForward} slot="end" />
+            </IonButton>
+            <IonButton expand="block" fill="clear" className="login-button">
+              I already have an account
+            </IonButton>
+          </div>
+        </div>
+      </IonContent>
+    </IonPage>
+  );
+};
+
+const App: React.FC = () => (
+  <IonApp>
+    <WelcomeScreen />
+  </IonApp>
+);
+
+export default App;