diff options
| author | zwlucas <lucas.fariamo08@gmail.com> | 2026-07-25 21:23:29 +0000 |
|---|---|---|
| committer | zwlucas <lucas.fariamo08@gmail.com> | 2026-07-25 21:23:29 +0000 |
| commit | ef55d9bb24430610b60c1b77821307cd72c08c55 (patch) | |
| tree | e6935a810b34370b0a4c821e55f6397aac50c832 /web/src/components/ui | |
| download | helpdesk-master.tar.gz helpdesk-master.zip | |
Signed-off-by: zwlucas <lucas.fariamo08@gmail.com>
Diffstat (limited to 'web/src/components/ui')
| -rw-r--r-- | web/src/components/ui/PageLoader.module.css | 26 | ||||
| -rw-r--r-- | web/src/components/ui/PageLoader.tsx | 28 |
2 files changed, 54 insertions, 0 deletions
diff --git a/web/src/components/ui/PageLoader.module.css b/web/src/components/ui/PageLoader.module.css new file mode 100644 index 0000000..9683313 --- /dev/null +++ b/web/src/components/ui/PageLoader.module.css @@ -0,0 +1,26 @@ +.wrapper { + position: fixed; + inset: 0; + display: flex; + align-items: center; + justify-content: center; + background: var(--color-bg); + z-index: 9999; +} + +.content { + display: flex; + flex-direction: column; + align-items: center; + gap: var(--space-5); +} + +.logo { + display: flex; + align-items: center; + gap: var(--space-3); + font-size: var(--text-lg); + font-weight: 600; + color: var(--color-text-primary); + letter-spacing: -0.02em; +} diff --git a/web/src/components/ui/PageLoader.tsx b/web/src/components/ui/PageLoader.tsx new file mode 100644 index 0000000..dcb34ab --- /dev/null +++ b/web/src/components/ui/PageLoader.tsx @@ -0,0 +1,28 @@ +/** + * PageLoader.tsx + * Tela de carregamento exibida enquanto uma rota lazy é importada. + */ + +import styles from './PageLoader.module.css'; + +export default function PageLoader() { + return ( + <div className={styles.wrapper}> + <div className={styles.content}> + <div className={styles.logo}> + <svg width="32" height="32" viewBox="0 0 32 32" fill="none" aria-hidden="true"> + <rect width="32" height="32" rx="8" fill="var(--color-accent)" fillOpacity="0.15" /> + <path + d="M8 12h16M8 16h10M8 20h12" + stroke="var(--color-accent)" + strokeWidth="2" + strokeLinecap="round" + /> + </svg> + <span>Helpdesk TI</span> + </div> + <div className="spinner" role="status" aria-label="Carregando..." /> + </div> + </div> + ); +} |