diff --git a/index.html b/index.html
index 79c4701..bf8d9cd 100644
--- a/index.html
+++ b/index.html
@@ -4,6 +4,7 @@
+
Vite + React
diff --git a/src/App.jsx b/src/App.jsx
index 8e099d6..ae4c627 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -1,12 +1,17 @@
import "./App.css";
import React from "react";
-import Home from "./pages/Home/Home";
+// import Home from "./pages/Home/Home";
+import { Navbar } from "./components/Navbar/Navbar";
+import Maintenance from "./pages/Maintenance/Maintenance";
const App = () => {
return (
-
- //
+ <>
+ {/* */}
+
+
+
);
};
diff --git a/src/components/Navbar/Navbar.css b/src/components/Navbar/Navbar.css
index 00dad38..9111461 100644
--- a/src/components/Navbar/Navbar.css
+++ b/src/components/Navbar/Navbar.css
@@ -22,7 +22,7 @@ li {
} */
.navbar {
- height: 70px;
+ height: 10vh;
display: flex;
justify-content: center;
align-items: center;
@@ -106,7 +106,7 @@ li {
.nav-menu{
flex-direction: column;
position: fixed;
- top:70px;
+ top:10vh;
right: -100%;
gap:0;
background-color: rgb(45, 45, 45);
diff --git a/src/pages/Maintenance/Maintenance.css b/src/pages/Maintenance/Maintenance.css
new file mode 100644
index 0000000..4a6d9e0
--- /dev/null
+++ b/src/pages/Maintenance/Maintenance.css
@@ -0,0 +1,155 @@
+.main {
+ position: absolute;
+ width: 100vw;
+ height: 90vh;
+ text-align: center;
+ background: rgb(19, 16, 16);
+ background: linear-gradient(180deg, rgba(19, 16, 16, 1) 1%, rgba(45, 44, 45, 0.9640231092436975) 96%);
+ padding: 10vh 0;
+}
+
+.section1 {
+ font-size: 70px;
+ line-height: 70px;
+ font-weight: bold;
+}
+
+p {
+ padding-top: 30px;
+ padding-bottom: 20px;
+ font-size: 11px;
+ letter-spacing: 7px;
+}
+
+.mbar {
+ margin: 0 auto;
+ width: 32vw;
+ height: 1.4vh;
+ display: flex;
+}
+.red{
+ width: 9vw;
+ height: 1.4vh;
+ background-color:red;
+}
+.white{
+ width: 32vw;
+ height: 1.4vh;
+ background-color: white;
+}
+
+.range {
+ width: 32vw;
+ margin: 2px auto;
+ display: flex;
+ justify-content: space-between;
+}
+
+.notify {
+ margin: 40px
+}
+
+.notify a {
+
+ background-color: rgb(3, 82, 179);
+ color: white;
+ font-weight: 500;
+ padding: 8px 25px;
+}
+
+.notify a:hover {
+ background-color: rgb(1, 230, 255);
+ color: black;
+}
+
+.social {
+ width: 25vw;
+ margin: 0 auto;
+ margin-top: 80px;
+ display: flex;
+ justify-content: space-between;
+}
+
+.social a {
+ border-radius: 50%;
+ border: 2px solid white;
+ font-size: 18px;
+ padding: 10px 15px;
+
+}
+
+.social a:hover {
+ background-color: rgb(210, 0, 0);
+}
+
+@media(max-width:961px){
+ .range {
+ width: 50vw;
+ }.mbar {
+ width: 50vw;
+ }
+ .social {
+ width: 40vw;
+ }
+ .red{
+ width: 10vw;
+ }
+ .white{
+ width: 50vw;
+ }
+}
+
+@media(max-width:595px){
+ .section1{
+ font-size: 55px;
+ line-height: 55px;
+ }
+ p {
+ font-size: 11px;
+ letter-spacing: 5px;
+ }
+
+ .range {
+ width: 55vw;
+ }.mbar {
+ width: 55vw;
+ }
+ .social {
+ width: 65vw;
+ }
+ .red{
+ width: 12vw;
+ }
+ .white{
+ width: 55vw;
+ }
+}
+@media(max-width:455px){
+ .section1{
+ font-size: 42px;
+ line-height: 44px;
+ }
+ p {
+ font-size: 11px;
+ letter-spacing: 5px;
+ }
+
+ .range {
+ width: 70vw;
+ }.mbar {
+ width: 70vw;
+ }
+ .social {
+ width: 65vw;
+ margin: 0 auto;
+ margin-top: 80px;
+ display: flex;
+ justify-content: space-around;
+ }
+}
+@media(max-width:340px){
+ .section1{
+ font-size: 30px;
+ line-height: 32px;
+ }
+}
diff --git a/src/pages/Maintenance/Maintenance.jsx b/src/pages/Maintenance/Maintenance.jsx
index 045af22..bb0d238 100644
--- a/src/pages/Maintenance/Maintenance.jsx
+++ b/src/pages/Maintenance/Maintenance.jsx
@@ -1,7 +1,41 @@
import React from "react";
+import "./Maintenance.css"
const Maintenance = () => {
- return Maintenance
;
+ return (
+ <>
+
+
+
+ UNDER
+ CONSTRUCTION
+
+
+
+
SITE NEARLY READY
+
+
+
+
+
+
+
+