style: 💄 Add some micro effect

Author: mattboll

Diff for: site/layouts/work/li.html

@@ -1,6 +1,6 @@
 {{ $baseurl := .Site.BaseURL }}
 
-<div>
+<div class="work-container">
   {{ if .Truncated }}
   <a aria-label="En savoir plus sur {{ .Title }}" href="{{ .Permalink }}">
   {{ end }}

Diff for: src/css/_blog.scss

@@ -38,13 +38,13 @@ section#articles {
       }
 
       &:hover {
-        box-shadow: 4px 4px 8px $light;
+        box-shadow: 4px -4px 8px $light;
         border-color: $light;
         transform: perspective(40px) translateZ(0.5px);
         &::before{
           bottom: 0;
           height: 4%;
-          width: 90%;
+          width: 100%;
           border-radius: 30px;
         }
       }

Diff for: src/css/_portfolio.scss

@@ -5,6 +5,12 @@ section#portfolio {
   color: $white;
   background: $black;
 
+    .work-container {
+      &:hover {
+        transform: perspective(40px) translateZ(0.5px);
+      }
+    }
+
   .wrapper {
     display: flex;
     flex-wrap: wrap;
@@ -172,7 +178,7 @@ section#work, section#portfolio{
     .wrapper {
       & > div {
         border: 1px solid $darkgrey;
-        border-left: none;
+        background: $black;
         min-width: 25%;
         max-width: 25%;
         img {