add base.css file including content styling code and edit top header

brianach · Dec 13, 2023 · a4b3b4f · a4b3b4f
1 parent 9b4eed6
commit a4b3b4f
Show file tree

Hide file tree

Showing 2 changed files with 58 additions and 1 deletion.
diff --git a/static/css/base.css b/static/css/base.css
@@ -0,0 +1,57 @@
+html {
+    height: 100%;
+}
+
+body {
+    background: url('/media/Wizard.Barristers_.Benmashi.Cecil.full.2544053.jpg') no-repeat center center fixed;
+    background-size: cover;
+    height: calc(100vh - 164px);
+    color: #555;
+    font-family: 'Lato';
+}
+
+/* from Bulma to ensure that font awesome icons will always stay perfectly centered and have a consistent size*/
+.icon {
+    align-items: center;
+    display: inline-flex;
+    justify-content: center;
+    height: 1.5rem;
+    width: 1.5rem;
+}
+
+.logo-font {
+    text-transform: uppercase;
+}
+
+.main-logo-link {
+    width: fit-content;
+}
+
+.shop-now-button {
+    background: black;
+    color: white;
+    min-width: 260px;
+}
+
+.btn-black {
+    background: black;
+    color: white;
+}
+
+.shop-now-button:hover,
+.shop-now-button:active,
+.shop-now-button:focus,
+.btn-black:hover,
+.btn-black:active,
+.btn-black:focus {
+    background: #222;
+    color: white;
+}
+
+.text-black {
+    color: #000 !important;
+}
+
+.border-black {
+    border: 1px solid black !important;
+}
diff --git a/templates/base.html b/templates/base.html
@@ -41,7 +41,7 @@
 
 <body>
     <header class="container-fluid fixed-top">
-        <div class="row">
+        <div id="topnav" class="row bg-white pt-lg-2 d-none d-lg-flex">
             <div class="col-12 col-lg-4 my-auto py-1 py-lg-0 text-center text-lg-left">
                 <a href="{% url 'home' %}" class="nav-link main-logo-link">
                     <h2 class="logo-font text-black my-0"><strong>FMCI</strong> Store</h2>