Blog layout: streamline and fix styling RSS button (#1193)

google · Aug 29, 2022 · 888f148 · 888f148
1 parent 219c2db
commit 888f148
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 10 deletions.
diff --git a/assets/scss/_blog.scss b/assets/scss/_blog.scss
@@ -1,10 +1,14 @@
-// Blog related styles.
-
 .td-blog {
-    .td-rss-button {
-        position: absolute;
-        top: 5.5rem;
-        right: 1rem;
-        z-index: 22;
-    }
+  .td-rss-button {
+    @extend .btn;
+    @extend .btn-lg;
+    @extend .-bg-orange;
+
+    position: absolute;
+    right: 1rem;
+    z-index: 22;
+
+    display: none;
+    @extend .d-lg-block;
+  }
 }
diff --git a/layouts/blog/baseof.html b/layouts/blog/baseof.html
@@ -20,8 +20,8 @@
           </aside>
           <main class="col-12 col-md-9 col-xl-8 pl-md-5 pr-md-4" role="main">
             {{ with .CurrentSection.OutputFormats.Get "rss" -}}
-            <a class="btn btn-lg -bg-orange td-rss-button d-none d-lg-block" href="{{ .Permalink | safeURL }}" target="_blank">
-              RSS <i class="fa-solid fa-rss"></i>
+            <a class="td-rss-button" title="RSS" href="{{ .Permalink | safeURL }}" target="_blank" rel="noopener">
+              <i class="fa-solid fa-rss" aria-hidden="true"></i>
             </a>
             {{ end -}}
             {{ block "main" . }}{{ end }}