make tags less visually strong

skulshreshtha · Sep 12, 2020 · 9827abc · 9827abc
1 parent bb7ddee
commit 9827abc
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 7 deletions.
diff --git a/_layouts/home.html b/_layouts/home.html
@@ -78,7 +78,7 @@ <h3 class="post-subtitle">
 
     {% if site.feed_show_tags != false and post.tags.size > 0 %}
     <div class="blog-tags">
-      Tags:
+      <span>Tags:</span>
       {% for tag in post.tags %}
       <a href="{{ '/tags' | absolute_url }}#{{- tag -}}">{{- tag -}}</a>
       {% endfor %}

diff --git a/_layouts/post.html b/_layouts/post.html
@@ -45,7 +45,7 @@
 
       {% if page.tags.size > 0 %}
         <div class="blog-tags">
-          Tags:
+          <span>Tags:</span>
           {% for tag in page.tags %}
             <a href="{{ '/tags' | relative_url }}#{{- tag -}}">{{- tag -}}</a>
           {% endfor %}

diff --git a/assets/css/beautifuljekyll.css b/assets/css/beautifuljekyll.css
@@ -540,21 +540,28 @@ footer .footer-custom-content {
 
 .blog-tags {
   font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-  color: #999;
   font-size: 0.9375rem;
   margin-bottom: 1.875rem;
 }
 
+.blog-tags span {
+  color: {{ site.text-col | default: "#404040" }};
+  opacity: 0.8;
+}
+
 .blog-tags a {
-  color: {{ site.link-col | default: "#008AFF" }};
+  color: {{ site.text-col | default: "#404040" }};
   text-decoration: none;
   padding: 0 0.3125rem;
+  opacity: 0.8;
+  border: 1px solid transparent;
+  border-radius: 2px;
 }
 
 .blog-tags a:hover {
-  border-radius: 2px;
-  color: {{ site.hover-col | default: "#0085A1" }};
-  background-color: #EEE;
+  opacity: 1;
+  color: {{ site.text-col | default: "#404040" }};
+  border-color: {{ site.text-col | default: "#404040" }};
 }
 
 .post-preview .blog-tags {