From 718744a92d8d85d7237444d0e4a8dc3a822fe84a Mon Sep 17 00:00:00 2001
From: Mouse Reeve <mousereeve@riseup.net>
Date: Fri, 10 Sep 2021 08:30:28 -0700
Subject: [PATCH] Adds css animation for pending create status

Co-authored-by: Fabien Basmaison <contact@arkhi.org>
---
 bookwyrm/static/css/bookwyrm.css              | 26 +++++++++++++++++++
 .../create_status/post_options_block.html     |  5 +++-
 2 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/bookwyrm/static/css/bookwyrm.css b/bookwyrm/static/css/bookwyrm.css
index 3529afc2..62191e5c 100644
--- a/bookwyrm/static/css/bookwyrm.css
+++ b/bookwyrm/static/css/bookwyrm.css
@@ -302,6 +302,32 @@ body {
     right: 0;
 }
 
+/** Animations and transitions
+ ******************************************************************************/
+
+@keyframes turning {
+    from { transform: rotateZ(0deg); }
+    to { transform: rotateZ(360deg); }
+}
+
+.is-processing .icon-spinner::before {
+    animation: turning 1.5s infinite linear;
+}
+
+.icon-spinner {
+    display: none;
+}
+
+.is-processing .icon-spinner {
+    display: flex;
+}
+
+@media (prefers-reduced-motion: reduce) {
+    .is-processing .icon::before {
+        transition-duration: 0.001ms !important;
+    }
+}
+
 /* States
  ******************************************************************************/
 
diff --git a/bookwyrm/templates/snippets/create_status/post_options_block.html b/bookwyrm/templates/snippets/create_status/post_options_block.html
index 6cfb0c5c..697614e1 100644
--- a/bookwyrm/templates/snippets/create_status/post_options_block.html
+++ b/bookwyrm/templates/snippets/create_status/post_options_block.html
@@ -16,7 +16,10 @@
         </div>
     </div>
     <div class="column is-narrow">
-        <button class="button is-link" type="submit">{% trans "Post" %}</button>
+        <button class="button is-link" type="submit">
+            <span class="icon icon-spinner" aria-hidden="true"></span>
+            <span>{% trans "Post" %}</span>
+        </button>
     </div>
 </div>