Start page, no functionality

css/admin-common.css

@@ -0,0 +1,7 @@
+.admin-panel-page-title {
+    font-size: 28px;
+    text-align: center;
+    font-family: Source Sans Pro;
+    font-weight: 700;
+    letter-spacing: 0.1rem;
+}

css/admin-start.css

@@ -8,3 +8,29 @@
     width: 100%;
     height: 50vh;
 }
+.admin-start-welcome-message {
+    font-size: 18px;
+    text-align: start;
+    width: 90%;
+    font-family: Source Sans Pro;
+}
+.admin-start-page-loads-container {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+    width: 90%;
+}
+
+.admin-start-page-loads-label {
+    font-family: Source Sans Pro;
+    font-size: 16px;
+    text-align: start;
+    font-weight: 200;
+}
+.admin-start-page-loads-amount {
+    font-family: Source Sans Pro;
+    font-size: 22px;
+    text-align: end;
+    font-weight: 800;
+}

css/body.css

@@ -12,7 +12,7 @@ body {
 }
 
 .admin-page-container {
-    padding-top: 110px;
+    padding-top: 40px;
     padding-left: 200px;
     display: flex;
     flex-direction: column;

index.html

@@ -14,6 +14,7 @@
         <link data-trunk type="text/css" href="css/contact.css" rel="css" />
         <link data-trunk type="text/css" href="css/admin-login.css" rel="css" />
         <link data-trunk type="text/css" href="css/admin-start.css" rel="css" />
+        <link data-trunk type="text/css" href="css/admin-common.css" rel="css" />
 
         
         <link data-trunk type="text/css" href="css/components/loading.css" rel="css" />

src/pages/admin/start.rs

@@ -9,7 +9,20 @@ pub fn admin_start() -> Html {
             <AdminNavigationBar/>
             <div class={"admin-page-container"}>
                 <div class={"admin-start-container"}>
-                    {"a"}
+                    <div class={"admin-panel-page-title"}>{"Inicio"}</div>
+                    <div class={"admin-start-welcome-message"}>{"Bienvenido Jorge, este es tu panel de administración."}</div>
+                    <div class={"admin-start-page-loads-container"}>
+                        <div class={"admin-start-page-loads-label"}>{"Cargas: "}</div>
+                        <div class={"admin-start-page-loads-amount"}>{"201"}</div>
+                    </div>
+                    <div class={"admin-start-page-loads-container"}>
+                        <div class={"admin-start-page-loads-label"}>{"Solicitudes de Contacto: "}</div>
+                        <div class={"admin-start-page-loads-amount"}>{"10"}</div>
+                    </div>
+                    <div class={"admin-start-page-loads-container"}>
+                        <div class={"admin-start-page-loads-label"}>{"Whatsapp Clicks"}</div>
+                        <div class={"admin-start-page-loads-amount"}>{"28"}</div>
+                    </div>
                 </div>
             </div>
         </>