Merge pull request #557 from lwnoble/main

Themes implements and code clean up
finos · Sep 18, 2023 · 6a62d42 · 6a62d42
2 parents 407a824 + 1569b1e
commit 6a62d42
Show file tree

Hide file tree

Showing 302 changed files with 6,764 additions and 6,830 deletions.
diff --git a/code/src/ui/src/App.css b/code/src/ui/src/App.css
@@ -10,10 +10,11 @@
 
 body {
     color: var(--on-background);
-    font-family: var(--bodyFamily);
-    font-weight: var(--fontWeight-2);
-    font-size: calc(var(--zoom) * var(--baseFont));
-    line-height: calc(var(--zoom) * var(--standard-LineHeight));
+    font-family: var(--body1FontFamily);
+    font-weight: var(--body1FontWeight);
+    font-size: calc(var(--zoom) * var(--body1FontSize));
+    line-height: calc(var(--zoom) * var(--body1LineHeight));
+    letter-spacing: var(--body1LetterSpacing)
 }
 
 p {

diff --git a/code/src/ui/src/App.tsx b/code/src/ui/src/App.tsx
@@ -41,6 +41,7 @@ interface Props {
     user: any;
 }
 
+
 const App: React.FC<Props> = ({user}) => {
 
     const [themeName, setThemeName] = useState<string>("light");
@@ -85,7 +86,7 @@ const App: React.FC<Props> = ({user}) => {
             { /* </ThemeProvider> */ }
         </BrowserRouter>
     );
-    
+
 }
 
 export default App;
diff --git a/code/src/ui/src/components/ColorShade.css b/code/src/ui/src/components/ColorShade.css
@@ -27,15 +27,6 @@ li .Hex {
     margin: 8px auto !important;
 }
 
-
-.caption {
-    font-family: var(--primaryFont);
-    font-weight: var(--fontWeight-3);
-    font-size: calc(var(--baseFont) * .75);
-    line-height: var(--standard-LineHeight);
-    letter-spacing: 0.5%;
-}
-
 .text-center {
     text-align: center!important;
 }

diff --git a/code/src/ui/src/components/DesignSystemTitleBar.css b/code/src/ui/src/components/DesignSystemTitleBar.css
@@ -1,31 +1,20 @@
 .titleBarDiv {
     width: 100%;
-    background: var(--primary);
-    color: var(--on-primary);
     display: flex;
     align-items: center;
     justify-content: space-between;
+    background: var(--background);
+    color: var(--on-background);
 }
 
 .titleBarDiv .MuiSelect-select {
     margin: auto;
     padding-left: 20px;
     padding-right: 20px;
-    color: var(--on-surface);
 }
 
-.titleBarDiv .MuiSelect-icon {
-    fill: var(--on-surface);
-}
-
-.titleBarDiv .MuiOutlinedInput-notchedOutline {
-    border: 1px solid var(--on-primary);
-    opacity: 0.5;
-    background: var(--surface);
-    border-radius: var(--spacing-half);
-    padding: 0 var(--spacing-1);
-    font-size: var(--body1FontSize);
-    font-weight: var(--body1FontWeight);
+.MuiSelect-select span {
+  padding-right: var(--min-target)
 }
 
 .titleBarDiv .left-titlebar {
@@ -63,7 +52,7 @@
 .titleBarDiv .label {
     padding-right: 30px;
     font-size: var(--label-smallFontSize);
-    font-family: var(--bodyFamily);
+    font-family: var(--label-smallFontFamily);
     font-weight: var(--label-smallFontWeight);
     line-height: var(--label-smallLineHeight);
     letter-spacing: var(--label-smallCharcterSpacing);

diff --git a/code/src/ui/src/components/DesignSystemTitleBar.tsx b/code/src/ui/src/components/DesignSystemTitleBar.tsx
diff --git a/code/src/ui/src/components/DisplayColorPalette.tsx b/code/src/ui/src/components/DisplayColorPalette.tsx
@@ -69,12 +69,12 @@ export const DisplayColorPalette: React.FC<Props> = ({ colorPalette, colors, lig
                 </DarkModeSection>
             </div>
         )
-    } 
+    }
     else {
         return (
             <div className="row">
                 Add a color in the Settings section to add colors to palette.
             </div>
         )
     }
-}
+}
diff --git a/code/src/ui/src/components/WelcomeNavbar.tsx b/code/src/ui/src/components/WelcomeNavbar.tsx
diff --git a/code/src/ui/src/components/modals/Modals.css b/code/src/ui/src/components/modals/Modals.css
@@ -61,23 +61,3 @@
     margin-right: auto;
     display: block;
 }
-
-/*
-.modal-footer button {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background: var(--on-button);
-    color: var(--on-background);
-    border-radius: var(--button-radius);
-    text-align: center;
-    padding: var(--spacing-1) var(--button-padding);
-    border: none;
-    position: relative;
-    align-self: start;
-    font: var(--button-font);
-    letter-spacing: var(--button-character-spacing);
-    text-transform: var(--button-transform) !important;
-    cursor: pointer;
-}
-*/