- Minor fixes for themes. (#187)

- Changed variant of navigation button in DirectoryObject. - Removed index.css and reverted to old implementation Co-authored-by: Christoph Anderson <[email protected]>
kopia · Sep 12, 2023 · 717daf7 · 717daf7
1 parent d78d5eb
commit 717daf7
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 10 deletions.
diff --git a/public/index.css b/public/index.css
diff --git a/public/index.html b/public/index.html
@@ -3,7 +3,6 @@
 
 <head>
   <meta charset="utf-8" />
-  <link rel="stylesheet" href="index.css">
   <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="description" content="Kopia UI" />
@@ -16,7 +15,7 @@
 <body>
   <noscript>You need to enable JavaScript to run this app.</noscript>
   <div id="root"></div>
-  <div id="appVersion">
+  <div id="appVersion" style="display: none">
     <hr />
     <p class="version-info">Version %REACT_APP_FULL_VERSION_INFO%</p>
   </div>

diff --git a/src/DirectoryObject.jsx b/src/DirectoryObject.jsx
@@ -123,10 +123,10 @@ export class DirectoryObject extends Component {
             <Row>
                 <Col xs="auto">
                     {this.state.mountInfo.path ? <>
-                        <Button size="sm" variant="info" onClick={this.unmount}>Unmount</Button>
+                        <Button size="sm" variant="secondary" onClick={this.unmount}>Unmount</Button>
                         {window.kopiaUI && <>
                             &nbsp;
-                            <Button size="sm" variant="info" onClick={this.browseMounted}>Browse</Button>
+                            <Button size="sm" variant="secondary" onClick={this.browseMounted}>Browse</Button>
                         </>}
                         &nbsp;<input id="mountedPath" value={this.state.mountInfo.path} />
                         <Button size="sm" variant="primary" onClick={this.copyPath}><FontAwesomeIcon
@@ -135,7 +135,7 @@ export class DirectoryObject extends Component {
                         <Button size="sm" variant="primary" onClick={this.mount}>Mount as Local Filesystem</Button>
                     </>}
                     &nbsp;
-                    <Button size="sm" variant="info"
+                    <Button size="sm" variant="secondary"
                             href={"/snapshots/dir/" + this.props.match.params.oid + "/restore"}>Restore
                         Files & Directories</Button>
                     &nbsp;

diff --git a/src/css/App.css b/src/css/App.css
@@ -96,6 +96,15 @@ body {
   filter: brightness(80%);
 }
 
+a {
+  color: var(--color-link);
+}
+
+a:hover {
+  color: var(--color-link);
+  filter: brightness(80%);
+}
+
 .table-striped>tbody>tr:nth-of-type(odd)>* {
   color: var(--text-color-body);
   background-color: var(--color-stripe);

diff --git a/src/css/Theme.css b/src/css/Theme.css
@@ -7,6 +7,7 @@
   --color-success: #5ea5cd;
   --color-submit: #00B4D8;
   --color-select: #f2f9ff;
+  --color-link: #2A7FFF;
 
   --text-color: #ffffff;
   --text-color-body: #000000;
@@ -25,6 +26,7 @@
   --color-submit: #00B4D8;
   --color-stripe: #323232;
   --color-select: #323232;
+  --color-link: #6a8ec6;
 
   --text-color: #cfcfcf;
   --text-color-body: #cfcfcf;
@@ -43,6 +45,7 @@
   --color-success: #bdb2ff;
   --color-submit: #a0c4ff;
   --color-select: #f2f9ff;
+  --color-link: #2A7FFF;
 
   --text-color: #000000;
   --text-color-body: #000000;
@@ -56,10 +59,11 @@
   --background-color: #ffffff;
   --color-primary: #03045E;
   --color-secondary: #0077B6;
-  --color-warning: #ecd131;
+  --color-warning: #e8cc2a;
   --color-success: #0077B6;
   --color-submit: #00B4D8;
   --color-select: #f2f9ff;
+  --color-link: #03045E;
 
   --text-color: #ffffff;
   --text-color-body: #03045E;