sign

SvitPrakarsh · Feb 9, 2023 · e7d13cd · e7d13cd
1 parent 43c139b
commit e7d13cd
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 49 deletions.
diff --git a/src/App.jsx b/src/App.jsx
@@ -25,8 +25,8 @@ const App = () => {
         <NavBar/>
         <Home/>
         <About />
-        {/* <Event />
-        <Team /> */}
+        <Event />
+        <Team />
         {/* <Sponsor /> */}
         <Signup/>
         <Glimpse />

diff --git a/src/components/signup/Signup.css b/src/components/signup/Signup.css
@@ -31,56 +31,51 @@
     text-align: center;
 }
 
-.s-content{
 
+.scontent{
     display: flex;
     justify-content: center;
-    /* flex-wrap: wrap; */
+    align-items: center;
     flex-direction: column;
-    position: relative;
-    
+    gap: 30px;
+
 }
 
-.email{
-    display: flex;
-    justify-content: center;
+.inputbox{
     position: relative;
-
+    width: 250px;
 }
-.email input[type="email"]{
-    margin-left: 10px;
-    /* border: 2px solid green; */
-    position: relative;
-    color: white;
-    background: rgba(128, 128, 128,0.2);
-    width: 10rem;
-    border-radius: 4px;
-
-
-
 
+.inputbox input{
+    width: 100%;
+    padding: 10px;
+    border: 1px solid  rgb(1, 209, 105);
+    background: rgb(1, 15, 20,0.25);
+    border-radius: 5px;
+    outline: none;
+    color: #fff;
+    font-size: 1em; 
+
 }
-.email input:focus{
-    /* color: rgb(1, 95, 48); */
-    border: 2px solid rgb(1, 95, 48) ;
-}
 
-.input::before{
-    content:'';
-    width: 50px;
-    height: 5px;
-    border: 2px solid green;
+.inputbox span{
+
     position: absolute;
-    top: 0;
-}
-.sbtn{
-    display: flex;
-    justify-content: center;
-    margin-top: 1rem;
+    left:0;
+    padding: 10px;
+    pointer-events: none;
+    font-size: 1em;
+    color: rgb(1, 209, 105,0.5);
 
-
+    text-transform: uppercase;
 }
 
-.sbtn button{
-    border-radius: 4px;
+.inputbox .input:valid ~ span,
+.inputbox .input:valid ~  span :focus
+{
+
 }
+
+
+
+
diff --git a/src/components/signup/Signup.jsx b/src/components/signup/Signup.jsx
@@ -9,18 +9,21 @@ const Signup = () => {
                <p> Sign in now and register for upcoming events and <br/>
                      future announcements.</p>
             </div>
-
-             <div className="s-content">
-              <div className="email">
-                <span> Email</span> <input type="email"/> 
-              </div>
-
-              <div className="sbtn">
+            <div className="scontent">
+                <div className="inputbox">
+              <input type="email"  required="required" />
+              <span>
+                Email
+              </span>
+            </div>
+            <div className="sbtn">
+              <button type="button">Get Link</button>
+            </div>
 
-              <button type="button" > Get Link </button>
-              </div>
-             </div>
+            </div>
+
 
+