Add donate button, change link styles

themes/starter/languages/en.yml

@@ -82,6 +82,7 @@ stars: early adopters
 features: features
 information: information
 contributing: contributing
+donate: DONATE
 note: note
 soon: coming soon
 uMatch: Find users similar to you by their vocabulary

themes/starter/layout/_partial/contributing.ejs

@@ -12,6 +12,10 @@
 
 <strong><%- __('foreword') %></strong>
 
+<% if (data.donate) { %>
+  <a href="<%= data.donate %>" class="u-block u-emphasize btn-action u-center" style="color: white; background-color: #<%= data.logoClr %>"><%- __('donate') %></a>
+<% } %>
+
 <p><%- __('promptStart') %> <%= page.title %> <%- __('promptEnd') %></p>
 
 <ol>

themes/starter/source/assets/scss/modules/_chronicles.scss

@@ -43,6 +43,12 @@
     }
 }
 
+.post__preview.featured,
+.post__preview a.oneliner {
+  padding: 0;
+  background: none;
+}
+
 .post__preview:not(.wanted):not(.featured) a:focus > p {
   color: $coral;
 }

themes/starter/source/assets/scss/modules/_index.scss

@@ -39,6 +39,9 @@
   font-family: $font-secondary;
   display: inline-flex;
   border-bottom: none;
+    &:hover {
+      background: none;
+    }
 }
 
 .grid__item__image {
@@ -79,11 +82,6 @@
   left: 26%;
 }
 
-.f-Osada {
-  top: 76%;
-  left: 48%;
-}
-
 .f-diaspora {
   top: 6em;
   left: 87%;
@@ -106,12 +104,12 @@
 
 .f-GNUSocial {
   top: 83%;
-  left: 83%;
+  left: 79%;
 }
 
 .f-PeerTube {
   top: 65%;
-  left: 90%;
+  left: 85%;
 }
 
 .f-PixelFed {
@@ -289,11 +287,6 @@
     flex: 25% 0 0;
   }
 
-  .f-Aardwolf {
-    top: -1em;
-    left: 70%;
-  }
-
   .f-diaspora {
     left: 75%;
   }

themes/starter/source/assets/scss/modules/_navbar.scss

@@ -31,24 +31,24 @@
   font-family: $font-secondary;
   color: $grey;
   line-height: 2.2;
+  width: 100%;
 }
 
 .navbar li.todo {
   text-align: center;
-}
-
-.navbar li:not(:last-child) {
-  margin: 0 .8em;
+  padding-right: 1.2em;
 }
 
 .navbar a {
-  transition: color .2s ease;
   border-bottom: none;
+  display: block;
+  padding: 0 0 .1em 1em;
 }
 
 .navbar a:hover,
 .navbar a:focus {
   color: $golden;
+  background-size: 2.5em 2.5em;
 }
 
 .navbar li:not(:last-child):hover svg {
@@ -67,7 +67,7 @@
   right: 0;
   width: 200px;
   height: 100vh;
-  padding: 8em 22px 1em 22px;
+  padding: 8em 0 1em 20px;
   background-color: $white;
   display: inline-block;
   transform: matrix(1, 0, 0, 1, 220, 0);

themes/starter/source/assets/scss/partials/_layout.scss

@@ -60,11 +60,19 @@ a {
   text-decoration: none;
   color: $black;
   border-bottom: 1px solid $black;
+  transition: all .15s ease;
+  background-repeat: repeat-x;
+  background-size: 0 0;
+  background-position: 0 65%;
+  padding: 0 .1em;
     &:hover,
     &:focus,
     &:active {
       color: $golden;
       outline: none;
+      border-bottom: none;
+      background-image: linear-gradient($black);
+      background-size: 1.5em 1.5em;
     }
 }
 
@@ -74,8 +82,8 @@ a.dark-ui {
     &:hover,
     &:focus,
     &:active {
-      color: $golden;
       outline: none;
+      border-bottom: none;
     }
 }
 
@@ -138,13 +146,14 @@ dfn {
   max-width: 170px;
   border: none;
   margin: .5em 0;
-  background-color: $golden;
+  background: $golden;
   border-radius: 6px;
   padding: 7px;
     &:hover,
     &:active,
     &:focus {
       background: $black;
+      box-shadow: 0px 2px 4px 0px $asphalt;
     }
 }