Fixed css refs and fixed the errors it produced

KarmaKamikaze · Nov 9, 2023 · fa84a92 · fa84a92
1 parent 7b412cb
commit fa84a92
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 33 deletions.
diff --git a/ChatRPG/Areas/Identity/Pages/Account/Login.cshtml b/ChatRPG/Areas/Identity/Pages/Account/Login.cshtml
@@ -13,12 +13,12 @@
                 <div asp-validation-summary="ModelOnly" class="text-danger" role="alert"></div>
                 <div class="form-floating mb-3">
                     <input asp-for="Input.Username" class="form-control" autocomplete="username" aria-required="true" placeholder="username" />
-                    <label asp-for="Input.Username" class="form-label" style="color: black">Username</label>
+                    <label asp-for="Input.Username" class="form-label text-black">Username</label>
                     <span asp-validation-for="Input.Username" class="text-danger"></span>
                 </div>
                 <div class="form-floating mb-3">
                     <input asp-for="Input.Password" class="form-control" autocomplete="current-password" aria-required="true" placeholder="password" />
-                    <label asp-for="Input.Password" class="form-label" style="color: black">Password</label>
+                    <label asp-for="Input.Password" class="form-label text-black">Password</label>
                     <span asp-validation-for="Input.Password" class="text-danger"></span>
                 </div>
                 <div class="checkbox mb-3">
@@ -28,7 +28,7 @@
                     </label>
                 </div>
                 <div>
-                    <button id="login-submit" type="submit" class="w-100 btn btn-lg" style="background-color: #4eb758; color: black; border-color: black">Log in</button>
+                    <button id="login-submit" type="submit" class="w-100 btn-primary">Log in</button>
                 </div>
                 <div>
                     <p>

diff --git a/ChatRPG/Areas/Identity/Pages/Account/Manage/_Layout.cshtml b/ChatRPG/Areas/Identity/Pages/Account/Manage/_Layout.cshtml
@@ -9,10 +9,9 @@
     }
 }
 
-<h1>Manage your account</h1>
+<h1 class="text-center">Manage your account</h1>
 
 <div>
-    <h2>Change your account settings</h2>
     <hr />
     <div class="row">
         <div class="col-md-3">

diff --git a/ChatRPG/Areas/Identity/Pages/Account/Register.cshtml b/ChatRPG/Areas/Identity/Pages/Account/Register.cshtml
@@ -13,30 +13,30 @@
             <div asp-validation-summary="ModelOnly" class="text-danger" role="alert"></div>
             <div class="form-floating mb-3">
                 <input asp-for="Input.Username" class="form-control" autocomplete="username" aria-required="true" placeholder="username" />
-                <label asp-for="Input.Username" style="color: black">Username</label>
+                <label asp-for="Input.Username" class="text-black">Username</label>
                 <span asp-validation-for="Input.Username" class="text-danger"></span>
             </div>
             <div class="form-floating mb-3">
                 <input asp-for="Input.Email" class="form-control" autocomplete="email" aria-required="true" placeholder="name@example.com" />
-                <label asp-for="Input.Email" style="color: black">Email</label>
+                <label asp-for="Input.Email" class="text-black">Email</label>
                 <span asp-validation-for="Input.Email" class="text-danger"></span>
             </div>
             <div class="form-floating mb-3">
                 <input asp-for="Input.ConfirmEmail" class="form-control" autocomplete="email" aria-required="true" placeholder="name@example.com" />
-                <label asp-for="Input.ConfirmEmail" style="color: black">Confirm Email</label>
+                <label asp-for="Input.ConfirmEmail" class="text-black">Confirm Email</label>
                 <span asp-validation-for="Input.ConfirmEmail" class="text-danger"></span>
             </div>
             <div class="form-floating mb-3">
                 <input asp-for="Input.Password" class="form-control" autocomplete="new-password" aria-required="true" placeholder="password" />
