tag adjustments

src/_data/meta.js

@@ -31,6 +31,7 @@ module.exports = {
       'Tell the word what you are writing about in your blog. It will show up on feed readers.',
     tagSingle: 'Tag',
     tagPlural: 'Tags',
+    tagMore: 'More tags:',
     // feed links are looped over in the head.
     feedLinks: [{title: 'Atom Feed', url: '/feed.xml', type: 'application/atom+xml'}],
     pagination: 'Blog',

src/assets/css/blocks/button.css

@@ -13,7 +13,8 @@
 
 .button:hover,
 .button[aria-current='page'],
-.button[aria-pressed='true'] {
+.button[aria-pressed='true'],
+.button[data-state='active'] {
   background-size: 150% 150%;
   --button-bg: var(--color-text);
   --button-text: var(--color-bg);

src/assets/css/blocks/card.css

@@ -16,8 +16,8 @@
 .card h3 {
   font-family: var(--font-base);
   font-size: var(--size-step-2);
-  font-weight: 700;
 }
+
 .card h2 a,
 .card h3 a {
   text-decoration: none;

src/assets/css/blocks/tag.css

@@ -26,3 +26,7 @@
 .tags h1 {
   font-size: var(--size-step-4);
 }
+
+.tags h2 {
+  font-size: var(--size-step-2);
+}

src/common/tagList.njk

@@ -9,6 +9,20 @@ eleventyComputed:
   title: '{{ meta.blog.tagSingle }}: {{ tag }}'
 ---
 
+
+<ul class="grid region" role="list" data-rows="masonry" data-layout="50-50">
+	<!-- loop posts -->
+	{% set itemList = collections[tag] | reverse %} {% for item in itemList %}
+	<!-- activate tags -->
+	{% set activateTags = true %}
+	<!-- set heading context -->
+	{% set headingContext = "h2" %}
+	<!-- card -->
+	{% include 'components/card.njk' %} {% endfor %}
+</ul>
+
+<h2>{{ meta.blog.tagMore }}</h2>
+
 <ul class="taglist | my-s-m cluster" role="list">
   {% for tag in collections.tagList %}
  <li><a
@@ -27,16 +41,3 @@ eleventyComputed:
 </ul>
 
 
-
-<ul class="grid region" role="list" data-rows="masonry" data-layout="50-50">
-	<!-- loop posts -->
-	{% set itemList = collections[tag] | reverse %} {% for item in itemList %}
-	<!-- activate tags -->
-	{% set activateTags = true %}
-	<!-- set heading context -->
-	{% set headingContext = "h2" %}
-	<!-- card -->
-	{% include 'components/card.njk' %} {% endfor %}
-</ul>
-
-

src/common/tags.njk

@@ -5,7 +5,7 @@ eleventyComputed:
   title: '{{ meta.blog.tagPlural }}'
 ---
 
-<div class="taglist | my-s-m cluster">
+<div class="taglist | mt-s-m cluster">
   {% for tag in collections.tagList %}
   <a href="/tags/{{ tag }}" class="button">
     {{ tag }}
@@ -13,6 +13,7 @@ eleventyComputed:
   {% endfor %}
 </div>
 
+
 <ul class="grid region" role="list" data-rows="masonry" data-layout="50-50">
   <!-- loop posts -->
   {% set itemlist = collections.posts %} {% for item in itemlist %}
@@ -23,3 +24,5 @@ eleventyComputed:
   <!-- card -->
   {% include 'components/card.njk' %} {% endfor %}
 </ul>
+
+