kivi-cars/src/containers/EmailPage.js

@@ -14,17 +14,26 @@ function EmailPage(props) {
         <div>
             <Header header={header}/>
             <ButtonsToolbar/>
+            <div>
+                <h2 className='h2'>Slanje obavještenja</h2>
+            </div>
             <div className='buttons-container'>
                 <StandardBtn title={title1}/>
                 <StandardBtn title={title2}/>
             </div>
-            <div>
-                <h1 className='h2'>OVDJE IDU EMAILFIELDS</h1>
+            <div className='form'>
+                <form method="POST" id="form-email">
+                    <div className='email-div'>
+                        <input id="email" name='email' placeholder='vas.email@mail.com' required size='250'/>
+                        <input id="confirmEmail" name='confirmEmail' placeholder='potvrdite.email@mail.com' required size='250'/>
+                    </div>
+
+                </form>
             </div>
             <div>
-                <h2 className='h2'>*U svakom trenutku možete prekinuti slanje objava kroz
+                <h3 className='h3-2'>*U svakom trenutku možete prekinuti slanje objava kroz
                     link u vašem emailu
-                </h2>
+                </h3>
             </div>
             <div>
                 <StandardBtn title={title3}/>

kivi-cars/src/containers/LandingPage.js

@@ -11,7 +11,7 @@ function LandingPage() {
     return (
       <div className="landing-page">
         <div className='logo-img'>
-            <img className='logo' src={logo}/>
+            <img className='logo' alt='Logo-img' src={logo}/>
         </div>
 
         <Header className='header' header={naslov}/>

kivi-cars/src/containers/css/EmailPage.css

@@ -1,10 +1,74 @@
 .h2 {
+    margin-top: 1rem;
     text-align: center;
-    padding: 2rem;
+    font-size: 300;
+    font-weight: 300;
+}
+
+
+.h3 {
+    margin-top: 2rem;
+    text-align: center;
+    padding: 1rem;
+    font-size: 300;
+    font-weight: 300;
+}
+
+.h3-2 {
+    margin-top: 2rem;
+    margin-bottom: 1rem;
+    text-align: center;
+    padding: 1rem;
+    font-size: 300;
+    font-weight: 300;
 }
 
 .buttons-container {
+    margin-top: 2rem;
     display: flex;
     justify-content:center;
     gap: 20px;
+}
+
+#email {
+    width: 80%;
+    font-size: 15px;
+    padding: 20px;
+    margin: 10px;
+    border: hidden;
+    border-bottom: 1px solid lightslategrey;
+}
+#email:active {
+    width: 80%;
+    font-size: 15px;
+    padding: 20px;
+    margin: 10px;
+    border: hidden;
+    border-bottom: 1px solid lightslategrey;
+}
+
+#confirmEmail {
+    width: 80%;
+    font-size: 15px;
+    padding: 20px ;
+    margin: 10px;
+    border: hidden;
+    border-bottom: 1px solid lightslategrey;
+}
+
+.form {
+    margin-top: 1rem;
+}
+
+textarea:focus, input:focus{
+    outline: none;
+}
+
+.email-div{
+    max-width: 80%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    margin: auto;
+    
 }