-                <label asp-for="Input.Password" style="color: black">Password</label>
+                <label asp-for="Input.Password" class="text-black">Password</label>
                 <span asp-validation-for="Input.Password" class="text-danger"></span>
             </div>
             <div class="form-floating mb-3">
                 <input asp-for="Input.ConfirmPassword" class="form-control" autocomplete="new-password" aria-required="true" placeholder="password" />
-                <label asp-for="Input.ConfirmPassword" style="color: black">Confirm Password</label>
+                <label asp-for="Input.ConfirmPassword" class="text-black">Confirm Password</label>
                 <span asp-validation-for="Input.ConfirmPassword" class="text-danger"></span>
             </div>
-            <button id="registerSubmit" type="submit" class="w-100 btn btn-lg" style="background-color: #4eb758; color: black; border-color: black">Register</button>
+            <button id="registerSubmit" type="submit" class="w-100 btn btn-lg btn-primary">Register</button>
             <div>
                 <p>
                     Already a member? Login

diff --git a/ChatRPG/Pages/Shared/_Layout.cshtml b/ChatRPG/Pages/Shared/_Layout.cshtml
@@ -10,15 +10,15 @@
     <title>@ViewData["Title"] - ChatRPG</title>
 
     <environment include="Development">
-        <link rel="stylesheet" href="~/Identity/lib/bootstrap/dist/css/bootstrap.css" />
-        <link rel="stylesheet" href="~/Identity/css/site.css" />
+        <link rel="stylesheet" href="~/css/bootstrap/bootstrap.min.css" />
+        <link rel="stylesheet" href="~/css/site.css" />
     </environment>
     <environment exclude="Development">
         <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css"
               integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous"
               asp-fallback-href="~/Identity/lib/bootstrap/dist/css/bootstrap.min.css"
               asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" />
-        <link rel="stylesheet" href="~/Identity/css/site.css" asp-append-version="true" />
+        <link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
     </environment>
 </head>
 <body class="vh-100 m-0" style="background-color: #3E3A3A">
@@ -49,23 +49,24 @@
         </nav>
     </header>
 
-    <div class="container mt-5 h-75 d-flex align-items-center">
-        <main role="main" class="pt-4 pb-4 flex-grow-1" style="background-color: #232323; color: white">
-            @RenderBody()
-        </main>
-    </div>
-    <footer class="footer pl-3 text-muted" style="overflow: hidden">
-        <div class="container">
+<div class="container-fluid mt-5 h-75 d-flex align-items-center justify-content-center">
+    <main role="main" class="pt-4 pb-4 col-6" style="background-color: #232323; color: white">
+        @RenderBody()
+    </main>
+</div>
+
+<footer class="footer pl-3 text-muted" style="overflow: hidden; position: fixed; bottom: 0; padding: 10px">
+    <div class="container">
         &copy; 2023 - ChatRPG
-            @{
-                var foundPrivacy = Url.Page("/Privacy", new { area = "" });
-            }
-            @if (foundPrivacy != null)
-            {
-                <a asp-area="" asp-page="/Privacy">Privacy</a>
-            }
-        </div>
-    </footer>
+        @{
+            var foundPrivacy = Url.Page("/Privacy", new { area = "" });
+        }
+        @if (foundPrivacy != null)
+        {
+            <a asp-area="" asp-page="/Privacy">Privacy</a>
+        }
+    </div>
+</footer>
 
     <environment include="Development">
         <script src="~/Identity/lib/jquery/dist/jquery.js"></script>

diff --git a/ChatRPG/wwwroot/css/site.css b/ChatRPG/wwwroot/css/site.css
@@ -13,9 +13,23 @@ a, .btn-link {
 }
 
 .btn-primary {
-    color: #fff;
-    background-color: #1b6ec2;
-    border-color: #1861ac;
+    background-color: #4eb758;
+    color: black;
+    border-color: black;
+}
+
+.btn-primary:hover {
+    background-color: #297931;
+    color: black;
+    border-color: black;
+}
+
+.btn-primary:focus {
+    background-color: #297931;
+    color: black;
+    border-color: black;
+    box-shadow: none;
+    outline: white;
 }
 
 .btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {