From 79f807e01a13f5246c8ce7e9beb9d4b552c63296 Mon Sep 17 00:00:00 2001
From: Jan-Lukas Else <mail@jlelse.de>
Date: Wed, 8 Sep 2021 08:18:19 +0200
Subject: [PATCH] Fix post actions

---
 original-assets/styles/styles.scss | 15 +++++++++++----
 templates/assets/css/styles.css    | 15 ++++++++++-----
 templates/postactions.gohtml       |  6 +++---
 3 files changed, 24 insertions(+), 12 deletions(-)

diff --git a/original-assets/styles/styles.scss b/original-assets/styles/styles.scss
index caaf238..3816a4a 100644
--- a/original-assets/styles/styles.scss
+++ b/original-assets/styles/styles.scss
@@ -194,10 +194,6 @@ details summary {
   margin-bottom: 1em;
 }
 
-.flex {
-  display: flex;
-}
-
 .hide {
   display: none;
 }
@@ -242,6 +238,17 @@ details summary {
   height: 400px;
 }
 
+#post-actions {
+  @extend .p;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 5px;
+
+  * {
+    text-align: center;
+  }
+}
+
 // Print
 @media print {
   html {
diff --git a/templates/assets/css/styles.css b/templates/assets/css/styles.css
index dcf6999..b70df93 100644
--- a/templates/assets/css/styles.css
+++ b/templates/assets/css/styles.css
@@ -145,16 +145,12 @@ details summary > *:first-child {
   border-bottom: 1px solid var(--primary, #000);
 }
 
-.p, table {
+.p, #post-actions, table {
   display: block;
   margin-top: 1em;
   margin-bottom: 1em;
 }
 
-.flex {
-  display: flex;
-}
-
 .hide {
   display: none;
 }
@@ -199,6 +195,15 @@ details summary > *:first-child {
   height: 400px;
 }
 
+#post-actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 5px;
+}
+#post-actions * {
+  text-align: center;
+}
+
 @media print {
   html {
     --background: #fff;
diff --git a/templates/postactions.gohtml b/templates/postactions.gohtml
index dba31d8..d624852 100644
--- a/templates/postactions.gohtml
+++ b/templates/postactions.gohtml
@@ -1,7 +1,7 @@
 {{ define "postactions" }}
-<div class="p flex" id="post-actions">
-	<a href="https://www.addtoany.com/share#url={{ absolute .Data.Path }}{{ with .Data.RenderedTitle }}&title={{ . }}{{ end }}" target="_blank" rel="nofollow noopener noreferrer" class="button">{{ string .Blog.Lang "share" }}</a>&nbsp;
-	<a id="translateBtn" href="https://translate.google.com/translate?u={{ absolute .Data.Path }}" target="_blank" rel="nofollow noopener noreferrer" class="button">{{ string .Blog.Lang "translate" }}</a>&nbsp;
+<div id="post-actions">
+	<a href="https://www.addtoany.com/share#url={{ absolute .Data.Path }}{{ with .Data.RenderedTitle }}&title={{ . }}{{ end }}" target="_blank" rel="nofollow noopener noreferrer" class="button">{{ string .Blog.Lang "share" }}</a>
+	<a id="translateBtn" href="https://translate.google.com/translate?u={{ absolute .Data.Path }}" target="_blank" rel="nofollow noopener noreferrer" class="button">{{ string .Blog.Lang "translate" }}</a>
 	<script defer src="{{ asset "js/translate.js" }}"></script>
 	<button id="speakBtn" class="hide" data-speak="{{ string .Blog.Lang "speak" }}" data-stopspeak="{{ string .Blog.Lang "stopspeak" }}"></button>
 	{{ if .Data.TTS }}