From c09d0b4952c351dbd9c71b9fe83c76cfd3c4f9d5 Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Mon, 19 Jun 2023 10:00:18 +0200
Subject: [PATCH] Fix loading state regression in markup content (#25349)

Fix regressions from https://github.com/go-gitea/gitea/pull/25219:

Math before and after:
<img width="630" alt="Screenshot 2023-06-18 at 16 00 52"
src="https://github.com/go-gitea/gitea/assets/115237/f2a01e4b-31ca-407c-8fc3-f0aec569b48e">
<img width="680" alt="Screenshot 2023-06-18 at 16 03 44"
src="https://github.com/go-gitea/gitea/assets/115237/faab8e39-f088-45ab-b460-15fc3654c99d">

Mermain before and after:
<img width="810" alt="Screenshot 2023-06-18 at 15 58 56"
src="https://github.com/go-gitea/gitea/assets/115237/d8c24e81-4702-4e17-b791-7dffe090c068">
<img width="786" alt="Screenshot 2023-06-18 at 15 58 37"
src="https://github.com/go-gitea/gitea/assets/115237/3a268e10-c071-410d-a66e-8c4427d1d61c">
---
 web_src/css/modules/animations.css | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/web_src/css/modules/animations.css b/web_src/css/modules/animations.css
index dcd0e07537..cb7ac59b07 100644
--- a/web_src/css/modules/animations.css
+++ b/web_src/css/modules/animations.css
@@ -18,10 +18,11 @@
   position: absolute;
   display: block;
   height: 4rem;
-  max-height: 50%;
   aspect-ratio: 1 / 1;
   left: 50%;
   top: 50%;
+  max-height: 100%;
+  max-width: 100%;
   transform: translate(-50%, -50%);
   animation: isloadingspin 500ms infinite linear;
   border-width: 4px;
@@ -40,6 +41,15 @@
   height: var(--height-loading);
 }
 
+.markup .is-loading > * {
+  visibility: hidden;
+}
+
+.markup .is-loading {
+  color: transparent;
+  background: transparent;
+}
+
 /* TODO: not needed, use "is-loading small-loading-icon" instead */
 .btn-octicon.is-loading::after {
   border-width: 2px;