From c412fd4a9c5d2964f10522c238eead601188fcaa Mon Sep 17 00:00:00 2001 From: Emil Ernerfeldt Date: Tue, 28 Dec 2021 14:13:51 +0100 Subject: [PATCH] Add loading animation while waiting for wasm to load Closes https://github.com/emilk/egui/issues/1009 --- docs/index.html | 57 ++++++++++++++++++++++++++++++++++++++++++++++--- 1 file changed, 54 insertions(+), 3 deletions(-) diff --git a/docs/index.html b/docs/index.html index 9cfcb27a..47975923 100644 --- a/docs/index.html +++ b/docs/index.html @@ -45,12 +45,59 @@ left: 50%; transform: translate(-50%, 0%); } + + .loading { + margin-right: auto; + margin-left: auto; + display: block; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + color: white; + font-size: 24px; + font-family: Ubuntu-Light, Helvetica, sans-serif; + } + + /* ---------------------------------------------- */ + /* Loading animation from https://loading.io/css/ */ + .lds-dual-ring { + display: inline-block; + width: 24px; + height: 24px; + } + + .lds-dual-ring:after { + content: " "; + display: block; + width: 24px; + height: 24px; + margin: 0px; + border-radius: 50%; + border: 3px solid #fff; + border-color: #fff transparent #fff transparent; + animation: lds-dual-ring 1.2s linear infinite; + } + + @keyframes lds-dual-ring { + 0% { + transform: rotate(0deg); + } + + 100% { + transform: rotate(360deg); + } + } - + +
+ Loading…   +
+