Facial expression main UI

facial-expression.component.html

+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+<div class="container-fluid page">
+    <div class="d-flex page__box p-3 mt-2">Simle with Simon</div>
+    <div class="page__content shadow p-3 position-relative">
+
+      <div class="page__content-data position-absolute">
+        
+        <button class="cambtn" input type="file" accept="image/*;capture=camera" ><i class="fa fa-camera"></i></button>
+        
+        <div>
+          <div class="container">
+          <h1>Facial Expression Analyzis</h1>        
+          <form class= "form" action="/action_page.php">
+            <label for="fname">Baby's first name</label>
+            <input type="text" id="fname" name="firstname" placeholder="Baby's first name..">
+        
+            <label for="lname">Baby's Last Name </label>
+            <input type="text" id="lname" name="lastname" placeholder="Baby's last name..">
+
+            <!-- <label for="e-mail">E-mail</label>
+            <input type="text" id="e-mail" name="e-mail" placeholder="E mail.."> -->
+        
+            <label for="age">Age</label>
+            <select id="country" name="country">
+              <option value="australia">Age Month 6-1 Year</option>
+              <option value="canada">Age 1 Year - 2 Years </option>
+              <option value="usa">Age 2 Year - 3 Years </option>
+              <option value="usa">Age 3 Year - 4 Years </option>
+            </select>
+
+            <label for="age">Level</label>
+            <select id="country" name="country">
+              <option value="australia">Level 1</option>
+              <option value="canada">Level 2</option>
+              <option value="usa">Level 3</option>
+            </select>
+            
+            <form action="/action_page.php">
+              <label for="myfile">Upload your baby's photo</label>
+              <input type="file" id="myfile" name="myfile" multiple> 
+            </form>
+
+            <label for="subject">Optional Details</label>
+            <textarea id="subject" name="subject" placeholder="Fill this if optional.." style="height:200px"></textarea>
+        
+           
+
+            <input type="submit" value="Proceed">
+            <!-- <a  mat-list-item routerLinkActive="list-item-active" routerLink="/facial-alreadyhaveaccount"><button class="btn">Already have </button></a>  -->
+            
+              <div class="icon">
+              <button class="btn"><i class="fa fa-facebook"></i></button>
+              <button class="btn"><i class="fa fa-instagram"></i></button>
+              <button class="btn"><i class="fa fa-twitter"></i></button>
+              <button class="btn"><i class="fa fa-telegram"></i></button>
+              <button class="btn"><i class="fa fa-whatsapp"></i></button>
+              </div>
+
+          </form>
+        </div>
+        </div>
+        
+       
+      </div>
+    </div>
+  </div>
+
+  
+      
\ No newline at end of file