diff --git a/app/front-end/index.html b/app/front-end/index.html
index 425a916..d0fc71b 100644
--- a/app/front-end/index.html
+++ b/app/front-end/index.html
@@ -10,7 +10,7 @@
font-family: 'Nunito', sans-serif;
}
-
+
\ No newline at end of file
diff --git a/app/front-end/public/Kath_OnlyLogo.svg b/app/front-end/public/Kath_OnlyLogo.svg
deleted file mode 100644
index e499051..0000000
--- a/app/front-end/public/Kath_OnlyLogo.svg
+++ /dev/null
@@ -1,20 +0,0 @@
-
-
\ No newline at end of file
diff --git a/app/front-end/src/components/buttons/IconTitleButton.tsx b/app/front-end/src/components/buttons/IconTitleButton.tsx
index e02d80b..4f9d877 100644
--- a/app/front-end/src/components/buttons/IconTitleButton.tsx
+++ b/app/front-end/src/components/buttons/IconTitleButton.tsx
@@ -42,7 +42,7 @@ export const IconTitleButton: React.FC = ({ icon, title, width, height, b
transition: 'background-color 0.5s ease',
':hover': {
backgroundColor: alpha(Theme.palette.primary.contrastText, 0.2),
- }, // TODO: fix this to be responsive to theme
+ },
}}
onClick={onClick}
>
diff --git a/app/front-end/src/features/editor/components/fileTreeView/fileTreeItem/fileTreeItem.tsx b/app/front-end/src/features/editor/components/fileTreeView/fileTreeItem/fileTreeItem.tsx
index 5b886b0..78fb186 100644
--- a/app/front-end/src/features/editor/components/fileTreeView/fileTreeItem/fileTreeItem.tsx
+++ b/app/front-end/src/features/editor/components/fileTreeView/fileTreeItem/fileTreeItem.tsx
@@ -16,7 +16,8 @@ import React from 'react';
import { FileTreeItemLabel } from '.';
const StyledFileTreeItemRoot = styled(TreeItem2Root)(({ theme }) => ({
- color: theme.palette.mode === 'light' ? theme.palette.grey[800] : theme.palette.grey[400],
+ //color: theme.palette.mode === 'light' ? theme.palette.grey[800] : theme.palette.grey[400],
+ color: theme.palette.text.secondary,
position: 'relative',
[`& .${treeItemClasses.groupTransition}`]: {
marginLeft: theme.spacing(3.5),
@@ -33,7 +34,7 @@ const StyledFileTreeItemContent = styled(TreeItem2Content)(({ theme }) => ({
fontWeight: 500,
['&.Mui-expanded ']: {
'&:not(.Mui-focused, .Mui-selected, .Mui-selected.Mui-focused) .labelIcon': {
- color: theme.palette.mode === 'light' ? theme.palette.primary.main : theme.palette.primary.main,
+ color: theme.palette.primary.main,
},
'&::before': {
content: '""',
@@ -43,15 +44,16 @@ const StyledFileTreeItemContent = styled(TreeItem2Content)(({ theme }) => ({
top: '44px',
height: 'calc(100% - 48px)',
width: '1.5px',
- backgroundColor: theme.palette.mode === 'light' ? theme.palette.grey[300] : theme.palette.grey[700],
+ backgroundColor: theme.palette.secondary.main,
},
},
'&:hover': {
backgroundColor: alpha(theme.palette.primary.main, 0.1),
- color: theme.palette.mode === 'light' ? theme.palette.primary.main : 'white',
+ color: theme.palette.primary.main,
},
['&.Mui-focused, &.Mui-selected, &.Mui-selected.Mui-focused']: {
- backgroundColor: theme.palette.mode === 'light' ? theme.palette.primary.main : theme.palette.primary.dark,
+ backgroundColor:
+ theme.palette.mode === 'light' ? alpha(theme.palette.primary.main, 0.7) : alpha(theme.palette.primary.main, 0.5),
color: theme.palette.primary.contrastText,
},
}));
diff --git a/app/front-end/src/stores/themeContextProvider.tsx b/app/front-end/src/stores/themeContextProvider.tsx
index 36f9cf0..b03af1c 100644
--- a/app/front-end/src/stores/themeContextProvider.tsx
+++ b/app/front-end/src/stores/themeContextProvider.tsx
@@ -62,7 +62,7 @@ export const ThemeContextProvider: React.FC = ({ children }) => {
mode: mode as PaletteMode,
primary: {
main: mode === 'light' ? Colors.primaryLight : Colors.primaryDark,
- contrastText: Colors.contrastTextLight,
+ contrastText: mode === 'light' ? Colors.contrastTextLight : Colors.contrastTextDark,
},
secondary: {
main: mode === 'light' ? Colors.secondaryLight : Colors.secondaryDark,
diff --git a/app/front-end/src/types/enums/colors.ts b/app/front-end/src/types/enums/colors.ts
index 176a7b7..18e8d87 100644
--- a/app/front-end/src/types/enums/colors.ts
+++ b/app/front-end/src/types/enums/colors.ts
@@ -71,16 +71,18 @@
export enum Colors {
// Light mode
mainNavigationBackgroundLight = '#4C7380',
- primaryLight = '#4C7380',
+ primaryLight = '#336e82',
secondaryLight = '#D8E4E8',
textPrimaryLight = '#404040',
- textSecondaryLight = '#999999',
+ textSecondaryLight = '#525252',
backgroundPrimaryLight = '#F9FBFB',
backgroundSecondaryLight = '#EDEDED',
backgroundActiveLight = '#CDCDCD',
+ contrastTextLight = '#F9FBFB',
+
// Dark mode
mainNavigationBackgroundDark = '#1C2427',
primaryDark = '#6AA1AD',
@@ -91,10 +93,11 @@ export enum Colors {
backgroundPrimaryDark = '#292929',
backgroundSecondaryDark = '#252525',
- backgroundActiveDark = '#313131',
+ backgroundActiveDark = '#333333',
+
+ contrastTextDark = '#F9FBFB',
// Global
- contrastTextLight = '#F9FBFB',
error = '#FF6961',
success = '#77DD77',
warning = '#FFB347',