added back button to blog and failed at adding pretty URLs

melanierosson · Nov 26, 2024 · ac1189a · ac1189a
1 parent f7544df
commit ac1189a
Show file tree

Hide file tree

Showing 5 changed files with 61 additions and 3 deletions.
diff --git a/assets/css/mpowheard.css b/assets/css/mpowheard.css
@@ -276,6 +276,25 @@ body div.cta button#cta:hover {
     margin-right: 7.5rem;
   }
 }
+body .back-blog {
+  padding: 10px;
+  max-width: 100px;
+  max-height: 42px;
+  background-color: white;
+  border-radius: 50px;
+  text-decoration: none;
+  text-align: center;
+  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.15), 0 5px 10px 0 rgba(0, 0, 0, 0.14);
+}
+body .back-blog a, body .back-blog a:hover {
+  text-decoration: none;
+}
+body .back-blog:hover {
+  text-decoration: none;
+  background-color: #EBFCFF;
+  cursor: pointer;
+  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.1), 0 5px 10px 0 rgba(0, 0, 0, 0.1);
+}
 body nav.navbar {
   background-color: #FBFE3B;
   color: #000000;

diff --git a/assets/scss/mpowheard.scss b/assets/scss/mpowheard.scss
@@ -282,6 +282,25 @@ body {
 			}
 		}
 	}
+	.back-blog {
+		padding:10px;
+		max-width:100px;
+		max-height:42px;
+		background-color:white;
+		border-radius:50px;
+		text-decoration:none;
+		text-align:center;
+		box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.15), 0 5px 10px 0 rgba(0, 0, 0, 0.14);
+		a, a:hover {
+			text-decoration:none;
+		}
+	}
+	.back-blog:hover {
+		text-decoration:none;
+		background-color:#EBFCFF;
+		cursor:pointer;
+		box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.1), 0 5px 10px 0 rgba(0, 0, 0, 0.1);
+	}
 
 	nav.navbar {
 		background-color: $yellow;

diff --git a/blog/post-20241112.html b/blog/post-20241112.html
@@ -89,6 +89,11 @@
         <header class="masthead" style="background-image: url('assets/img/20241112-lg-guerillamarketing.jpg')">
             <div class="container position-relative px-4 px-lg-5">
                 <div class="row gx-4 gx-lg-5 justify-content-center">
+                    <div class="col-12">
+                        <div class="back-btn back-blog mb-4" onclick="window.location.assign('index.html')">
+                            <a class="back-btn hotpink" href="index.html">← blog</a>
+                        </div>
+                    </div>
                     <div class="col-md-10 col-lg-8 col-xl-7">
                         <div class="post-heading">
                             <h1>Unusual Marketing Strategies That Can Supercharge Your Brand</h1>
@@ -202,6 +207,11 @@ <h3>Final Thoughts: Think Outside the Box to Unlock Maximum Impact</h3>
 
                     </div>
                 </div>
+                <div class="col-12 mb-4 pb-4">
+                    <div class="back-btn back-blog mb-4" onclick="window.location.assign('index.html')">
+                        <a class="back-btn hotpink" href="index.html">← blog</a>
+                    </div>
+                </div>
             </div>
         </article>
 

diff --git a/blog/post-20241118.html b/blog/post-20241118.html
@@ -89,6 +89,11 @@
         <header class="masthead" style="background-image: url('assets/img/pexels-karolina-grabowska-4467687-lg-20241118.jpg')">
             <div class="container position-relative px-4 px-lg-5">
                 <div class="row gx-4 gx-lg-5 justify-content-center">
+                    <div class="col-12">
+                        <div class="back-btn back-blog mb-4" onclick="window.location.assign('index.html')">
+                            <a class="back-btn hotpink" href="index.html">← blog</a>
+                        </div>
+                    </div>
                     <div class="col-md-10 col-lg-8 col-xl-7">
                         <div class="post-heading">
                             <h1>UX Specialists: Your Secret Weapon</h1>
@@ -202,6 +207,11 @@ <h2><strong><span>Why Your Business Needs a UX Specialist</span></strong></h2>
 
                     </div>
                 </div>
+                <div class="col-12 mb-4 pb-4">
+                    <div class="back-btn back-blog mb-4" onclick="window.location.assign('index.html')">
+                        <a class="back-btn hotpink" href="index.html">← blog</a>
+                    </div>
+                </div>
             </div>
         </article>
 

diff --git a/why.html b/why.html
@@ -79,13 +79,13 @@
       </button>
       <div class="collapse navbar-collapse" id="navbarResponsive">
         <ul class="navbar-nav ml-auto">
-          <li  id="nav-why" class="nav-item active" onclick="window.location.assign('why.html')">
+          <li  id="nav-why" class="nav-item active" onclick="window.location.assign('./why.html')">
             <a class="nav-link" href="./why.html">Why</a>
           </li>
-          <li  id="nav-opt" class="nav-item" onclick="window.location.assign('options.html')">
+          <li  id="nav-opt" class="nav-item" onclick="window.location.assign('./options.html')">
             <a class="nav-link" href="./options.html">Offers</a>
           </li>
-          <li  id="nav-connect" class="nav-item" onclick="window.location.assign('connect.html')">
+          <li  id="nav-connect" class="nav-item" onclick="window.location.assign('./connect.html')">
             <a class="nav-link" href="./connect.html">Connect</a>
           </li>
           <li  id="nav-blog" class="nav-item" onclick="window.location.assign('./blog/index.html')">