Merge pull request #22 from capn-nepal/feature/popup-button

Popup button component

Author: AdityaKhatri

src/app/about/Goals/index.tsx src/app/about/approach/Goals/index.tsxsrc/app/about/Goals/index.tsx renamed to src/app/about/approach/Goals/index.tsx

@@ -0,0 +1,33 @@
+import Banner from '#components/Banner';
+import Divider from '#components/Divider';
+import Page from '#components/Page';
+import AboutUsImage from '#public/aboutUsImage.jpg';
+
+import Goals from './Goals';
+import Values from './Values';
+import VisionMission from './VisionMission';
+
+import styles from './page.module.css';
+
+export default function About() {
+    return (
+        <Page>
+            <Banner
+                // NOTE: We need to replace with the real image as mentioned in figma
+                bannerImageSrc={AboutUsImage}
+                eyebrowHeading="Our Approach"
+                heading={(
+                    <>
+                        Empowering Change Through
+                        <br />
+                        <span>Gender-Equal Citizenship</span>
+                    </>
+                )}
+            />
+            <VisionMission />
+            <Divider />
+            <Goals />
+            <Values />
+        </Page>
+    );
+}

src/app/about/Goals/styles.module.css …p/about/approach/Goals/styles.module.csssrc/app/about/Goals/styles.module.css renamed to src/app/about/approach/Goals/styles.module.css src/app/about/Goals/styles.module.css renamed to src/app/about/approach/Goals/styles.module.css

@@ -1,33 +1,5 @@
-import Banner from '#components/Banner';
-import Divider from '#components/Divider';
-import Page from '#components/Page';
-import AboutUsImage from '#public/aboutUsImage.jpg';
+import { redirect } from 'next/navigation';
 
-import Goals from './Goals';
-import Values from './Values';
-import VisionMission from './VisionMission';
-
-import styles from './page.module.css';
-
-export default function About() {
-    return (
-        <Page>
-            <Banner
-                // NOTE: We need to replace with the real image as mentioned in figma
-                bannerImageSrc={AboutUsImage}
-                eyebrowHeading="Our Approach"
-                heading={(
-                    <>
-                        Empowering Change Through
-                        <br />
-                        <span>Gender-Equal Citizenship</span>
-                    </>
-                )}
-            />
-            <VisionMission />
-            <Divider />
-            <Goals />
-            <Values />
-        </Page>
-    );
+export default function AboutRedirect() {
+    redirect('/about/approach');
 }

src/app/about/Values/index.tsx src/app/about/approach/Values/index.tsxsrc/app/about/Values/index.tsx renamed to src/app/about/approach/Values/index.tsx

@@ -41,6 +41,10 @@
     --border-radius-small: 12px;
     --border-radius-extra-small: 8px;
 
+    --border-radius-popup: 3px;
+    --blur-radius-popup: 1px;
+    --color-shadow: rgba(0,0,0,.5);
+
         /* Font size */
     --font-size-super-small: calc(var(--font-size-base) / (var(--multiplier) * var(--multiplier) * var(--multiplier)));
     --font-size-extra-small: calc(var(--font-size-base) / (var(--multiplier) * var(--multiplier)));