Fix social meta tags and minor changes

* Fix twitter meta tags * Fix rel=me links at the <head> * Fix structured data sameAs * Add Funkwhale, PixelFed, Riot.im and SoundCloud * Other minor changes
author: rmaguiar <rmaguiar@tuta.io> 2020-07-13 17:50:41 +0300
committer: rmaguiar <rmaguiar@tuta.io> 2020-07-13 17:50:41 +0300
commit: 150d3f3a52ccafabe54eee284fb10d05e13d76c4 (patch)
tree: 113454376a7fae6db773d2b9f2496eb73eb4c3d7 /assets
parent: ec1adfd5b89444445e74a394bc06b4c03a9c3f1a (diff)
9 files changed, 63 insertions, 34 deletions
diff --git a/assets/bundle.svg b/assets/bundle.svg
index 4ec55ba..d39e25d 100644
--- a/assets/bundle.svg
+++ b/assets/bundle.svg
@@ -1,6 +1,6 @@
 <!--
-  Most icons are from FontAwesome 5
-  PeerTube and Matrix are from Fork-Awesome
+  From FontAwesome 5:
+  adjust, angle-right, angle-double-right, caret-down and hashtag.
 -->
 
 <!-- Reduce repetition... -->
@@ -37,7 +37,7 @@
   {{ end }}
   
   
-  
+  <!-- Get icon data from "social.json" -->
   {{ range .Site.Data.social }}
     {{ if and (or (index (or $centralizedOnPage $centralizedOnSite) .entry) (index (or $decentralizedOnPage $decentralizedOnSite) .entry)) .icon }}
       <symbol viewBox="{{ .icon.viewBox }}" id="{{ .icon.id }}">
@@ -45,4 +45,5 @@
       </symbol>
     {{ end }}
   {{ end }}
+  
 </svg>
 \ No newline at end of file
diff --git a/assets/js/postpone.js b/assets/js/postpone.js
index f220ee3..1bbb7ab 100644
--- a/assets/js/postpone.js
+++ b/assets/js/postpone.js
@@ -4,7 +4,7 @@
 / Accent color palette
 ******************************/
 
-const PALETTE   = document.querySelector('footer input');
+const PALETTE = document.querySelector('footer input');
 
 PALETTE.onchange = function () {
 
diff --git a/assets/js/prepone.js b/assets/js/prepone.js
index cb6ea73..ac3e408 100644
--- a/assets/js/prepone.js
+++ b/assets/js/prepone.js
@@ -79,7 +79,6 @@ function getAccent() {
   };
   
   return currentAccent
-  
 };
 
 var activeAccent = getAccent();
