UIKernel/Core
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity

Change default spinning loader to block, with an option for inline layout.

Browse source
This commit is contained in:
Madeorsk 2024-07-13 21:31:29 +02:00
parent 9650f67139
commit eee7998581
Signed by: Madeorsk
SSH key fingerprint: SHA256:J9G0ofIOLKf7kyS2IfrMqtMaPdfsk1W02+oGueZzDDU
2 changed files with 11 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/Components/Loaders/SpinningLoader.tsx
View file

@ -1,8 +1,9 @@
import React from "react"; import React from "react";
import {classes} from "../../Utils";
export function SpinningLoader() export function SpinningLoader({ inline }: { inline?: boolean; })
{ {
return ( return (
<div className={"spinning loader"}></div> <div className={classes("spinning loader", inline ? "inline" : undefined)}></div>
); );
} }

10
src/styles/components/loaders/_spinning.less
View file

@ -1,8 +1,8 @@
.spinning.loader .spinning.loader
{ {
position: relative; position: relative;
display: inline-block; display: block;
margin: 1em; margin: 1em auto;
width: 2.5em; width: 2.5em;
height: 2.5em; height: 2.5em;
border-radius: 50%; border-radius: 50%;
@ -26,6 +26,12 @@
border: 0.3em solid transparent; border: 0.3em solid transparent;
border-bottom-color: var(--primary); border-bottom-color: var(--primary);
} }
&.inline
{
display: inline-block;
margin: 1em;
}
} }
@keyframes spinning-loader-rotation @keyframes spinning-loader-rotation