Add helper components for UI
Changes:
- Extracted Copyright from LoginDialog file to its own
- Added some helper components
- Removed unnecessary setup from welcome animation
- Added custom React type for svg element
- Fixed ThemeDemonstrator
GitLab: #12
Change-Id: Ie7158520983dab5c7069f179b6f9531b5106ba85
diff --git a/client/src/themes/Default.ts b/client/src/themes/Default.ts
index 3ba20ab..c0f5884 100644
--- a/client/src/themes/Default.ts
+++ b/client/src/themes/Default.ts
@@ -15,7 +15,23 @@
* License along with this program. If not, see
* <https://www.gnu.org/licenses/>.
*/
-import { createTheme } from '@mui/material';
+import { createTheme, SimplePaletteColorOptions } from '@mui/material';
+
+declare module '@mui/material/styles' {
+ interface Theme {
+ InfoTooltip: {
+ backgroundColor: SimplePaletteColorOptions;
+ color: SimplePaletteColorOptions;
+ };
+ }
+
+ interface ThemeOptions {
+ InfoTooltip: {
+ backgroundColor: SimplePaletteColorOptions;
+ color: SimplePaletteColorOptions;
+ };
+ }
+}
const theme = createTheme({
palette: {
@@ -31,6 +47,14 @@
main: '#009980',
},
},
+ InfoTooltip: {
+ backgroundColor: {
+ main: '#FFFFFF',
+ },
+ color: {
+ main: '#292929',
+ },
+ },
typography: {
fontFamily: 'Ubuntu',
allVariants: {
diff --git a/client/src/themes/ThemeDemonstrator.tsx b/client/src/themes/ThemeDemonstrator.tsx
index 8b3ceb1..dd82953 100644
--- a/client/src/themes/ThemeDemonstrator.tsx
+++ b/client/src/themes/ThemeDemonstrator.tsx
@@ -59,7 +59,7 @@
<TakePictureButton />
</Stack>
<Stack direction="row" spacing="5px">
- <InfoButton />
+ <InfoButton tooltipTitle={''} />
<TipButton />
</Stack>
<Stack direction="row" spacing="5px">
@@ -70,10 +70,10 @@
<Switch />
</Stack>
<Stack padding="5px" width="300px">
- <UsernameInput />
- <UsernameInput error defaultValue="Cyrille" />
- <PasswordInput />
- <PasswordInput error defaultValue="SavoirFaireLinux" />
+ <UsernameInput onChange={() => {}} tooltipTitle={'Test'} />
+ <UsernameInput onChange={() => {}} tooltipTitle={'Test'} error defaultValue="Cyrille" />
+ <PasswordInput onChange={() => {}} tooltipTitle={'Test'} />
+ <PasswordInput onChange={() => {}} tooltipTitle={'Test'} error defaultValue="SavoirFaireLinux" />
<NickNameInput />
<RegularInput />
</Stack>