@@ -111,7 +110,7 @@ document.addEventListener('DOMContentLoaded', function () {
     document.body.style.transition 
     = document.querySelector('header').style.transition
     = document.querySelector('footer').style.transition
-    = 'background-color {{ $changeTransition }}, color {{ $changeTransition }}'
+    = '{{ printf "background-color %[1]s, color %[1]s" $changeTransition }}'
   };
   
   // Give the user a choice
@@ -135,8 +134,9 @@ document.addEventListener('DOMContentLoaded', function () {
     
     updateAccent()
   };
-  
 
+  
+  // TEST
   // Keyboard shortcut for mode change, here for testing purposes only
   // CTRL + ALT + M
   {{ if .Site.IsServer }}
@@ -149,6 +149,7 @@ document.addEventListener('DOMContentLoaded', function () {
     }, false);
   {{ end }}
 
+
   // Runs when OS changes light/dark mode. Changes only if you were on default
   // color state (light on light mode, dark on dark mode).
   function OSModeChange() {
diff --git a/assets/scss/base/mixins.scss b/assets/scss/base/mixins.scss
index 4d5c68d..9a0c83d 100644
--- a/assets/scss/base/mixins.scss
+++ b/assets/scss/base/mixins.scss
@@ -17,3 +17,17 @@
     0 1px 0 $color,
     1px 0 0 $color;
 }
+
+
+// Responsiveness
+@mixin respond-above($breakpoint) {
+  @media (min-width: ($breakpoint + 1)) {
+    @content;
+  }
+}
+
+@mixin respond-below($breakpoint) {
+  @media (max-width: $breakpoint) {
+    @content;
+  }
+}
diff --git a/assets/scss/colors/chroma/dark.scss b/assets/scss/colors/chroma/dark.scss
index cc703b4..ca623d2 100644
--- a/assets/scss/colors/chroma/dark.scss
+++ b/assets/scss/colors/chroma/dark.scss
@@ -23,7 +23,7 @@ li code {
 
 .chroma .lntable {
   border-spacing: 0;
-  padding: 0;
+  //padding: 0;
   margin: 0;
   border: 0;
   width: auto;
diff --git a/assets/scss/colors/chroma/light.scss b/assets/scss/colors/chroma/light.scss
index 2fa586a..9e864d5 100644
--- a/assets/scss/colors/chroma/light.scss
+++ b/assets/scss/colors/chroma/light.scss
@@ -18,7 +18,7 @@ li code {
 
 .chroma .lntable {
   border-spacing: 0;
-  padding: 0;
+  //padding: 0;
   margin: 0;
   border: 0;
   width: auto;
diff --git a/assets/scss/exclusive/social.scss b/assets/scss/exclusive/social.scss
index e788f32..88d919a 100644
--- a/assets/scss/exclusive/social.scss
+++ b/assets/scss/exclusive/social.scss
@@ -28,8 +28,8 @@ section.social {
     align-items: center;
     
     margin: 0 9px 9px 0;
-    min-width: 150px; //150px;
-    padding: 15px 21px; // 24px 12px 15px; // 18px 0;
+    min-width: 150px;
+    padding: 15px 21px;
     
     text-align: center;
 
diff --git a/assets/scss/fonts/font-face.scss b/assets/scss/fonts/font-face.scss
index ac00759..378ab88 100644
--- a/assets/scss/fonts/font-face.scss
+++ b/assets/scss/fonts/font-face.scss
@@ -4,14 +4,14 @@
 // NOTE
 // Added the font-display afterwards
 
-$display: swap;
+$font-display: swap;
 
 /* oswald-700 - latin */
 @font-face {
   font-family: 'Oswald';
   font-style: normal;
   font-weight: 700;
-  font-display: $display;
+  font-display: $font-display;
   src: local('Oswald'),
        url('../fonts/oswald-v29-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
        url('../fonts/oswald-v29-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
@@ -22,7 +22,7 @@ $display: swap;
   font-family: 'Open Sans';
   font-style: normal;
   font-weight: 400;
-  font-display: $display;
+  font-display: $font-display;
   src: local('Open Sans Regular'), local('OpenSans-Regular'),
        url('../fonts/open-sans-v17-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
        url('../fonts/open-sans-v17-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
@@ -33,7 +33,7 @@ $display: swap;
   font-family: 'Open Sans';
   font-style: normal;
   font-weight: 700;
-  font-display: $display;
+  font-display: $font-display;
   src: local('Open Sans Bold'), local('OpenSans-Bold'),
        url('../fonts/open-sans-v17-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
        url('../fonts/open-sans-v17-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
@@ -44,7 +44,7 @@ $display: swap;
   font-family: 'Open Sans';
   font-style: italic;
   font-weight: 400;
-  font-display: $display;
+  font-display: $font-display;
   src: local('Open Sans Italic'), local('OpenSans-Italic'),
        url('../fonts/open-sans-v17-latin-italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
        url('../fonts/open-sans-v17-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
diff --git a/assets/scss/main.scss b/assets/scss/main.scss
index c4028a9..2957c78 100644
--- a/assets/scss/main.scss
+++ b/assets/scss/main.scss
@@ -11,6 +11,8 @@ $change-transition: {{ .Scratch.Get "changeTransition" }};
 
 
 
+
+
 // Default size
 :root {
   font-size: $font-size;
@@ -44,12 +46,11 @@ html {
     
       {{ if (fileExists "static/css/chroma/light.css") }}
         @import '/css/chroma/light.css';
-      {{ else }}
+      {{ else if (resources.Get "scss/colors/chroma/light.scss") }}
         @import 'colors/chroma/light';
       {{ end }}
       
     {{ end }}
-
   }
   
   // Dark mode
@@ -78,21 +79,18 @@ html {
     
     // Custom Chroma stylesheet
     {{ if .Site.Params.Style.useCustomChroma | default true }}
-    
+
       {{ if (fileExists "static/css/chroma/dark.css") }}
         @import '/css/chroma/dark.css';
-      {{ else }}
+      {{ else if (resources.Get "scss/colors/chroma/dark.scss") }}
         @import 'colors/chroma/dark';
       {{ end }}
       
     {{ end }}
-
   }
-  
 }
 
 
-
 body {
   
   // Some reset
@@ -210,7 +208,6 @@ body {
         &::-webkit-color-swatch-wrapper {
           padding: 0;
         }
-        
       }
 
       button {
@@ -338,9 +335,7 @@ code {
 }
 
 
-
-
-
+// If there's no custom header partial, style a default one
 {{ if not (or (templates.Exists "partials/custom/header") (templates.Exists "partials/custom/header.html")) }}
   body > header {
     > a {
@@ -689,7 +684,7 @@ section.scroll {
 // TODO
 // Get rid of this !important
 div.highlight > div table {
-  padding: 0 24px !important;
+  padding: 0 24px;
   max-height: $box-max-height;
 }
 
@@ -700,7 +695,7 @@ div.chroma td:first-of-type {
 article > pre,
 span.katex-display,
 div.highlight > pre {
-  padding: 21px 24px;
+  padding: var(--hl-pad);
 }
 
 article > pre,
@@ -798,7 +793,7 @@ ul.posts {
 }
 
 // Not sure if I like this
-@media (max-width: $mobile-breakpoint) {
+@include respond-below($mobile-breakpoint) {
   ul.posts a {
     flex-direction: column-reverse;
     align-items: unset;
@@ -1241,7 +1236,7 @@ blockquote {
   border-width: 1px 1px 1px 12px;
   color: var(--alt-fg);
 
-  margin: 2.1rem 1.5rem;
+  margin: var(--blk-mg);
   
   padding: 0 30px;
   
@@ -1287,10 +1282,27 @@ article {
 }
 
 
+html {
+  --blk-mg: 1.05rem .75rem;
+  --il-pad: 0 12px;
+  
+  --hl-pad: 15.75px 18px;
+}
+
+@include respond-above($mobile-breakpoint) {
+  html {
+    --blk-mg: 2.1rem 1.5rem;
+    --il-pad: 6px 24px;
+    
+    --hl-pad: 21px 24px;
+  }
+}
+
+
 
 {{ if .Site.Params.Style.hideAnchors }}
 
-  @media (min-width: $mobile-breakpoint) {
+  @include respond-above($mobile-breakpoint) {
     a.anchor:not(:focus) {
       opacity: 0;
     }
@@ -1325,16 +1337,17 @@ p.error {
 // Rich Content
 {{ if (fileExists "static/css/rich-content.css") }}
   @import '/css/rich-content.css';
-{{ else if (fileExists "assets/scss/rich-content.scss") }}
+{{ else if (resources.Get "scss/rich-content.scss") }}
   @import 'rich-content';
 {{ end }}
 
 
+
 // TODO
 // Custom user stuff
 // This isn't good enough
 {{ if (fileExists "static/css/custom.css") }}
   @import '/css/custom.css';
-{{ else if (fileExists "assets/scss/custom.scss") }}
+{{ else if (resources.Get "scss/custom.scss") }}
   @import 'custom';
 {{ end }}
author	rmaguiar <rmaguiar@tuta.io>	2020-07-13 17:50:41 +0300
committer	rmaguiar <rmaguiar@tuta.io>	2020-07-13 17:50:41 +0300
commit	150d3f3a52ccafabe54eee284fb10d05e13d76c4 (patch)
tree	113454376a7fae6db773d2b9f2496eb73eb4c3d7 /assets
parent	ec1adfd5b89444445e74a394bc06b4c03a9c3f1a (diff)