Many small changes. Back to blue.

GEO-BON · Jan 8, 2025 · 9b295fe · 9b295fe
1 parent 577a8e0
commit 9b295fe
Show file tree

Hide file tree

Showing 8 changed files with 41 additions and 13 deletions.
diff --git a/ui/index.html b/ui/index.html
@@ -14,7 +14,7 @@
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link
       rel="stylesheet"
-      href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700&display=swap"
+      href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&family=Lato:wght@300;400;500;600;700&display=swap"
     />
     <link rel="apple-touch-icon" href="/favicon.ico" />
     <!--

diff --git a/ui/src/Layout.css b/ui/src/Layout.css
@@ -1,10 +1,13 @@
 nav {
   padding-top: 1em;
   padding-bottom: 1em;
+  font-family: Lato, sans-serif;
+  font-weight: 500;
+  font-size: 1.1em;
 }
 
 a {
-  color: var(--biab-yellow-light);
+  color: var(--biab-blue-light);
 }
 a.active {
   color: white;
@@ -81,6 +84,15 @@ h2 {
   overflow-y: auto;
 }
 
+.fullScreenPopup a{
+    color: var(--biab-green-main);
+
+}
+
+.fullScreenPopup h2{
+    color: var(--biab-green-main);
+}
+
 img#logo {
   max-width: 10vw;
   padding: 5px 10px;

diff --git a/ui/src/components/RunHistory.jsx b/ui/src/components/RunHistory.jsx
@@ -47,7 +47,7 @@ export default function RunHistory() {
 
   return (
     <p style={{ whiteSpace: "pre-wrap" }}>
-      {runHistory ? runHistory : <Spinner />}
+      {runHistory ? runHistory : <Spinner variant='light'/>}
     </p>
   );
 }

diff --git a/ui/src/components/Spinner.jsx b/ui/src/components/Spinner.jsx
@@ -1,9 +1,16 @@
 import spinnerImg from "../img/spinner.svg";
+import spinnerImgLight from "../img/spinner_light.svg";
 
-export function Spinner(){
+export function Spinner({variant}){
+    if (variant=='light'){
+        return <img src={spinnerImgLight} className="spinner" alt="Spinner" />
+    }
     return <img src={spinnerImg} className="spinner" alt="Spinner" />
 }
 
-export function InlineSpinner(){
+export function InlineSpinner({variant}){
+    if (variant=='light'){
+        return <img src={spinnerImgLight} className="spinner-inline" alt="Spinner" />
+    }
     return <img src={spinnerImg} className="spinner-inline" alt="Spinner" />
 }
diff --git a/ui/src/components/Versions.jsx b/ui/src/components/Versions.jsx
@@ -16,7 +16,7 @@ export default function Versions() {
 
   return (
     <p style={{ whiteSpace: "pre-wrap" }}>
-      {versions ? versions : <Spinner />}
+      {versions ? versions : <Spinner variant='light' />}
     </p>
   );
 }
diff --git a/ui/src/components/form/ScriptInput.jsx b/ui/src/components/form/ScriptInput.jsx
@@ -58,7 +58,7 @@ export default function ScriptInput({
               sx={{
                 fontSize: "1em",
                 fontFamily: "Roboto",
-                width: 328,
+                width: size=='small'?220:328,
                 "& .MuiOutlinedInput-notchedOutline": {
                   borderColor: "var(--biab-green-trans-main)",
                 },
@@ -75,7 +75,7 @@ export default function ScriptInput({
             "&. MuiInputLabel-formControl": {
               color: "var(---biab-green-trans-main)",
             },
-          }}
+              }}
           disabled={passedProps.disabled}
           value={fieldValue}
           onChange={(event, newValue) => {
@@ -109,11 +109,11 @@ export default function ScriptInput({
         value={joinIfArray(fieldValue)}
         onChange={(e) => setFieldValue(e.target.value)}
         placeholder={ARRAY_PLACEHOLDER}
-        keepWidth={true}
         cols={cols}
         onBlur={onUpdateArray}
         slotProps={{ htmlInput: { style: { resize: "vertical" } } }}
         onKeyDown={(e) => e.ctrlKey && onUpdateArray(e)}
+        sx={{width: size=='small'?220:328}}
       />
     );
   }
@@ -155,6 +155,7 @@ export default function ScriptInput({
             onValueUpdated(parseInt(e.target.value));
           }}
           placeholder={CONSTANT_PLACEHOLDER}
+          sx={{width: size=='small'?220:328}}
         />
       );
 
@@ -176,6 +177,7 @@ export default function ScriptInput({
             passedProps.className ? passedProps.className : ""
           }`}
           placeholder={CONSTANT_PLACEHOLDER}
+          sx={{width: size=='small'?220:328}}
         />
       );
 
@@ -207,6 +209,7 @@ export default function ScriptInput({
             onKeyDown={(e) => {
               if (e.key === "Enter" || e.ctrlKey) updateValue(e);
             }}
+            sx={{width: size=='small'?220:328}}
           />
         );
       }

diff --git a/ui/src/img/spinner_light.svg b/ui/src/img/spinner_light.svg
diff --git a/ui/src/index.css b/ui/src/index.css
@@ -1,8 +1,6 @@
 body {
   margin: 0;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Montserrat",
-    "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
-    sans-serif;
+  font-family: "Montserrat", sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
@@ -17,7 +15,7 @@ code {
   --biab-green-trans-main: #1d736888;
   --biab-purple-main: #3d1b40;
   --biab-blue-main: #28457a;
-  --biab-blue-light: #647ca8;
+  --biab-blue-light: #76d2ff;
   --biab-orange-main: #b7672e;
   --biab-yellow-main: #b7872e;
   --biab-yellow-light: #fdd58c;