CSS navbar and color tweaks (#13609)

* CSS and color tweaks

- Unify navbar-style menus
- Fix admin bar overlapping menu bar
- Fixes file edit comment box
- Fix double border on review box
- Fix review timeline icons

* Many fixes to new-menu and navbar layout enhancements

* misc settings fixes

* navbar tweak

* fix pr tabs

* branch tag and arc color tweaks

1 files changed, 7 insertions, 75 deletions

diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less
index 8c36944ec9..eebbb5bdb3 100644
--- a/web_src/less/themes/theme-arc-green.less
+++ b/web_src/less/themes/theme-arc-green.less
@@ -72,13 +72,14 @@
   --color-body: #383c4a;
   --color-box-header: #454a57;
   --color-box-body: #353945;
-  --color-text: #b6bac5;
+  --color-text: #bbc0ca;
   --color-text-light: #969aa5;
   --color-timeline: #4a505c;
-  --color-input-text: #dcdcdc;
+  --color-input-text: #d5dbe6;
   --color-input-background: #2e323e;
   --color-input-border: #454a57;
   --color-input-border-hover: #505667;
+  --color-navbar: #2a2e3a;
 }
 
 /* Background */
@@ -566,7 +567,7 @@ body {
 
 .following.bar.light {
   background: #2e323e;
-  border-bottom: 1px solid #313131;
+  border-color: var(--color-secondary-alpha-40);
 }
 
 .ui.secondary.menu .active.item {
@@ -721,10 +722,6 @@ a.ui.basic.green.label:hover {
   background-color: #87ab63;
 }
 
-.repository .header-wrapper {
-  background-color: #2a2e3a;
-}
-
 .ui.header,
 .ui.breadcrumb .divider {
   color: var(--color-secondary-dark-6);
@@ -884,35 +881,6 @@ a.ui.basic.green.label:hover {
   border-bottom: 1px solid #304251;
 }
 
-.ui.tabular.menu {
-  border-bottom-color: var(--color-secondary);
-
-  .item.active {
-    border-top-color: var(--color-secondary);
-    border-left-color: var(--color-secondary);
-    border-right-color: var(--color-secondary);
-    background: #383c4a;
-    color: #dbdbdb;
-  }
-
-  .item {
-    color: var(--color-secondary-dark-6);
-  }
-
-  .item:hover {
-    color: #dbdbdb;
-  }
-
-  &.navbar {
-    .item.active {
-      border-top-color: transparent;
-      border-left-color: transparent;
-      border-right-color: transparent;
-      background: #383c4a;
-    }
-  }
-}
-
 .markdown:not(code) .highlight pre,
 .markdown:not(code) pre {
   background-color: #2a2e3a;
@@ -1022,8 +990,9 @@ a.ui.basic.green.label:hover {
   color: #dedede;
 }
 
-.repository .comment.form .ui.tabular.menu .item.active {
-  background: #353945;
+.repository .navbar .active.item,
+.repository .navbar .active.item:hover {
+  border-color: transparent !important;
 }
 
 .ui.basic.green.active.button,
@@ -1156,43 +1125,6 @@ td.blob-hunk {
   background: #353945;
 }
 
-.ui.secondary.pointing.menu {
-  border-bottom-color: rgba(255, 255, 255, .15);
-}
-
-.ui.secondary.pointing.menu .active.item {
-  color: #dbdbdb;
-}
-
-.ui.secondary.pointing.menu .active.item:hover {
-  color: #dbdbdb;
-}
-
-.ui.secondary.pointing.menu .dropdown.item:hover,
-.ui.secondary.pointing.menu .link.item:hover,
-.ui.secondary.pointing.menu a.item:hover {
-  color: #dbdbdb;
-}
-
-.ui.pointing.dropdown > .menu:not(.hidden)::after {
-  background: #2c303a;
-}
-
-.explore .navbar {
-  background-color: #2a2e3a !important;
-}
-
-.ui.menu.new-menu {
-  background: #2a2e3a;
-  border-color: transparent !important;
-
-  @media @mediaLgAndDown {
-    &::after {
-      background: linear-gradient(to right, transparent 0%, #2a2e3a 100%);
-    }
-  }
-}
-
 .ui.attached.info.message,
 .ui.info.message {
   box-shadow: 0 0 0 1px #4b5e71 inset, 0 0 0 0 transparent;