Updated styles.

miguelcanosantana · Nov 26, 2023 · c4bef3d · c4bef3d
1 parent efb8c94
commit c4bef3d
Show file tree

Hide file tree

Showing 6 changed files with 66 additions and 168 deletions.
diff --git a/Layout/MainLayout.razor b/Layout/MainLayout.razor
@@ -1,7 +1,4 @@
 @inherits LayoutComponentBase
 
-    <NavBar></NavBar>
-
-    <main class="container">
-		@Body
-    </main>
+<NavBar></NavBar>
+@Body
diff --git a/Layout/NavBar.razor b/Layout/NavBar.razor
@@ -11,23 +11,14 @@
         height: 25px;
     }
 
-    .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
-        color: #fbfaf3;
-        background-color: #D1A43E;
-    }
-
-    .nav-pills {
-        margin-top: 10px;
-    }
-
     .img-nav {
         max-width: 160px;
     }
 
 </style>
 
 
-<nav class="navbar navbar-expand-md navbar-dark mb-4" style="background-color: #1A171B;">
+<nav class="navbar navbar-expand-md navbar-dark mb-1" style="background-color: #1A171B;">
     <div class="container-fluid">
 
         <a href="#"><img src="Images/WhiteLogo.svg" class="inmg-fluid img-nav" alt="Cirsa"></a>
@@ -75,8 +66,6 @@
     </div>
 </nav>
 
-<div class="small-space"></div>
-
 <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
 
 @code {

diff --git a/Layout/NavMenu.razor b/Layout/NavMenu.razor
diff --git a/Layout/NavMenu.razor.css b/Layout/NavMenu.razor.css
diff --git a/Pages/CustomAffiliatePage.razor b/Pages/CustomAffiliatePage.razor
@@ -5,49 +5,74 @@
 <PageTitle>PLACEHOLDER TITLE | Cirsa</PageTitle>
 
 
-<div class="container py-4 jumbotron-a">
-
-    <div class="container">
-        <div class="row">
-
-            <div class="col-12 col-md-6">
-
-                <!-- Description still loading -->
-                @if(customStyle == null)
-                {
-                    <p>Loading...</p>
-                }
-                //Loaded description
-                else
-                {
-                    <h4 class="fw-bold"> @customStyle.GetTitle() </h4>
-                    <p>
-                        @customStyle.GetSummary()
-                    </p>
-                }
+<style>
 
-            </div>
+    #everything-wrapper {
+        vertical-align: central;
+        background-image: url(@customStyle.GetBackgroundUrl());
+        height: 100vh;
+        width: 100vw;
+    }
+
+    #grey-wrapper {
+        background-color: #1a171b;
+        padding: 25px;
+        border-radius: 10px;
+    }
 
-            <div class="col-12 col-md-6">
+</style>
 
-                <form class="user-form">
+<div id="everything-wrapper">
 
-                    <div class="mb-3">
-                        <label for="exampleInputEmail1" class="form-label">Email</label>
-                        <input @bind-value="clientMail" @bind-value:event="oninput" type="email" class="form-control" id="emailInput" required>
+    <div class="container py-4 jumbotron-b">
+
+        <div class="container">
+            <div class="row">
+
+                <div class="col-12 col-md-6">
+
+                    <div id="grey-wrapper">
+                        <!-- Description still loading -->
+                        @if (customStyle == null)
+                        {
+                            <p>Loading...</p>
+                        }
+                        //Loaded description
+                        else
+                        {
+                            <h4 class="fw-bold"> @customStyle.GetTitle() </h4>
+                            <p>
+                                @customStyle.GetSummary()
+                            </p>
+                        }
                     </div>
-                    <button type="submit" @onclick="RegisterClient" class="btn button-gold-a">Continuar</button>
 
-                </form>
+                </div>
 
-            </div>
+                <div class="col-12 col-md-6">
 
+                    <form class="user-form">
+
+                        <div class="mb-3">
+                            <label for="exampleInputEmail1" class="form-label">Email</label>
+                            <input @bind-value="clientMail" @bind-value:event="oninput" type="email" class="form-control" id="emailInput" required>
+                        </div>
+                        <button type="submit" @onclick="RegisterClient" class="btn button-gold-a">Continuar</button>
+
+                    </form>
+
+                </div>
+
+            </div>
         </div>
+
     </div>
 
 </div>
 
 
+
+
 @code {
     [Parameter]
     public string affiliateUid { get; set; }

diff --git a/wwwroot/css/app.css b/wwwroot/css/app.css
@@ -110,6 +110,15 @@ code {
     border-radius: 10px;
 }
 
+.jumbotron-b {
+    background: #1A171BB5;
+    max-width: 900px;
+    border-radius: 10px;
+    backdrop-filter: blur(5px);
+    border: 2px solid #f3ecce;
+    box-shadow: 0px 2px 30px -6px rgba(0,0,0,0.75);
+}
+
 .user-form {
     background-color: #1A171B;
     padding: 20px;