damus.io

commit 081a85de485128ef5de012e7b115be147eddd434
parent fa9965b2a02775256eb6292f8b64fe8e1f806370
Author: Thomas Mathews <thomas.c.mathews@gmail.com>
Date:   Fri, 18 Nov 2022 19:22:17 -0800

web: Added new loader graphic.

Diffstat:
M
web/css/styles.css
 | 
18
++++++++++++++++++
A
web/icon/loader-fragment.svg
 | 
2
++
A
web/icon/open-thread.svg
 | 
2
++
M
web/js/ui/render.js
 | 
10
++++------

4 files changed, 26 insertions(+), 6 deletions(-)
diff --git a/web/css/styles.css b/web/css/styles.css
@@ -153,6 +153,24 @@ button.nav > img.icon {
 	text-align: center;
 	padding: 15px;
 }
+.loader {
+	width: 28px;
+	height: 28px;
+	display: block;
+	margin: 0 auto;
+	position: relative;
+}
+.loader img {
+	display: block;
+	width: 100%;
+	height: 100%;
+	animation: spin 1s linear infinite;
+}
+@keyframes spin { 
+    100% { 
+        transform: rotate(360deg); 
+    } 
+}
 .userpic { /* TODO remove .userpic and use helper class */
 	flex-shrink: 1;
 }
diff --git a/web/icon/loader-fragment.svg b/web/icon/loader-fragment.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M264 24C264 10.75 274.7 0 288 0C429.4 0 544 114.6 544 256C544 302.6 531.5 346.4 509.7 384C503.1 395.5 488.4 399.4 476.9 392.8C465.5 386.2 461.5 371.5 468.2 360C485.9 329.4 496 293.9 496 255.1C496 141.1 402.9 47.1 288 47.1C274.7 47.1 264 37.25 264 23.1V24z"/></svg>+
\ No newline at end of file
diff --git a/web/icon/open-thread.svg b/web/icon/open-thread.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M392 320c-13.25 0-24 10.75-24 24v112c0 4.406-3.594 8-8 8h-304c-4.406 0-8-3.594-8-8v-304c0-4.406 3.594-8 8-8h112C181.3 144 192 133.3 192 120S181.3 96 168 96h-112C25.13 96 0 121.1 0 152v304C0 486.9 25.13 512 56 512h304c30.88 0 56-25.12 56-56v-112C416 330.8 405.3 320 392 320zM488 0H320c-13.25 0-24 10.75-24 24S306.8 48 320 48h110.1L183 295c-9.375 9.375-9.375 24.56 0 33.94C187.7 333.7 193.8 336 200 336s12.28-2.344 16.97-7.031L464 81.94V192c0 13.25 10.75 24 24 24S512 205.3 512 192V24C512 10.75 501.3 0 488 0z"/></svg>+
\ No newline at end of file
diff --git a/web/js/ui/render.js b/web/js/ui/render.js
@@ -342,10 +342,8 @@ function render_loading_spinner()
 {
 	return `
 	<div class="loading-events">
-		<span class="loader" title="Loading...">
-			<i class="fa-solid fa-fw fa-spin fa-hurricane"
-			style="--fa-animation-duration: 0.5s;"></i>
-		</span>
-	</div>
-	`
+		<div class="loader" title="Loading...">
+			<img src="icon/loader-fragment.svg"/>
+		</div>
+	</div>`
 }