From c88e96dc1da709b25f9e5cc933474ff738e81fb8 Mon Sep 17 00:00:00 2001 From: AlbanSdl Date: Mon, 21 Nov 2022 22:34:44 +0100 Subject: [PATCH] feat: update to ua22 * add buckless integration * add network status * update colors --- public/manifest.json | 4 +- public/ua.svg | 356 +++++++++++++++++++++++++++++++------ src/app.scss | 7 +- src/components/navbar.scss | 86 +++++---- src/components/navbar.tsx | 13 +- src/reducers/login.ts | 14 +- src/reducers/server.ts | 22 +++ src/types.ts | 5 + src/utils/socket.ts | 11 +- 9 files changed, 404 insertions(+), 114 deletions(-) diff --git a/public/manifest.json b/public/manifest.json index 080d6c7..990410b 100644 --- a/public/manifest.json +++ b/public/manifest.json @@ -1,6 +1,6 @@ { - "short_name": "React App", - "name": "Create React App Sample", + "short_name": "Turbobouffe", + "name": "Appli de commandes de l'UA", "icons": [ { "src": "favicon.ico", diff --git a/public/ua.svg b/public/ua.svg index 1d42c3e..77fb5ff 100644 --- a/public/ua.svg +++ b/public/ua.svg @@ -1,59 +1,297 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/app.scss b/src/app.scss index 4fe13a2..0a02feb 100644 --- a/src/app.scss +++ b/src/app.scss @@ -19,9 +19,9 @@ body { --primary: #393e46; --primary-light: #4a505b; - --color-accent-dark: #006492; - --color-accent-light: #fbb464; - --color-accent-primary: #f1737f; + --color-accent-dark: #8767aa; + --color-accent-light: #f0dced; + --color-accent-primary: #cbd7ef; --success: #28a745; --warning: #ffc107; @@ -36,3 +36,4 @@ body { width: 0px; /* Remove scrollbar space */ background: transparent; /* Optional: just make scrollbar invisible */ } + diff --git a/src/components/navbar.scss b/src/components/navbar.scss index 9bcec82..2b81904 100644 --- a/src/components/navbar.scss +++ b/src/components/navbar.scss @@ -1,38 +1,48 @@ -.navbar { - height: 50px; - margin: 0; - font-size: 2rem; - display: flex; - align-items: center; - - .back { - padding: 0 30px 0 15px; - height: 50px; - display: flex; - align-items: center; - } - - .title { - padding: 0 30px; - margin: auto; - - .reload-icon { - font-size: 0.8em; - margin-right: 12px; - } - } - - .absolute-left { - position: absolute; - left: 0; - } - - .absolute-right { - position: absolute; - right: 0; - } - - > *:hover { - filter: brightness(0.9); - } -} +.navbar { + height: 50px; + margin: 0; + font-size: 2rem; + display: flex; + align-items: center; + + .back { + padding: 0 30px 0 15px; + gap: 15px; + height: 50px; + display: flex; + align-items: center; + } + + .online { + color: var(--success); + } + + .offline { + color: var(--danger); + } + + .title { + padding: 0 30px; + margin: auto; + + .reload-icon { + font-size: 0.8em; + margin-right: 12px; + } + } + + .absolute-left { + position: absolute; + left: 0; + } + + .absolute-right { + position: absolute; + right: 0; + } + + > *:hover { + filter: brightness(0.9); + } +} + diff --git a/src/components/navbar.tsx b/src/components/navbar.tsx index fce6717..b78652b 100644 --- a/src/components/navbar.tsx +++ b/src/components/navbar.tsx @@ -16,6 +16,7 @@ interface PropTypes { const Navbar = ({ back, onBack, children }: PropTypes) => { const [time, setTime] = useState(moment().format('H[h]mm')); const name = useSelector((state: State) => state.login.name); + const serverOnline = useSelector((state: State) => state.server.internetConnected); useEffect(() => { const interval = setInterval(() => { @@ -37,13 +38,13 @@ const Navbar = ({ back, onBack, children }: PropTypes) => { return (