From 0ae35c66f2efe608e3176f796866c18461f0780f Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Fri, 13 Nov 2020 02:31:25 +0100
Subject: [PATCH] Various style fixes (#13534)

* Various style fixes

- Fix the rest of the monochrome borders for arc-green
- Fix close icon position on system notice modal and padding
- Fix selectable table color for arc-green

* proper fix for close icon

Co-authored-by: Lauris BH <lauris@nix.lv>
---
 templates/admin/notice.tmpl              |  2 +-
 web_src/less/_admin.less                 |  4 ++-
 web_src/less/_base.less                  | 23 +++++++++++++
 web_src/less/_explore.less               | 12 ++-----
 web_src/less/_repository.less            | 12 +++----
 web_src/less/_user.less                  |  2 +-
 web_src/less/themes/theme-arc-green.less | 41 ++----------------------
 7 files changed, 38 insertions(+), 58 deletions(-)

diff --git a/templates/admin/notice.tmpl b/templates/admin/notice.tmpl
index 5311ad8f79c..d1d264c8c87 100644
--- a/templates/admin/notice.tmpl
+++ b/templates/admin/notice.tmpl
@@ -74,7 +74,7 @@
 </div>
 
 <div class="ui modal admin" id="detail-modal">
-	<i class="close icon"></i>
+	<i class="close icon inside"></i>
 	<div class="header">{{$.i18n.Tr "admin.notices.view_detail_header"}}</div>
 	<div class="content">
 		<div class="sub header"></div>
diff --git a/web_src/less/_admin.less b/web_src/less/_admin.less
index 337fcad66b8..1a6180d2276 100644
--- a/web_src/less/_admin.less
+++ b/web_src/less/_admin.less
@@ -1,5 +1,7 @@
 .admin {
-  padding-top: 15px;
+  &.notice {
+    padding-top: 15px;
+  }
 
   .table.segment {
     padding: 0;
diff --git a/web_src/less/_base.less b/web_src/less/_base.less
index 7f5623bdc94..63c99324fd2 100644
--- a/web_src/less/_base.less
+++ b/web_src/less/_base.less
@@ -205,6 +205,29 @@ a:hover,
   border-color: var(--color-secondary);
 }
 
+.ui.table {
+  color: var(--color-text);
+}
+
+.ui.ui.selectable.table > tbody > tr:hover,
+.ui.table tbody tr td.selectable:hover {
+  color: var(--color-text);
+  background-color: var(--color-secondary-alpha-40);
+}
+
+.ui.modal {
+  background: var(--color-body);
+}
+
+.ui.modal > .close.inside,
+.ui.fullscreen.modal > .close {
+  color: var(--body-color);
+}
+
+.ui.basic.table > tbody > tr {
+  border-color: var(--color-secondary);
+}
+
 .dont-break-out {
   overflow-wrap: break-word;
   word-wrap: break-word;
diff --git a/web_src/less/_explore.less b/web_src/less/_explore.less
index 47ea240485f..fcdb655eb0f 100644
--- a/web_src/less/_explore.less
+++ b/web_src/less/_explore.less
@@ -22,7 +22,7 @@
     padding-bottom: 25px;
 
     &:not(:first-child) {
-      border-top: 1px solid #eeeeee;
+      border-top: 1px solid var(--color-secondary);
       padding-top: 25px;
     }
 
@@ -83,7 +83,7 @@
     padding-bottom: 25px;
 
     &:not(:first-child) {
-      border-top: 1px solid #eeeeee;
+      border-top: 1px solid var(--color-secondary);
       padding-top: 25px;
     }
 
@@ -98,14 +98,6 @@
       .svg:not(:first-child) {
         margin-left: 5px;
       }
-
-      a {
-        color: #333333;
-
-        &:hover {
-          text-decoration: underline;
-        }
-      }
     }
   }
 }
diff --git a/web_src/less/_repository.less b/web_src/less/_repository.less
index 5c18ae38577..29ae5ac07ce 100644
--- a/web_src/less/_repository.less
+++ b/web_src/less/_repository.less
@@ -1070,10 +1070,10 @@
               margin: 5px;
               padding: 5px;
               height: 150px;
-              border: solid 1px #eeeeee;
+              border: solid 1px var(--color-secondary);
               border-radius: 3px;
               max-width: 150px;
