afront 1.0.12 → 1.0.15

package/src/Components/Header/Header.js

@@ -56,68 +56,66 @@ const Header = () => {
   }, [isBurgerActive]);
   return (
     <header
-      className={`header  ${
-        isBurgerActive ? "off-scroll" : `${isScrolled ? "on-scroll" : ""}`
+      className={`${styles.header}  ${
+        isBurgerActive
+          ? styles.offScroll
+          : `${isScrolled ? styles.onScroll : ""}`
       } `}
       id="header"
     >
-      <nav className="navbar container">
-        <a href="/" className="brand">
+      <nav className={`${styles.navbar} ${styles.container}`}>
+        <a href="/" className={`${styles.brand}`}>
           AFront
         </a>
         <div
-          className={`burger ${isBurgerActive ? "is-active" : ""}`}
+          className={`${styles.burger} ${
+            isBurgerActive ? styles.isActive : ""
+          }`}
           id="burger"
           onClick={toggleMenu}
         >
-          <span className="burger-line"></span>
-          <span className="burger-line"></span>
-          <span className="burger-line"></span>
+          <span className={styles.burgerLine}></span>
+          <span className={styles.burgerLine}></span>
+          <span className={styles.burgerLine}></span>
         </div>
         <div
-          className={`menu ${isBurgerActive ? "is-active " : "is-inactive"}`}
+          className={`${styles.menu} ${
+            isBurgerActive ? styles.isActive : styles.isInActive
+          }`}
           id="menu"
         >
-          <ul className="menu-inner">
-            <li className="menu-item">
+          <ul className={styles.menuInner}>
+            <li className={styles.menuItem}>
               <a
                 href="#"
-                className={`menu-link ${
-                  isBurgerActive ? "menu-link-mobile" : ""
-                }`}
+                className={`${styles.menuLink} ${isBurgerActive ? styles.menuLinkMobile : ""}`}
                 onClick={closeMenu}
               >
                 Learn
               </a>
             </li>
-            <li className="menu-item">
+            <li className={styles.menuItem}>
               <a
                 href="#"
-                className={`menu-link ${
-                  isBurgerActive ? "menu-link-mobile" : ""
-                }`}
+                className={`${styles.menuLink} ${isBurgerActive ? styles.menuLinkMobile : ""}`}
                 onClick={closeMenu}
               >
                 Feature
               </a>
             </li>
-            <li className="menu-item">
+            <li className={styles.menuItem}>
               <a
                 href="#"
-                className={`menu-link ${
-                  isBurgerActive ? "menu-link-mobile" : ""
-                }`}
+                className={`${styles.menuLink} ${isBurgerActive ? styles.menuLinkMobile : ""}`}
                 onClick={closeMenu}
               >
                 Blog
               </a>
             </li>
-            <li className="menu-item">
+            <li className={styles.menuItem}>
               <a
                 href="/support"
-                className={`menu-link ${
-                  isBurgerActive ? "menu-link-mobile" : ""
-                }`}
+                className={`${styles.menuLink} ${isBurgerActive ? styles.menuLinkMobile : ""}`}
                 onClick={closeMenu}
               >
                 Support
@@ -125,11 +123,11 @@ const Header = () => {
             </li>
             {isBurgerActive && (
               <>
-                <li className="menu-item">
+                <li className={styles.menuItem}>
                   <a
                     href="#"
-                    className={`menu-link ${
-                      isBurgerActive ? "menu-link-mobile" : ""
+                    className={`${styles.menuLink} ${
+                      isBurgerActive ? styles.menuLinkMobile : ""
                     }`}
                     onClick={closeMenu}
                   >
@@ -140,7 +138,7 @@ const Header = () => {
             )}
           </ul>
         </div>
-        <a href="/" className="menu-block">
+        <a href="/" className={styles.menuBlock}>
           Get Started
         </a>
       </nav>

package/src/Pages/Home.js

@@ -12,31 +12,38 @@ const Home = ({ context }) => {
   HeadTags({ title, description, keywords, context });
 
   return (
-      <MeshGradient>
-        <main className="main">
-          <section className="section banner banner-section">
-            <div className="container banner-column">
-              <img className="banner-image" src={tensorlabLogo} alt="banner" />
-              <div className="banner-inner">
-                <h1 className="heading-xl">
-                  Empower Your Front-End with AFront
-                </h1>
-                <p className="paragraph">
-                  AFront streamlines front-end development with robust tools and
-                  <b> seamless server-side rendering (SSSR)</b>. Build dynamic,
-                  high-performance web experiences effortlessly.
-                </p>
-                <div className="btn-darken-block">
-                  <a href="/" className="btn-darken menu-block">
-                    Get Started{" "}
-                    <img className="btn-darken-arrow" src={arrowright} />
-                  </a>
-                </div>
+    <MeshGradient>
+      <main>
+        <section className={styles.section}>
+          <div className={`${styles.container} ${styles.bannerColumn}`}>
+            <img
+              className={styles.bannerImage}
+              src={tensorlabLogo}
+              alt="banner"
+            />
+            <div className={styles.bannerInner}>
+              <h1 className={styles.headingXl}>
+                Empower Your Front-End with AFront
+              </h1>
+              <p className={styles.paragraph}>
+                AFront streamlines front-end development with robust tools and
+                <b> seamless server-side rendering (SSSR)</b>. Build dynamic,
+                high-performance web experiences effortlessly.
+              </p>
+              <div>
+                <a
+                  href="/"
+                  className={`${styles.btnDarken} ${styles.menuBlock}`}
+                >
+                  Get Started{" "}
+                  <img className={styles.btnDarkenArrow} src={arrowright} />
+                </a>
               </div>
             </div>
-          </section>
-        </main>
-      </MeshGradient>
+          </div>
+        </section>
+      </main>
+    </MeshGradient>
   );
 };
 

package/src/Routes/ARoutes.js

@@ -1,5 +1,5 @@
 import React, { Suspense } from "react";
-import { Route, Routes } from "react-router-dom";
+import { Route, Routes } from "react-router";
 import routes from "../ARoutes/AFRoutes.js";
 import LoadingFallback from "../LoadingFallback.js";
 

package/src/Static/appStatic.js

@@ -1,5 +1,5 @@
 import React, { Suspense } from "react";
-import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
+import { BrowserRouter as Router, Route, Routes } from "react-router";
 import routes from "../ARoutes/AFRoutes.js";
 import LoadingFallback from "../LoadingFallback.js";
 

package/src/Style/MeshGradient.module.css

@@ -7,7 +7,7 @@
     backdrop-filter: blur(10px);
 }
 
-.meshgradient>.color {
+.meshgradient .color {
     width: 100%;
     height: 100%;
     display: flex;

package/src/Style/Style.module.css

@@ -112,7 +112,7 @@ video {
     margin-bottom: 1rem;
 }
 
-.heading-xl {
+.headingXl {
     font-family: inherit;
     font-size: clamp(2.648rem, 6vw, 4.241rem);
     font-weight: 700;
@@ -181,7 +181,7 @@ video {
     column-gap: 0.5rem;
 }
 
-.btn-darken.menu-block {
+.btnDarken.menuBlock {
     padding: 0.75rem 2rem;
     background-color: var(--color-black-200);
     border-bottom: none;
@@ -193,14 +193,14 @@ video {
     align-items: center;
 }
 
-.btn-darken-arrow {
+.btnDarkenArrow {
     fill: #ffffff;
     height: 1rem;
     margin-left: 1rem;
 }
 
 
-.btn-darken.menu-block:hover {
+.btnDarken.menuBlock:hover {
     border-bottom: 2px solid var(--color-blue-600);
 }
 
@@ -222,7 +222,7 @@ video {
     transition: all 0.3s ease;
 }
 
-.header.on-scroll {
+.header.onScroll {
     background: var(--light);
     border-bottom: 1px solid var(--color-blue-800);
     box-shadow: var(--shadow-medium);
@@ -231,7 +231,7 @@ video {
     backdrop-filter: blur(10px);
 }
 
-.off-scroll {
+.offScroll {
     border-bottom: 1px solid var(--color-blue-800);
     box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
     background-color: rgba(#ffffff, .2);
@@ -272,13 +272,13 @@ video {
 
 
 
-.menu-link.menu-link-mobile {
+.menuLink.menuLinkMobile {
     padding: 0.5rem;
     padding-right: 1.5rem;
     padding-left: 1.5rem;
 }
 
-.menu-link.menu-link-mobile:hover {
+.menuLink.menuLinkMobile:hover {
     border-bottom: none !important;
     background-color: rgba(35, 39, 47, .05);
     border-radius: 3rem;
@@ -294,7 +294,7 @@ video {
     box-shadow: var(--shadow-medium);
 }
 
-.menu.is-active {
+.menu.isActive {
     top: 68px;
     width: 100%;
     height: 100vh;
@@ -302,21 +302,22 @@ video {
 
 }
 
-.menu.is-active .menu-inner {
+.menu.isActive .menuInner {
     padding: 1rem;
     gap: 0.2rem;
     border-bottom: 0.75px solid #000000;
 }
 
+.menuItem{}
 
 
-.menu.is-inactive {
+.menu.isInActive {
     transition: opacity 0.4s ease-in-out;
     opacity: 0;
     visibility: hidden;
 }
 
-.menu-inner {
+.menuInner {
     display: flex;
     overflow-x: auto;
     justify-content: space-around;
@@ -326,11 +327,11 @@ video {
 
 }
 
-.menu-inner::-webkit-scrollbar {
+.menuInner::-webkit-scrollbar {
     display: none;
 }
 
-.menu-link {
+.menuLink {
     font-family: inherit;
     font-size: 1rem;
     font-weight: 500;
@@ -339,7 +340,7 @@ video {
     margin-bottom: 0;
 }
 
-.menu-block {
+.menuBlock {
     display: inline-block;
     font-family: inherit;
     font-size: 0.875rem;
@@ -371,24 +372,24 @@ video {
         transition: none;
     }
 
-    .menu.is-inactive {
+    .menu.isInActive {
         transition: opacity 0.4s ease-in-out;
         opacity: 1;
         visibility: visible;
     }
 
-    .menu-inner {
+    .menuInner {
         display: flex;
         flex-direction: row;
         column-gap: 2rem;
         margin: 0 auto;
     }
 
-    .menu-link {
+    .menuLink {
         text-transform: capitalize;
     }
 
-    .menu-block {
+    .menuBlock {
         margin-left: 2rem;
     }
 }
@@ -417,7 +418,7 @@ video {
     }
 }
 
-.burger-line {
+.burgerLine {
     position: absolute;
     display: block;
     left: 0;
@@ -432,35 +433,35 @@ video {
     transition: 0.25s ease-in-out;
 }
 
-.burger-line:nth-child(1) {
+.burgerLine:nth-child(1) {
     top: 0px;
 }
 
-.burger-line:nth-child(2) {
+.burgerLine:nth-child(2) {
     top: 0.5rem;
     width: 70%;
 }
 
-.burger-line:nth-child(3) {
+.burgerLine:nth-child(3) {
     top: 1rem;
 }
 
-.burger.is-active .burger-line:nth-child(1) {
+.burger.isActive .burgerLine:nth-child(1) {
     top: 0.5rem;
     transform: rotate(135deg);
 }
 
-.burger.is-active .burger-line:nth-child(2) {
+.burger.isActive .burgerLine:nth-child(2) {
     opacity: 0;
     visibility: hidden;
 }
 
-.burger.is-active .burger-line:nth-child(3) {
+.burger.isActive .burgerLine:nth-child(3) {
     top: 0.5rem;
     transform: rotate(-135deg);
 }
 
-.banner-column {
+.bannerColumn {
     position: relative;
     display: grid;
     align-items: center;
@@ -469,14 +470,14 @@ video {
 }
 
 @media only screen and (min-width: 48rem) {
-    .banner-column {
+    .bannerColumn {
         grid-template-columns: repeat(2, minmax(0, 1fr));
         justify-content: center;
     }
 }
 
 @media only screen and (min-width: 64rem) {
-    .banner-column {
+    .bannerColumn {
         grid-template-columns: 1fr max-content;
         column-gap: 4rem;
         margin-top: 3rem;
@@ -493,7 +494,7 @@ video {
     }
 }
 
-.banner-image {
+.bannerImage {
     /* animation: rotate 60s linear infinite; */
     display: block;
     max-width: 18rem;
@@ -505,7 +506,7 @@ video {
 }
 
 @media only screen and (min-width: 48rem) {
-    .banner-image {
+    .bannerImage {
         order: 1;
         max-width: 20rem;
         height: 20rem;
@@ -513,14 +514,14 @@ video {
 }
 
 @media only screen and (min-width: 64rem) {
-    .banner-image {
+    .bannerImage {
         max-width: 25rem;
         height: 25rem;
         margin-right: 1rem;
     }
 }
 
-.banner-inner {
+.bannerInner {
     display: flex;
     flex-direction: column;
     align-items: flex-start;

package/src/index.js

@@ -1,7 +1,7 @@
 import React from "react";
 import ReactDOM, { hydrateRoot } from "react-dom/client";
 import App from "./App";
-import { BrowserRouter } from "react-router-dom";
+import { BrowserRouter } from "react-router";
 
 const container = document.getElementById("asggen");
 
@@ -26,4 +26,4 @@ if (process.env.NODE_ENV === "production") {
       </BrowserRouter>
     </React.StrictMode>
   );
-}
+}

package/webpack.build-prod.js

@@ -37,9 +37,8 @@ module.exports = {
             loader: "css-loader",
             options: {
               modules: {
-                localIdentName: "[local]",
+                localIdentName: "asggen-[hash:base64:7]",
               },
-              sourceMap: true,
             },
           },
         ],

package/webpack.prod.js

@@ -34,7 +34,7 @@ module.exports = {
             loader: "css-loader",
             options: {
               modules: {
-                localIdentName: "[local]",
+                localIdentName: "asggen-[hash:base64:7]",
               },
             },
           },

package/webpack.ssr.prod.js

@@ -34,7 +34,7 @@ module.exports = {
             loader: "css-loader",
             options: {
               modules: {
-                localIdentName: "[local]",
+                localIdentName: "asggen-[hash:base64:7]",
               },
             },
           },

package/build-prod/static/css/3-9b9bcf0b9b877caf80c6.css

@@ -1 +0,0 @@
-.supportContainer{align-items:center;background:#f7f9fc;color:#333;display:flex;flex-direction:column;justify-content:center;min-height:100vh;overflow:hidden;padding:5rem 2rem;position:relative;text-align:center}.supportTitle{color:#2c3e50;font-size:3rem;font-weight:700;margin-bottom:1rem}.supportDescription{color:#34495e;font-size:1.25rem;margin-bottom:2rem}.supportContent{margin:0 auto;max-width:900px;padding:1rem}.supportCard{background:#fff;border-radius:8px;box-shadow:0 4px 8px rgba(0,0,0,.1);color:#2c3e50;margin-bottom:2rem;overflow:hidden;padding:2rem;position:relative;transition:transform .3s ease,box-shadow .3s ease}.supportCard:before{background:linear-gradient(45deg,rgba(0,255,238,.2),rgba(0,49,109,.2));content:"";height:300%;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%) rotate(0deg);transition:opacity .3s ease;width:300%;z-index:0}.supportCardTitle{font-size:1.5rem;margin-bottom:1rem;position:relative;z-index:1}.supportCardContent{font-size:1rem;position:relative;z-index:1}.supportCard:hover{box-shadow:0 8px 16px rgba(0,0,0,.2);transform:translateY(-10px)}.supportCard:hover:before{opacity:1}.footerLink{background:#3498db;border-radius:4px;color:#fff;display:inline-block;margin-top:2rem;overflow:hidden;padding:.5rem 1rem;position:relative;text-decoration:none;transition:background .3s,transform .3s}.footerLink:after{background:radial-gradient(circle,hsla(0,0%,100%,.2) 0,hsla(0,0%,100%,0) 70%);content:"";height:300%;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%) scale(0);transition:transform .3s;width:300%;z-index:0}.footerLink:hover{background:#2980b9;transform:scale(1.05)}.footerLink:hover:after{transform:translate(-50%,-50%) scale(1)}.supportContainer:before{color:rgba(0,0,0,.1);content:"AFront";font-size:15rem;left:50%;pointer-events:none;position:absolute;top:2%;transform:translateX(-50%);white-space:nowrap;z-index:0}.supportFAQ{background:#fff;border-radius:8px;box-shadow:0 4px 8px rgba(0,0,0,.1);margin:2rem auto;max-width:900px;padding:1rem;text-align:left}.faqList{color:#2c3e50;font-size:1rem;list-style-type:none;padding:0}.faqList li{margin-bottom:1rem}@media (max-width:768px){.supportTitle{font-size:2.5rem}.supportDescription{font-size:1rem}.supportCard{padding:1rem}.supportCardTitle{font-size:1.25rem}.supportCardContent{font-size:.875rem}.supportContainer:before{bottom:5%;font-size:5rem}}.gradientWrap{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:rgba(var(--light),.2);overflow:hidden;position:relative;width:100%}.meshgradient>.color{align-items:center;background-repeat:no-repeat;bottom:0;display:flex;height:100%;left:0;margin:auto;mix-blend-mode:overlay;position:absolute;right:0;top:0;transform:scale(3) rotate(0deg);width:100%}.c1{animation:c1 8s linear infinite;background:radial-gradient(#dfa39b 25%,transparent 50%);background-position:0 0;background-size:60% 80%}.c2{animation:c2 10s linear infinite;background:radial-gradient(#aa8de3 25%,transparent 50%);background-position:0 100%;background-size:70% 80%}.c3{animation:c3 5s linear infinite;background:radial-gradient(#d1a0c4 25%,transparent 50%);background-position:50% 0;background-size:80% 80%}.c4{animation:c4 6s linear infinite;background:radial-gradient(#52bce9 25%,transparent 50%);background-position:50% 100%;background-size:80% 80%}@keyframes c1{25%{background-position:25% 50%;background-size:70% 70%;transform:scale(3) rotate(-45deg)}50%{background-position:50% 100%;background-size:80% 80%;transform:scale(3) rotate(-75deg)}75%{background-position:75% 50%;background-size:60% 60%;transform:scale(3) rotate(-30deg)}}@keyframes c2{25%{background-position:25% 0;background-size:60% 60%;transform:scale(3) rotate(45deg)}50%{background-position:50% 0;background-size:80% 80%;transform:scale(3) rotate(90deg)}75%{background-position:75% 0;background-size:70% 70%;transform:scale(3) rotate(135deg)}}@keyframes c3{25%{background-position:50% 50%;background-size:90% 90%;transform:scale(3) rotate(-15deg)}50%{background-position:0 100%;background-size:70% 80%;transform:scale(3) rotate(8deg)}75%{background-position:50% 50%;background-size:60% 70%;transform:scale(3) rotate(-10deg)}}@keyframes c4{25%{background-position:100% 0;transform:scale(3) rotate(30deg)}50%{background-position:0 0;transform:scale(3) rotate(-36deg)}75%{background-position:50% 50%;transform:scale(3) rotate(0deg)}}

package/build-prod/static/css/41-1bd05b5a5a70ee2fc084.css

@@ -1 +0,0 @@
-.gradientWrap{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:rgba(var(--light),.2);overflow:hidden;position:relative;width:100%}.meshgradient>.color{align-items:center;background-repeat:no-repeat;bottom:0;display:flex;height:100%;left:0;margin:auto;mix-blend-mode:overlay;position:absolute;right:0;top:0;transform:scale(3) rotate(0deg);width:100%}.c1{animation:c1 8s linear infinite;background:radial-gradient(#dfa39b 25%,transparent 50%);background-position:0 0;background-size:60% 80%}.c2{animation:c2 10s linear infinite;background:radial-gradient(#aa8de3 25%,transparent 50%);background-position:0 100%;background-size:70% 80%}.c3{animation:c3 5s linear infinite;background:radial-gradient(#d1a0c4 25%,transparent 50%);background-position:50% 0;background-size:80% 80%}.c4{animation:c4 6s linear infinite;background:radial-gradient(#52bce9 25%,transparent 50%);background-position:50% 100%;background-size:80% 80%}@keyframes c1{25%{background-position:25% 50%;background-size:70% 70%;transform:scale(3) rotate(-45deg)}50%{background-position:50% 100%;background-size:80% 80%;transform:scale(3) rotate(-75deg)}75%{background-position:75% 50%;background-size:60% 60%;transform:scale(3) rotate(-30deg)}}@keyframes c2{25%{background-position:25% 0;background-size:60% 60%;transform:scale(3) rotate(45deg)}50%{background-position:50% 0;background-size:80% 80%;transform:scale(3) rotate(90deg)}75%{background-position:75% 0;background-size:70% 70%;transform:scale(3) rotate(135deg)}}@keyframes c3{25%{background-position:50% 50%;background-size:90% 90%;transform:scale(3) rotate(-15deg)}50%{background-position:0 100%;background-size:70% 80%;transform:scale(3) rotate(8deg)}75%{background-position:50% 50%;background-size:60% 70%;transform:scale(3) rotate(-10deg)}}@keyframes c4{25%{background-position:100% 0;transform:scale(3) rotate(30deg)}50%{background-position:0 0;transform:scale(3) rotate(-36deg)}75%{background-position:50% 50%;transform:scale(3) rotate(0deg)}}

package/build-prod/static/css/573-7b8794ea227293d474c9.css

@@ -1 +0,0 @@
-.pageNotFoundContainer{align-items:center;background-color:#f0f4f8;display:flex;flex-direction:column;justify-content:center;min-height:100vh;padding:20px;text-align:center}.heading{color:#333;font-size:2.5rem;margin-bottom:20px;text-shadow:1px 1px 2px rgba(0,0,0,.1)}.subText{color:#666;font-size:1.2rem;margin-bottom:30px}.homeLink{background-color:#007bff;border-radius:5px;color:#fff;font-size:1rem;padding:10px 20px;text-decoration:none;transition:background-color .3s ease}.homeLink:hover{background-color:#0056b3}

package/build-prod/static/css/main-5aff2d8a2fc28d01fdad.css

@@ -1 +0,0 @@
-@import url(https://fonts.googleapis.com/css2?family=Rubik:wght@400;500;600;700&display=swap);.loadingContainer{align-items:center;display:flex;height:100vh;justify-content:center}.loadingLogo{height:auto;width:150px}:root{--light:#fff;--dark:#000;--color-white-100:#fff;--color-white-200:#e4e6e7;--color-white-300:#c9cccf;--color-white-400:#a1a6aa;--color-white-500:#798086;--color-black-100:#14191f;--color-black-200:#101419;--color-black-300:#0c0f13;--color-black-400:#0c0f13;--color-black-500:#080a0c;--color-black-600:#060709;--color-black-700:#040506;--color-black-800:#020303;--color-blue-100:#dcebfe;--color-blue-200:#bedbfe;--color-blue-300:#91c3fd;--color-blue-400:#61a6fa;--color-blue-500:#3c83f6;--color-blue-600:#2463eb;--color-blue-700:#1d4fd7;--color-blue-800:#1e3fae;--color-blue-900:#1e3b8a;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 16px 32px -16px rgba(0,0,0,.1),0 0 0 1px rgba(0,0,0,.1);--base__color-2__rgb:32,32,32;--shadow-small:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06);--shadow-medium:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--shadow-large:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}*,:after,:before{box-sizing:border-box;list-style:none;list-style-type:none;margin:0;padding:0;text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}html{box-sizing:inherit;font-size:100%;scroll-behavior:smooth}body,html{height:-webkit-fill-available}body{font-family:Rubik,sans-serif;font-size:clamp(1rem,2vw,1.125rem);font-weight:400;line-height:1.5;min-width:320px}main{overflow:hidden}a,button{background:none;border:none;box-shadow:none;cursor:pointer;outline:none;text-decoration:none;user-select:none}a{color:var(--color-black-400)}img,video{display:block;height:auto;max-width:100%;object-fit:cover}.section{margin:0 auto;padding:6rem 0 8rem}.container{height:auto;margin:0 auto;max-width:75rem}.centered{margin-bottom:1rem;text-align:center;vertical-align:middle}.heading-xl{font-size:clamp(2.648rem,6vw,4.241rem)}.heading-lg,.heading-xl{font-family:inherit;font-weight:700;letter-spacing:-1px;line-height:1.15}.heading-lg{font-size:clamp(2.179rem,5vw,3.176rem)}.heading-md{font-family:inherit;font-size:clamp(1.794rem,4vw,2.379rem);font-weight:700;letter-spacing:-1px;line-height:1.25}.heading-sm{font-size:clamp(1.476rem,3vw,1.782rem);font-weight:600}.heading-sm,.heading-xs{font-family:inherit;line-height:1.5}.heading-xs{font-size:clamp(1.215rem,2vw,1.335rem);font-weight:500}.paragraph{font-size:clamp(1rem,2vw,1.125rem);text-wrap:balance}.btn,.paragraph{font-family:inherit}.btn{border:none;border-radius:.75rem;display:inline-block;font-size:1rem;font-weight:500;line-height:1.5;outline:none;text-align:center;text-transform:unset;user-select:none;vertical-align:middle;white-space:nowrap}.btn-inline{column-gap:.5rem;display:inline-flex}.btn-darken.menu-block,.btn-inline{align-items:center;justify-content:center}.btn-darken.menu-block{background-color:var(--color-black-200);border-bottom:none;display:flex;height:2.7rem;line-height:0;margin-left:0;padding:.75rem 2rem}.btn-darken-arrow{fill:#fff;height:1rem;margin-left:1rem}.btn-darken.menu-block:hover{border-bottom:2px solid var(--color-blue-600)}.btn-neutral{background-color:var(--color-white-100);box-shadow:var(--shadow-medium);color:var(--color-black-500);padding:.75rem 2rem}.header{height:auto;left:0;margin:0 auto;position:fixed;top:0;transition:all .3s ease;width:100%;z-index:100}.header.on-scroll{background:var(--light);background-color:rgba(var(--light),.2);box-shadow:var(--shadow-medium)}.header.on-scroll,.off-scroll{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--color-blue-800)}.off-scroll{background-color:rgba(#ffffff,.2);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.navbar{align-items:center;column-gap:1.25rem;display:flex;flex-direction:row;height:4.25rem;justify-content:flex-start;margin:0 auto;width:100%}.brand{font-family:inherit;font-size:1.6rem;font-weight:600;letter-spacing:-1px;line-height:1.5;margin-bottom:0}.navbar.container{margin-bottom:0;padding:0 1.25rem}.navbar.container a:hover{border-bottom:2px solid var(--color-black-800)}.menu-link.menu-link-mobile{padding:.5rem 1.5rem}.menu-link.menu-link-mobile:hover{background-color:rgba(35,39,47,.05);border-bottom:none!important;border-radius:3rem}.menu{background-color:var(--light);box-shadow:var(--shadow-medium);height:auto;left:0;position:fixed;top:-100%;width:100%}.menu.is-active{border-top:1px solid var(--color-blue-800);height:100vh;top:68px;width:100%}.menu.is-active .menu-inner{border-bottom:.75px solid #000;gap:.2rem;padding:1rem}.menu.is-inactive{opacity:0;transition:opacity .4s ease-in-out;visibility:hidden}.menu-inner{display:flex;justify-content:space-around;overflow-x:auto;row-gap:1.25rem;-ms-overflow-style:none;scrollbar-width:none}.menu-inner::-webkit-scrollbar{display:none}.menu-link{font-size:1rem;line-height:1.5;text-transform:uppercase}.menu-block,.menu-link{font-family:inherit;font-weight:500;margin-bottom:0}.menu-block{background-color:var(--color-blue-600);border-radius:.75rem;box-shadow:var(--shadow-medium);color:var(--light);display:inline-block;font-size:.875rem;line-height:1.25;margin-left:auto;padding:.65rem 1.5rem;text-align:center;text-transform:capitalize;user-select:none;white-space:nowrap}@media only screen and (min-width:48rem){.menu{background:none;box-shadow:none;height:auto;margin-left:auto;padding:0;position:relative;top:0;transition:none;width:auto}.menu.is-inactive{opacity:1;transition:opacity .4s ease-in-out;visibility:visible}.menu-inner{column-gap:2rem;display:flex;flex-direction:row;margin:0 auto}.menu-link{text-transform:capitalize}.menu-block{margin-left:2rem}}.burger{background:none;border:none;cursor:pointer;display:block;height:1.15rem;order:-1;outline:none;position:relative;transform:rotate(0deg);transition:.35s ease;user-select:none;visibility:visible;width:1.6rem;z-index:10}@media only screen and (min-width:48rem){.burger{display:none;visibility:hidden}}.burger-line{background-color:var(--color-black-800);border:none;border-radius:1rem;display:block;height:2px;left:0;opacity:1;outline:none;position:absolute;transform:rotate(0deg);transition:.25s ease-in-out;width:100%}.burger-line:first-child{top:0}.burger-line:nth-child(2){top:.5rem;width:70%}.burger-line:nth-child(3){top:1rem}.burger.is-active .burger-line:first-child{top:.5rem;transform:rotate(135deg)}.burger.is-active .burger-line:nth-child(2){opacity:0;visibility:hidden}.burger.is-active .burger-line:nth-child(3){top:.5rem;transform:rotate(-135deg)}.banner-column{align-items:center;display:grid;padding:0 1rem;position:relative;row-gap:3rem}@media only screen and (min-width:48rem){.banner-column{grid-template-columns:repeat(2,minmax(0,1fr));justify-content:center}}@media only screen and (min-width:64rem){.banner-column{column-gap:4rem;grid-template-columns:1fr max-content;margin-top:3rem}}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.banner-image{display:block;height:18rem;justify-self:center;margin-top:2rem;max-width:18rem;object-fit:cover}@media only screen and (min-width:48rem){.banner-image{height:20rem;max-width:20rem;order:1}}@media only screen and (min-width:64rem){.banner-image{height:25rem;margin-right:1rem;max-width:25rem}}.banner-inner{align-items:flex-start;display:flex;flex-direction:column;row-gap:1.75rem}.footer{background-color:#fff;color:#333;overflow:hidden;padding:2.5rem 0;position:relative}.footer:before{color:rgba(0,0,0,.05);content:"AFront";font-size:20rem;left:50%;pointer-events:none;position:absolute;top:70%;transform:translate(-50%,-50%);white-space:nowrap;z-index:0}.footerContainer{align-items:flex-start;display:flex;flex-wrap:wrap;justify-content:space-between;margin:0 auto;max-width:75rem;padding:0 1.25rem;position:relative;z-index:1}.footerBrand{flex:1;margin-bottom:2rem}.footerLogo{color:var(--color-black-400);font-size:1.5rem;font-weight:700;text-decoration:none}.footerDescription{color:#8b8b8b;font-size:.875rem;margin-top:.625rem}.footerLinks{display:flex;flex:2;flex-wrap:wrap;justify-content:space-between}.linkColumn{flex:1;margin-bottom:2rem;min-width:12rem}.footerTitle{color:#777;font-size:1rem;margin-bottom:.625rem}.linkList{list-style:none;padding:0}.link{color:#909090;display:block;font-size:.875rem;margin-bottom:.5rem;text-decoration:none;transition:color .3s ease}.link:hover{color:#3a3a3a}.footerBottom{color:#777;font-size:.875rem;margin-top:2.5rem;text-align:center}.footerCopy{margin-bottom:.625rem}.socialLinks{display:flex;flex-wrap:wrap;justify-content:center}.socialLink{color:#909090;font-size:1.125rem;margin:0 .625rem;text-decoration:none;transition:color .3s ease}.socialLink:hover{color:#3a3a3a}@media (max-width:768px){.footerContainer,.footerLinks{align-items:center;flex-direction:column}.footerLinks{text-align:center}.linkColumn{margin-bottom:1.5rem}.footerCopy{font-size:.75rem}.socialLinks{margin-top:1rem}.socialLink{font-size:1rem;margin:0 .5rem}.footer:before{content:"AFront";font-size:5rem;top:82%}}

package/build-prod/static/js/3-cde9f071488e7a433907.js

@@ -1 +0,0 @@
-(self.webpackChunkafront=self.webpackChunkafront||[]).push([[3],{572:(e,t,a)=>{const{useEffect:r}=a(540);function n(e,t){if(t){let a=document.querySelector(`meta[name="${e}"]`);a?a.setAttribute("content",t):(a=document.createElement("meta"),a.setAttribute("name",e),a.setAttribute("content",t),document.head.appendChild(a))}}e.exports=function({title:e,description:t,keywords:a,context:s}){r((()=>{"undefined"!=typeof document&&(document.title=e,n("title",e),n("description",t),n("keywords",a))}),[e,t,a]),s&&(s.title=e,s.description=t,s.keywords=a)}},210:(e,t,a)=>{"use strict";a.d(t,{A:()=>s});var r=a(540),n="color";const s=function(e){var t=e.children;return r.createElement("div",{className:"gradientWrap"},r.createElement("div",{className:"meshgradient"},r.createElement("div",{className:"".concat(n," ").concat("c1")}),r.createElement("div",{className:"".concat(n," ").concat("c2")}),r.createElement("div",{className:"".concat(n," ").concat("c3")}),r.createElement("div",{className:"".concat(n," ").concat("c4")})),t)}},3:(e,t,a)=>{"use strict";a.r(t),a.d(t,{default:()=>m});var r=a(540),n=a(572),s=a.n(n),o="supportCard",c="supportCardContent",i="supportCardTitle",l=a(210);const m=function(e){var t=e.context;return s()({title:"Support - AFront",description:"Get support for AFront, a front-end JavaScript library for seamless server-side rendering.",keywords:"support, AFront, server-side rendering, JavaScript",context:t}),r.createElement(l.A,null,r.createElement("div",{className:"supportContainer"},r.createElement("h1",{className:"supportTitle"},"Need Assistance?"),r.createElement("p",{className:"supportDescription"},"AFront is a cutting-edge front-end JavaScript library designed for seamless server-side rendering (SSR). We're committed to providing you with top-notch support to ensure your experience is smooth and productive."),r.createElement("div",{className:"supportContent"},r.createElement("div",{className:o},r.createElement("h2",{className:i},"Technical Assistance"),r.createElement("p",{className:c},"Our dedicated technical support team is available around the clock to resolve any issues you may face with AFront. Connect with us through email or our support portal for prompt assistance.")),r.createElement("div",{className:o},r.createElement("h2",{className:i},"Product Information"),r.createElement("p",{className:c},"Curious about AFront’s capabilities? Reach out to our sales team for detailed insights on features, benefits, and how our library can enhance your web development projects.")),r.createElement("div",{className:o},r.createElement("h2",{className:i},"Community and Forums"),r.createElement("p",{className:c},"Join our vibrant community forums to discuss AFront with fellow developers, exchange tips, and troubleshoot common issues collaboratively."))),r.createElement("div",{className:"supportFAQ"},r.createElement("h2",{className:i},"Frequently Asked Questions"),r.createElement("ul",{className:"faqList"},r.createElement("li",null,"What is AFront and how does it work?"),r.createElement("li",null,"How do I get started with AFront?"),r.createElement("li",null,"Where can I find documentation and tutorials?"),r.createElement("li",null,"How can I report a bug or request a feature?"))),r.createElement("a",{href:"/",className:"footerLink"},"Back to Homepage")))}}}]);

package/build-prod/static/js/41-e973a17863e1084774d7.js

@@ -1 +0,0 @@
-(self.webpackChunkafront=self.webpackChunkafront||[]).push([[41],{572:(e,t,n)=>{const{useEffect:a}=n(540);function c(e,t){if(t){let n=document.querySelector(`meta[name="${e}"]`);n?n.setAttribute("content",t):(n=document.createElement("meta"),n.setAttribute("name",e),n.setAttribute("content",t),document.head.appendChild(n))}}e.exports=function({title:e,description:t,keywords:n,context:r}){a((()=>{"undefined"!=typeof document&&(document.title=e,c("title",e),c("description",t),c("keywords",n))}),[e,t,n]),r&&(r.title=e,r.description=t,r.keywords=n)}},210:(e,t,n)=>{"use strict";n.d(t,{A:()=>r});var a=n(540),c="color";const r=function(e){var t=e.children;return a.createElement("div",{className:"gradientWrap"},a.createElement("div",{className:"meshgradient"},a.createElement("div",{className:"".concat(c," ").concat("c1")}),a.createElement("div",{className:"".concat(c," ").concat("c2")}),a.createElement("div",{className:"".concat(c," ").concat("c3")}),a.createElement("div",{className:"".concat(c," ").concat("c4")})),t)}},488:(e,t,n)=>{"use strict";n.r(t),n.d(t,{default:()=>i});var a=n(540),c=n(210);const r=n.p+"static/media/52f06bb716d4ecad087a.png",s=n.p+"static/media/adeaead125c45715106d.svg";var o=n(572),l=n.n(o);const i=function(e){var t=e.context;return l()({title:"AFront by Asggen Inc.",description:"Home for all AFront products and services.",keywords:"Home, Afront, help",context:t}),a.createElement(c.A,null,a.createElement("main",{className:"main"},a.createElement("section",{className:"section banner banner-section"},a.createElement("div",{className:"container banner-column"},a.createElement("img",{className:"banner-image",src:r,alt:"banner"}),a.createElement("div",{className:"banner-inner"},a.createElement("h1",{className:"heading-xl"},"Empower Your Front-End with AFront"),a.createElement("p",{className:"paragraph"},"AFront streamlines front-end development with robust tools and",a.createElement("b",null," seamless server-side rendering (SSSR)"),". Build dynamic, high-performance web experiences effortlessly."),a.createElement("div",{className:"btn-darken-block"},a.createElement("a",{href:"/",className:"btn-darken menu-block"},"Get Started"," ",a.createElement("img",{className:"btn-darken-arrow",src:s}))))))))}}}]);

package/build-prod/static/js/573-21fb9ccdf567d99f4539.js

@@ -1 +0,0 @@
-"use strict";(self.webpackChunkafront=self.webpackChunkafront||[]).push([[573],{573:(e,a,t)=>{t.r(a),t.d(a,{default:()=>o});var n=t(540);const o=function(){return n.createElement("div",{className:"pageNotFoundContainer"},n.createElement("h2",{className:"heading"},"Oops! The page you're looking for doesn't exist."),n.createElement("p",{className:"subText"},"It seems you’ve taken a wrong turn. Let’s get you back on track!"),n.createElement("a",{href:"/",className:"homeLink"},"Go to Homepage"))}}}]);