:art: adding shadows back | making up for lost gap in places | fixing single page article margin

vue-theme/src/components/card.vue

@@ -75,13 +75,14 @@ export default {
         -webkit-line-clamp: $card-line-clamp
         -webkit-box-orient: vertical
         overflow-y: clip
+        margin: $ms--2 0 0 0
     p
         &.datetime
             font-size: $ms--1
             margin: 0
         &.excerpt
             overflow: hidden
-            margin: 0
+            margin: $ms--2 0 0 0
             -webkit-line-clamp: $card-line-clamp
             -webkit-box-orient: vertical
             display: -webkit-box
@@ -104,5 +105,5 @@ export default {
             grid-gap: $ms--2
             /* Featured image link */
             > a
-                max-width: 50%
+                width: 100%
 </style>

vue-theme/src/components/navigation/navigation.vue

@@ -111,7 +111,7 @@ nav.main
             font-weight: 400
             margin: 0
         img
-            margin: 0 0 calc(-1 * $ms--5) 0
+            margin: 0 $ms--2 calc(-1 * $ms--6) 0
         > ul
             padding: 0 0 0 $ms-0
             > li:nth-child(1)

vue-theme/src/pages/index.vue

@@ -9,25 +9,25 @@
         section(v-if="allSticky && Object.keys(allSticky).length").stickies
             ul(:class="[`sticky-${Object.keys(allSticky).length}`, 'flipped']")
                 //- if sticky
-                li.post(v-for="sticky in allSticky")
+                li.post.shadow(v-for="sticky in allSticky")
                     card(:content="sticky" :type="`${sticky.type}`")
         
         //- firstRow: ['episodes', 'exhibitions', 'events', 'shorts', 'posts'], exceprt on episodes only.
         section
             ul
-                li.post(v-for="type in firstRow")
+                li.post.shadow(v-for="type in firstRow")
                     card(:content="firstPostOfType(type)" :type="type")
         
         //- secondRow: 'artists', // This is only ONE post, excerpt on artist
         section.max
             ul.w-max
-                li.post(v-for="post in randomPosts.filter(p => p.type == secondRow)")
+                li.post.shadow(v-for="post in randomPosts.filter(p => p.type == secondRow)")
                     card(v-if="post" :content="post" :type="`${post.type}`" :wide="true")
         
         //- (thirdRow) firstRow.flipped: ['guides', 'objects', 'techniques', 'talks', 'center'], exceprt on guides only
         section
             ul.flipped
-                li.post(v-for="type in thirdRow")
+                li.post.shadow(v-for="type in thirdRow")
                      .random--wrapper(v-for="post in randomPosts.filter(p => p.type == type)")
                         card(:content="post" :type="type")
 </template>

vue-theme/src/pages/list.vue

@@ -15,7 +15,7 @@
             )
 
         ul.posts.f-col(v-if="posts && loaded" :class="{ 'is-grid': grid }")
-            li(v-for="(post, i) in posts" :key="post.slug").post
+            li(v-for="(post, i) in posts" :key="post.slug").post.shadow
                 card(:content="post" :type="type" :wide="isWide")
         
         //- Important: Do NOT remove this! Required for intersection observer
@@ -243,6 +243,7 @@ export default {
     /* posts not grid list */
     .posts
         list-style: none
+        grid-gap: $ms--2
         .post
             width: 100%
 
@@ -251,7 +252,6 @@ export default {
         width: 100%
         display: grid
         grid-template-columns: repeat(3, 1fr)
-        grid-gap: $ms--2
         align-items: start
         /* This is important for how the grid lines up to the page */
         justify-content: right 

vue-theme/src/pages/single.vue

@@ -333,7 +333,7 @@ export default {
 @media (min-width: $medium)
     .page--single
         article
-            padding: 0 0.65em 0 0
+            margin: 0 0.65em 0 0
         &.f-col
             flex-direction: row
 </style>