-              background-color: #ffffff;
+              background-color: var(--color-body);
 
               &::before {
                 content: ' ';
@@ -1962,14 +1962,14 @@
 
             .list {
               padding-left: 0;
-              border-top: 1px solid #eeeeee;
+              border-top: 1px solid var(--color-secondary);
 
               li {
                 list-style: none;
                 display: block;
                 padding-top: 8px;
                 padding-bottom: 8px;
-                border-bottom: 1px solid #eeeeee;
+                border-bottom: 1px solid var(--color-secondary);
 
                 a > .text.right {
                   margin-right: 5px;
@@ -2177,7 +2177,7 @@
         }
 
         .item {
-          border: 1px solid #eaeaea;
+          border: 1px solid var(--color-secondary);
           padding: 10px 15px;
 
           &:not(:last-child) {
@@ -2748,7 +2748,7 @@
       }
 
       &:not(:first-child) {
-        border-top: 1px solid #eaeaea;
+        border-top: 1px solid var(--color-secondary);
         padding: 1rem;
         margin: 15px -1rem -1rem;
       }
diff --git a/web_src/less/_user.less b/web_src/less/_user.less
index fcc5c0290fc..4af96bfd3db 100644
--- a/web_src/less/_user.less
+++ b/web_src/less/_user.less
@@ -29,7 +29,7 @@
             list-style: none;
 
             &:not(:last-child) {
-              border-bottom: 1px solid #eaeaea;
+              border-bottom: 1px solid var(--color-secondary);
             }
 
             .svg,
diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less
index a3ad509f768..c22f424a12c 100644
--- a/web_src/less/themes/theme-arc-green.less
+++ b/web_src/less/themes/theme-arc-green.less
@@ -710,7 +710,7 @@ a.ui.basic.green.label:hover {
 }
 
 .ui.pagination.menu .active.item {
-  color: #dbdbdb;
+  color: #fff;
   background-color: #87ab63;
 }
 
@@ -870,7 +870,6 @@ a.ui.basic.green.label:hover {
 }
 
 .ui.table {
-  color: #a5a5a5 !important;
   border-color: var(--color-secondary);
   background: #353945;
 }
@@ -1020,10 +1019,6 @@ a.ui.basic.green.label:hover {
 .repository.view.issue .comment-list .comment .content {
   > .bottom.segment {
     background: #353945;
-    a {
-      border-color: var(--color-secondary);
-      background-color: #353945;
-    }
   }
 
   .header {
@@ -1180,10 +1175,6 @@ td.blob-hunk {
   border: 1px solid #333640;
 }
 
-.ui.repository.list .item:not(:first-child) {
-  border-top: 1px solid var(--color-secondary);
-}
-
 .ui.selection.active.dropdown,
 .ui.selection.active.dropdown:hover,
 .ui.selection.active.dropdown .menu,
@@ -1236,10 +1227,6 @@ td.blob-hunk {
   color: #dbdbdb;
 }
 
-.ui.user.list .item:not(:first-child) {
-  border-top: 1px solid var(--color-secondary);
-}
-
 .ui.secondary.pointing.menu .active.item:hover {
   color: #dbdbdb;
 }
@@ -1254,10 +1241,6 @@ td.blob-hunk {
   background: #2c303a;
 }
 
-.user.settings .email.list .item:not(:first-child) {
-  border-top: 1px solid #3f4451;
-}
-
 .explore .navbar {
   background-color: #2a2e3a !important;
 }
@@ -1273,10 +1256,6 @@ td.blob-hunk {
   }
 }
 
-.settings .key.list .item:not(:first-child) {
-  border-top: 1px solid var(--color-secondary);
-}
-
 .ui.attached.info.message,
 .ui.info.message {
   box-shadow: 0 0 0 1px #4b5e71 inset, 0 0 0 0 transparent;
@@ -1358,10 +1337,6 @@ td.blob-hunk {
   box-shadow: 0 0 0 1px rgba(121, 71, 66, .5) inset, 0 0 0 0 transparent;
 }
 
-.user.profile .ui.card .extra.content ul li:not(:last-child) {
-  border-bottom: 1px solid var(--color-secondary);
-}
-
 .ui.form .dropzone {
   border: 1px dashed var(--color-secondary);
   background-color: #2e323e;
@@ -1391,10 +1366,6 @@ td.blob-hunk {
   color: var(--color-secondary-dark-6);
 }
 
-.ui.user.list .item .description a {
-  color: #668cb1;
-}
-
 .repository.file.list #repo-files-table tbody .svg.octicon-file-directory,
 .repository.file.list #repo-files-table tbody .svg.octicon-file-submodule {
   color: #7c9b5e;
@@ -1600,7 +1571,7 @@ a.ui.labels .label:hover {
 
 .ui.modal > .actions {
   background: var(--color-secondary);
-  border-top: 1px solid var(--color-secondary);
+  border-color: var(--color-secondary);
 }
 
 .ui.modal > .content {
@@ -1834,14 +1805,6 @@ footer .container .links > * {
   border-color: #383c4a;
 }
 
-.repository.release #release-list > li .detail .download .list {
-  border-top-color: var(--color-secondary);
-}
-
-.repository.release #release-list > li .detail .download .list li {
-  border-bottom-color: var(--color-secondary);
-}
-
 .board-column {
   background-color: rgba(0, 0, 0, .2) !important;
 }