From 3bb00e9c8a4b58034d2e6d7131ca6177972f8368 Mon Sep 17 00:00:00 2001
From: Neon <1169307+neon-dev@users.noreply.github.com>
Date: Thu, 2 May 2024 08:31:28 +0000
Subject: [PATCH] Dark mode fixes (#7)

I found that my last PR #6 did not address all issues with the dark theme on GItea 1.21, as there were still some unstyled (bright) elements and conflicts with obsolete styling rules.

Changes:
- Corrections on issue and pull request pages: status labels, buttons, timeline items and sidebar spacing
- Highlighting colors in the diff view and code view
- Message box colors
- Modal colors
- Minor corrections of various elements

Let me know if you find any other issues.

Reviewed-on: https://codeberg.org/pat-s/gitea-github-theme/pulls/7
Co-authored-by: Neon <1169307+neon-dev@users.noreply.github.com>
Co-committed-by: Neon <1169307+neon-dev@users.noreply.github.com>
---
 theme-github-auto.css | 287 ++++++++++++++---------------------------
 theme-github-dark.css | 289 ++++++++++++++----------------------------
 2 files changed, 187 insertions(+), 389 deletions(-)

diff --git a/theme-github-auto.css b/theme-github-auto.css
index 9232b00..fc0b303 100644
--- a/theme-github-auto.css
+++ b/theme-github-auto.css
@@ -441,11 +441,14 @@
 }
 @media (prefers-color-scheme: dark) {
   :root {
+    --is-dark-theme: true;
+    --border-radius: 6px;
     --color-white: #e6edf3;
     --color-red: #da3633;
     --color-orange: #c9510c;
     --color-yellow: #d29922;
     --color-blue: #4493f8;
+    --color-purple: #8957e5;
     --color-green: #238636;
     --color-green-light: #16ab39;
     --color-primary: var(--color-green);
@@ -455,20 +458,23 @@
     --color-primary-light-2: #006d32;
     --color-primary-dark-2: #26a641;
     --color-primary-dark-4: #39d353;
+    --color-primary-contrast: #ffffff;
     --color-secondary: #30363d;
     --color-secondary-alpha-60: #161b22;
+    --color-secondary-alpha-40: rgba(48, 54, 61, 0.4);
     --color-secondary-bg: #30363d;
-    --border-radius: 6px;
     --color-light-border: var(--color-secondary);
     --color-body: #0d1117;
     --color-card: var(--color-body);
     --color-navbar: #010409;
     --color-footer: #161b22;
+    --color-text: #bbc0ca;
+    --color-text-dark: #bbc0ca;
     --color-text-light: #a6aab5;
     --color-text-light-1: #848d97;
-    --color-text-light-2: #adbac7;
+    --color-text-light-2: #a6aab5;
+    --color-timeline: #21262d;
     --color-grey-light: var(--color-text-light);
-    --color-text: #bbc0ca;
     --color-box-body: #22272e;
     --color-markup-code-block: #636e7b66;
     --color-light: #22272e;
@@ -479,12 +485,9 @@
     --color-input-text: #adbac7;
     --color-box-header: #22272e;
     --color-active: #22272e;
+    --color-active-line: #272114;
     --color-menu: #161b22;
     --color-caret: var(--color-text);
-    --is-dark-theme: true;
-    --color-input-background: #22272e;
-    --color-primary-contrast: #ffffff;
-    --color-text-light-2: #a6aab5;
     --color-box-body: var(--color-body);
     --color-box-header: #161b22;
     --color-nav-bg: #010409;
@@ -500,6 +503,12 @@
     --color-success-bg: #122117;
     --color-success-border: #2ea04366;
     --color-success-text: var(--color-green);
+    --color-info-bg: rgba(56, 139, 253, 0.1);
+    --color-info-border: rgba(56, 139, 253, 0.4);
+    --color-info-text: var(--color-blue);
+    --color-warning-bg: rgba(187, 128, 9, 0.1);
+    --color-warning-border: rgba(187, 128, 9, 0.4);
+    --color-warning-text: var(--color-yellow);
 
     /* code editor colors are set in https://github.com/go-gitea/gitea/blob/f5b300ea77081a1b78ac044cb1c0f9225538d091/web_src/js/features/codeeditor.js#L82-L97.  */
     /* monaco editor dark theme is toggled via variable `--is-dark-theme` */
@@ -508,18 +517,35 @@
     --color-code-bg: var(--color-body);
 
     --color-diff-removed-row-bg: rgba(248, 81, 73, 0.15);
+    --color-diff-removed-row-border: rgba(248, 81, 73, 0.3);
     --color-diff-removed-word-bg: rgba(248, 81, 73, 0.4);
     --color-diff-added-row-bg: rgba(46, 160, 67, 0.15);
+    --color-diff-added-row-border: rgba(46, 160, 67, 0.3);
     --color-diff-added-word-bg: rgba(46, 160, 67, 0.4);
+    --color-diff-inactive: var(--color-secondary-alpha-60);
   }
 
   .text.primary,
-  .flex-item a:not(.label, .button):hover,
-  .combo-markdown-editor .markdown-toolbar-button:hover {
+  .flex-item a:not(.label, .button):hover {
     color: var(--color-blue) !important;
   }
-  .text.primary.svg {
-    color: var(--color-text) !important;
+
+  .svg:not(.text) {
+    fill: var(--color-text-light-1);
+  }
+  .label > .svg,
+  .btn > .svg,
+  .button > .svg,
+  .badge.gt-text-white > .svg,
+  .card > .svg,
+  a:not(.item):hover > .svg,
+  .dropdown:hover .svg,
+  .ui.attached.menu:not(.new-menu) .item .svg {
+    fill: currentColor;
+  }
+  .markdown-toolbar-button:hover {
+    background-color: var(--color-secondary);
+    border-radius: var(--border-radius);
   }
 
   .page-content.dashboard,
@@ -555,18 +581,8 @@
     color: #636e7b;
   }
 
-  .ui.modal > .header {
-    background: var(--color-secondary);
-    color: #dbdbdb;
-  }
-
   .ui.modal > .actions {
-    background: var(--color-secondary);
-    border-color: var(--color-secondary);
-  }
-
-  .ui.modal > .content {
-    background: #383c4a;
+    background: var(--color-body) !important;
   }
 
   .ui.green.buttons .button,
@@ -588,18 +604,22 @@
   a.muted:hover,
   .ui.breadcrumb a:hover,
   .ui.floating.jump.select-label.dropdown:hover,
+  .ui.floating.jump.select-milestone.dropdown:hover,
+  .ui.floating.jump.select-project.dropdown:hover,
+  .ui.floating.jump.select-assignees.dropdown:hover,
   .muted-links a:hover {
     color: var(--color-blue);
   }
-  a.text:hover,
+  a.text:not(.primary):hover,
   a.muted.text:hover,
   .ui.breadcrumb a.text:hover,
   .muted-links a:hover {
     text-decoration: none;
   }
 
+  .flex-item .flex-item-title a,
   .repo-title a {
-    color: var(--color-white) !important;
+    color: var(--color-white);
   }
 
   .repo-icon {
@@ -624,30 +644,14 @@
   .ui.basic.green.buttons .button,
   .ui.basic.primary.button,
   .ui.basic.primary.buttons .button {
-    background-color: #22272e !important;
-    box-shadow: inset 0 0 0 1px rgba(34, 36, 38, 0.15) !important;
-    color: #cdd9e5 !important;
-  }
-
-  .ui.basic.green.button:focus,
-  .ui.basic.green.buttons .button:focus,
-  .ui.basic.primary.button:focus,
-  .ui.basic.primary.buttons .button:focus {
-    box-shadow: inset 0 0 0 0px #808080 !important;
+    background-color: var(--color-button);
   }
 
   .ui.basic.green.button:hover,
   .ui.basic.green.buttons .button:hover,
   .ui.basic.primary.button:hover,
   .ui.basic.primary.buttons .button:hover {
-    background-color: #22272e !important;
-  }
-
-  .ui.basic.green.button:hover,
-  .ui.basic.green.buttons .button:hover,
-  .ui.basic.primary.button:hover,
-  .ui.basic.primary.buttons .button:hover {
-    box-shadow: inset 0 0 0 0px #808080 !important;
+    background-color: var(--color-hover);
   }
 
   .ui.basic.red.buttons .button,
@@ -680,16 +684,20 @@
     border: 1px solid var(--color-secondary);
   }
 
+  .issue-state-label {
+    border-radius: 2em !important;
+  }
+
   .issue-content-right {
     border: 0 !important;
-    padding: 0 !important;
+    padding: 8px 0 0 8px !important;
   }
 
   .issue-content-right .ui.button,
   .issue-content-right .ui.input,
   .issue-content-right .ui.input input,
-  .issue-content-right .ui.dropdown,
   .issue-content-right .ui.dropdown input,
+  .issue-content-right .ui.search.selection.dropdown,
   .issue-content-right .ui.search.selection.dropdown > input.search {
     padding: 0 8px !important;
     min-height: 28px;
@@ -699,14 +707,10 @@
     margin-top: .5rem !important;
   }
 
-  .ui.menu .item {
-    background-color: #22272e;
-  }
-
   .ui.top.attached.header {
     border-radius: var(--border-radius) var(--border-radius) 0 0;
   }
-  .ui.top.attached.header + .ui.attached.segment:not(.grid):not(.repos-search) {
+  .ui.top.attached.header + .ui.attached.segment:not(.grid):not(.repos-search):not(.teams) {
     border-radius: 0 0 var(--border-radius) var(--border-radius);
   }
 
@@ -718,43 +722,19 @@
     background-color: var(--color-body);
   }
 
-  .markup h1,
-  .markup h2,
-  .markup h3,
-  .markup h4,
-  .markup h5,
-  .markup h6 {
-    color: #adbac7;
-  }
-
+  .markup,
   .markup code,
-  .markup tt {
-    color: #adbac7;
-  }
-
-  .markup p,
-  .markup blockquote,
-  .markup details,
-  .markup ul,
-  .markup ol,
-  .markup dl,
-  .markup table,
-  .markup pre {
-    color: #adbac7;
+  .markup tt,
+  #org-info a,
+  .repo-description,
+  .repository-menu .item {
+    color: var(--color-white);
   }
 
   .repo-list-link {
     color: var(--color-blue) !important;
   }
 
-  #org-info a {
-    color: var(--color-white);
-  }
-
-  .repo-description {
-    color: var(--color-white);
-  }
-
   .ui.label:not(.basic) {
     border-radius: 2em;
   }
@@ -804,6 +784,7 @@
   .ui.menu,
   .ui.segment,
   .ui.segments,
+  .ui.segments:not(.horizontal) > .segment:only-child,
   .ui.secondary.menu .dropdown.item>.menu,
   .ui.selection.dropdown,
   .ui.selection.dropdown .menu,
@@ -840,18 +821,24 @@
   }
 
   /* default top border radius */
-  .repository.view.issue .comment-list .comment>.content>div:first-child,
-  .ui.tabular.menu .active.item,
   .ui.secondary.pointing.menu .active.item,
   .ui.secondary.pointing.menu .item:hover {
     border-radius: var(--border-radius) var(--border-radius) 0 0;
   }
+  .ui.tabular.menu .active.item,
+  .repository.view.issue .comment-list .comment > .content > div:first-child {
+    border-top-left-radius: var(--border-radius) !important;
+    border-top-right-radius: var(--border-radius) !important;
+  }
 
   /* default bottom border radius */
-  .repository.view.issue .comment-list .comment>.content>div:last-child,
   .ui.segment[class*="bottom attached"] {
     border-radius: 0 0 var(--border-radius) var(--border-radius);
   }
+  .repository.view.issue .comment-list .comment > .content > div:last-child {
+    border-bottom-right-radius: var(--border-radius);
+    border-bottom-left-radius: var(--border-radius);
+  }
 
   .ui.table>thead>tr:first-child>th:first-child {
       border-radius: var(--border-radius) 0 0;
@@ -1004,8 +991,14 @@
     border-radius: 6px;
   }
 
+  .ui.container .ui.tabular.menu .active.item,
+  .ui.container .ui.tabular.menu .active.item:hover {
+    color: var(--color-white);
+    margin-top: 0;
+  }
+
   .header-wrapper .ui.tabular.menu,
-  .ui.secondary.menu {
+  .ui.secondary.menu:not(.filter) {
     gap: 0.5rem;
   }
   .header-wrapper .ui.tabular.menu {
@@ -1016,8 +1009,7 @@
   .page-content > .ui.menu .item {
     color: var(--color-white) !important;
   }
-  .ui.menu .item .svg {
-    fill: var(--color-text-light-1);
+  .page-content .ui.menu .item .svg {
     margin-right: 0.5rem !important;
   }
   .header-wrapper .ui.tabular.menu:not(.new-menu) .item,
@@ -1084,35 +1076,13 @@
     color: #adbac7;
   }
 
-  /* border color of warning message */
-  .ui.warning.message {
-    background-color: #22272e;
-    color: var(--color-text);
-  }
-
-  .ui.warning.message,
-  .ui.attached.warning.message {
-    box-shadow: null;
-  }
-
-  .ui.warning.message,
-  .ui.attached.warning.message {
-    box-shadow: 0 0 0 0px #c9ba9b inset, 0 0 #0000;
-  }
-
   /* background emoji reactions */
   .repository .segment.reactions .ui.label.basic.blue {
     background-color: transparent;
   }
 
-  .ui.positive.message:not(.flash-success) {
-    background-color: #22272e;
-    color: #cdd9e5;
-  }
-
-  .ui.positive.message,
-  .ui.attached.positive.message {
-    box-shadow: 0 0 0 1px #347d39 inset, 0 0 #0000;
+  .diff-toggle-file-tree-button:hover {
+    color: var(--color-blue);
   }
 
   .diff-file-body .file-body.code-diff table tbody tr td {
@@ -1123,12 +1093,6 @@
     background: var(--color-body);
   }
 
-  /* PR open label */
-  .ui.green.labels .label,
-  .ui.ui.ui.green.label {
-    background-color: #347d39;
-  }
-
   .comment-code-cloud {
     background-color: var(--color-navbar);
   }
@@ -1202,35 +1166,21 @@
     border-bottom: 0px solid #a3c293;
   }
 
-  /* info message banner colors */
-  .ui.info.message {
-    background-color: var(--color-navbar);
-    color: var(--color-text);
-  }
-
   /* PR timelines colors */
   .repository.view.issue .comment-list .timeline-item .badge {
-    background-color: #21262d;
-    color: var(--color-text);
     width: 30px;
     height: 30px;
     margin-left: -31px;
   }
 
-  .repository.view.issue .comment-list .timeline-item .badge.badge-commit {
-    border-color: var(--color-navbar);
-    background: var(--color-navbar);
+  .repository.view.issue .pull-desc code {
+    color: var(--color-text-light-1);
   }
 
-  .repository.view.issue .comment-list .timeline:before {
-    background-color: var(--color-secondary);
-  }
-
-  .repository.view.issue .comment-list .timeline-item .badge .svg {
-    width: 20px;
-    height: 20px;
-    padding: 3px;
-    fill: var(--color-text-light-1);
+  .repository.view.issue .pull-desc code a {
+    background-color: var(--color-label-bg);
+    padding: 0 4px;
+    border-radius: var(--border-radius);
   }
 
   .ui.top.attached.header.comment-header {
@@ -1238,19 +1188,19 @@
   }
 
   .comment:target .header:before {
-    border-right-color: rgba(56, 139, 253, 0.4) !important;
+    border-right-color: var(--color-info-border) !important;
     box-shadow: none !important;
   }
   .comment:target .comment-container {
-    border-color: rgba(56, 139, 253, 0.4) !important;
+    border-color: var(--color-info-border) !important;
     box-shadow: none !important;
   }
   .comment:target .comment-container {
     background: var(--color-body);
   }
   .comment:target .comment-container .comment-header {
-    background: rgba(56, 139, 253, 0.1);
-    border-bottom-color: rgba(56, 139, 253, 0.4) !important;
+    background: var(--color-info-bg);
+    border-bottom-color: var(--color-info-border) !important;
   }
 
   /* review - pending label */
@@ -1269,24 +1219,6 @@
     color: var(--color-primary);
   }
 
-  span.green .svg {
-    color: var(--color-primary);
-  }
-
-  /* highlight color bg for highlighted lines */
-  .lines-code.active,
-  .lines-code .active {
-    border-radius: 6px;
-    background: #000000 !important;
-  }
-
-  .ui.ui.ui.ui.table tr.active,
-  .ui.ui.table td.active {
-    box-shadow: 0 0 #000000de inset;
-    background: #e0e0e0;
-    color: --var(--color-text);
-  }
-
   .following.bar #navbar {
     width: 100vw;
     border-bottom: 1px solid var(--color-secondary);
@@ -1367,24 +1299,6 @@
     line-height: 20px;
   }
 
-  .ui.green.labels .label,
-  .ui.ui.ui.green.label {
-    padding: 2px 5px;
-    line-height: 20px;
-    color: #cdd9e5 !important;
-    border-radius: 2em;
-  }
-
-  /* repository icon for files and directories */
-  .repository.file.list #repo-files-table tbody .svg.octicon-file,
-  .repository.file.list #repo-files-table tbody .svg.octicon-file-symlink-file,
-  .repository.file.list #repo-files-table tbody .svg.octicon-file-directory-symlink,
-  .repository.file.list #repo-files-table tbody .svg.octicon-file-directory-fill,
-  .repository.file.list #repo-files-table tbody .svg.octicon-file-directory,
-  .repository.file.list #repo-files-table tbody .svg.octicon-file-submodule {
-    color: var(--color-text-light-1);
-  }
-
   .ui.secondary.pointing.menu .item > .circular.label {
     line-height: 10px;
   }
@@ -1401,12 +1315,6 @@
 
   /* borders -------------------------------------------------------------------*/
 
-  // border width of active item in repo view
-  .ui.tabular.menu .active.item,
-  .ui.tabular.menu .active.item:hover {
-    border-width: initial;
-  }
-
   .following.bar.light {
     border-bottom: 0px solid var(--color-secondary);
   }
@@ -1415,10 +1323,6 @@
     border-width: inherit;
   }
 
-  footer {
-    border-width: inherit;
-  }
-
   .repo-buttons .ui.labeled.button > .label {
     border-width: inherit;
     border: 1px solid var(--color-secondary) !important;
@@ -1445,12 +1349,6 @@
     border-top-color: var(--color-secondary);
   }
 
-  .ui.basic.primary.button,
-  .ui.basic.primary.buttons .button {
-    color: #adbac7 !important;
-    font-weight: 500 !important;
-  }
-
   .ui.labeled.button.disabled>.button,
   .ui.basic.buttons .button,
   .ui.basic.button,
@@ -1523,8 +1421,9 @@
     color: var(--color-white) !important;
   }
 
-  // list in Pull requests view
-  .issue.list > .item .desc {
-    color: var(--color-text);
+  .vch__day__square,
+  .vch__legend__wrapper rect {
+    rx: 2px;
+    ry: 2px;
   }
 }
diff --git a/theme-github-dark.css b/theme-github-dark.css
index 68b7851..30920d0 100755
--- a/theme-github-dark.css
+++ b/theme-github-dark.css
@@ -1,9 +1,12 @@
 :root {
+  --is-dark-theme: true;
+  --border-radius: 6px;
   --color-white: #e6edf3;
   --color-red: #da3633;
   --color-orange: #c9510c;
   --color-yellow: #d29922;
   --color-blue: #4493f8;
+  --color-purple: #8957e5;
   --color-green: #238636;
   --color-green-light: #16ab39;
   --color-primary: var(--color-green);
@@ -13,20 +16,23 @@
   --color-primary-light-2: #006d32;
   --color-primary-dark-2: #26a641;
   --color-primary-dark-4: #39d353;
+  --color-primary-contrast: #ffffff;
   --color-secondary: #30363d;
   --color-secondary-alpha-60: #161b22;
+  --color-secondary-alpha-40: rgba(48, 54, 61, 0.4);
   --color-secondary-bg: #30363d;
-  --border-radius: 6px;
   --color-light-border: var(--color-secondary);
   --color-body: #0d1117;
   --color-card: var(--color-body);
   --color-navbar: #010409;
   --color-footer: #161b22;
+  --color-text: #bbc0ca;
+  --color-text-dark: #bbc0ca;
   --color-text-light: #a6aab5;
   --color-text-light-1: #848d97;
-  --color-text-light-2: #adbac7;
+  --color-text-light-2: #a6aab5;
+  --color-timeline: #21262d;
   --color-grey-light: var(--color-text-light);
-  --color-text: #bbc0ca;
   --color-box-body: #22272e;
   --color-markup-code-block: #636e7b66;
   --color-light: #22272e;
@@ -37,12 +43,9 @@
   --color-input-text: #adbac7;
   --color-box-header: #22272e;
   --color-active: #22272e;
+  --color-active-line: #272114;
   --color-menu: #161b22;
   --color-caret: var(--color-text);
-  --is-dark-theme: true;
-  --color-input-background: #22272e;
-  --color-primary-contrast: #ffffff;
-  --color-text-light-2: #a6aab5;
   --color-box-body: var(--color-body);
   --color-box-header: #161b22;
   --color-nav-bg: #010409;
@@ -58,6 +61,12 @@
   --color-success-bg: #122117;
   --color-success-border: #2ea04366;
   --color-success-text: var(--color-green);
+  --color-info-bg: rgba(56, 139, 253, 0.1);
+  --color-info-border: rgba(56, 139, 253, 0.4);
+  --color-info-text: var(--color-blue);
+  --color-warning-bg: rgba(187, 128, 9, 0.1);
+  --color-warning-border: rgba(187, 128, 9, 0.4);
+  --color-warning-text: var(--color-yellow);
 
   /* code editor colors are set in https://github.com/go-gitea/gitea/blob/f5b300ea77081a1b78ac044cb1c0f9225538d091/web_src/js/features/codeeditor.js#L82-L97.  */
   /* monaco editor dark theme is toggled via variable `--is-dark-theme` */
@@ -66,18 +75,35 @@
   --color-code-bg: var(--color-body);
 
   --color-diff-removed-row-bg: rgba(248, 81, 73, 0.15);
+  --color-diff-removed-row-border: rgba(248, 81, 73, 0.3);
   --color-diff-removed-word-bg: rgba(248, 81, 73, 0.4);
   --color-diff-added-row-bg: rgba(46, 160, 67, 0.15);
+  --color-diff-added-row-border: rgba(46, 160, 67, 0.3);
   --color-diff-added-word-bg: rgba(46, 160, 67, 0.4);
+  --color-diff-inactive: var(--color-secondary-alpha-60);
 }
 
 .text.primary,
-.flex-item a:not(.label, .button):hover,
-.combo-markdown-editor .markdown-toolbar-button:hover {
+.flex-item a:not(.label, .button):hover {
   color: var(--color-blue) !important;
 }
-.text.primary.svg {
-  color: var(--color-text) !important;
+
+.svg:not(.text) {
+  fill: var(--color-text-light-1);
+}
+.label > .svg,
+.btn > .svg,
+.button > .svg,
+.badge.gt-text-white > .svg,
+.card > .svg,
+a:not(.item):hover > .svg,
+.dropdown:hover .svg,
+.ui.attached.menu:not(.new-menu) .item .svg {
+  fill: currentColor;
+}
+.markdown-toolbar-button:hover {
+  background-color: var(--color-secondary);
+  border-radius: var(--border-radius);
 }
 
 .page-content.dashboard,
@@ -113,18 +139,8 @@
   color: #636e7b;
 }
 
-.ui.modal > .header {
-  background: var(--color-secondary);
-  color: #dbdbdb;
-}
-
 .ui.modal > .actions {
-  background: var(--color-secondary);
-  border-color: var(--color-secondary);
-}
-
-.ui.modal > .content {
-  background: #383c4a;
+  background: var(--color-body) !important;
 }
 
 .ui.green.buttons .button,
@@ -146,18 +162,22 @@ a:hover,
 a.muted:hover,
 .ui.breadcrumb a:hover,
 .ui.floating.jump.select-label.dropdown:hover,
+.ui.floating.jump.select-milestone.dropdown:hover,
+.ui.floating.jump.select-project.dropdown:hover,
+.ui.floating.jump.select-assignees.dropdown:hover,
 .muted-links a:hover {
   color: var(--color-blue);
 }
-a.text:hover,
+a.text:not(.primary):hover,
 a.muted.text:hover,
 .ui.breadcrumb a.text:hover,
 .muted-links a:hover {
   text-decoration: none;
 }
 
+.flex-item .flex-item-title a,
 .repo-title a {
-  color: var(--color-white) !important;
+  color: var(--color-white);
 }
 
 .repo-icon {
@@ -182,30 +202,14 @@ a.muted.text:hover,
 .ui.basic.green.buttons .button,
 .ui.basic.primary.button,
 .ui.basic.primary.buttons .button {
-  background-color: #22272e !important;
-  box-shadow: inset 0 0 0 1px rgba(34, 36, 38, 0.15) !important;
-  color: #cdd9e5 !important;
-}
-
-.ui.basic.green.button:focus,
-.ui.basic.green.buttons .button:focus,
-.ui.basic.primary.button:focus,
-.ui.basic.primary.buttons .button:focus {
-  box-shadow: inset 0 0 0 0px #808080 !important;
+  background-color: var(--color-button);
 }
 
 .ui.basic.green.button:hover,
 .ui.basic.green.buttons .button:hover,
 .ui.basic.primary.button:hover,
 .ui.basic.primary.buttons .button:hover {
-  background-color: #22272e !important;
-}
-
-.ui.basic.green.button:hover,
-.ui.basic.green.buttons .button:hover,
-.ui.basic.primary.button:hover,
-.ui.basic.primary.buttons .button:hover {
-  box-shadow: inset 0 0 0 0px #808080 !important;
+  background-color: var(--color-hover);
 }
 
 .ui.basic.red.buttons .button,
@@ -238,16 +242,20 @@ a.muted.text:hover,
   border: 1px solid var(--color-secondary);
 }
 
+.issue-state-label {
+  border-radius: 2em !important;
+}
+
 .issue-content-right {
   border: 0 !important;
-  padding: 0 !important;
+  padding: 8px 0 0 8px !important;
 }
 
 .issue-content-right .ui.button,
 .issue-content-right .ui.input,
 .issue-content-right .ui.input input,
-.issue-content-right .ui.dropdown,
 .issue-content-right .ui.dropdown input,
+.issue-content-right .ui.search.selection.dropdown,
 .issue-content-right .ui.search.selection.dropdown > input.search {
   padding: 0 8px !important;
   min-height: 28px;
@@ -257,14 +265,10 @@ a.muted.text:hover,
   margin-top: .5rem !important;
 }
 
-.ui.menu .item {
-  background-color: #22272e;
-}
-
 .ui.top.attached.header {
   border-radius: var(--border-radius) var(--border-radius) 0 0;
 }
-.ui.top.attached.header + .ui.attached.segment:not(.grid):not(.repos-search) {
+.ui.top.attached.header + .ui.attached.segment:not(.grid):not(.repos-search):not(.teams) {
   border-radius: 0 0 var(--border-radius) var(--border-radius);
 }
 
@@ -276,43 +280,19 @@ a.muted.text:hover,
   background-color: var(--color-body);
 }
 
-.markup h1,
-.markup h2,
-.markup h3,
-.markup h4,
-.markup h5,
-.markup h6 {
-  color: #adbac7;
-}
-
+.markup,
 .markup code,
-.markup tt {
-  color: #adbac7;
-}
-
-.markup p,
-.markup blockquote,
-.markup details,
-.markup ul,
-.markup ol,
-.markup dl,
-.markup table,
-.markup pre {
-  color: #adbac7;
+.markup tt,
+#org-info a,
+.repo-description,
+.repository-menu .item {
+  color: var(--color-white);
 }
 
 .repo-list-link {
   color: var(--color-blue) !important;
 }
 
-#org-info a {
-  color: var(--color-white);
-}
-
-.repo-description {
-  color: var(--color-white);
-}
-
 .ui.label:not(.basic) {
   border-radius: 2em;
 }
@@ -362,6 +342,7 @@ a.ui.label:hover {
 .ui.menu,
 .ui.segment,
 .ui.segments,
+.ui.segments:not(.horizontal) > .segment:only-child,
 .ui.secondary.menu .dropdown.item>.menu,
 .ui.selection.dropdown,
 .ui.selection.dropdown .menu,
@@ -398,18 +379,24 @@ a.ui.label:hover {
 }
 
 /* default top border radius */
-.repository.view.issue .comment-list .comment>.content>div:first-child,
-.ui.tabular.menu .active.item,
 .ui.secondary.pointing.menu .active.item,
 .ui.secondary.pointing.menu .item:hover {
   border-radius: var(--border-radius) var(--border-radius) 0 0;
 }
+.ui.tabular.menu .active.item,
+.repository.view.issue .comment-list .comment > .content > div:first-child {
+  border-top-left-radius: var(--border-radius) !important;
+  border-top-right-radius: var(--border-radius) !important;
+}
 
 /* default bottom border radius */
-.repository.view.issue .comment-list .comment>.content>div:last-child,
 .ui.segment[class*="bottom attached"] {
   border-radius: 0 0 var(--border-radius) var(--border-radius);
 }
+.repository.view.issue .comment-list .comment > .content > div:last-child {
+  border-bottom-right-radius: var(--border-radius);
+  border-bottom-left-radius: var(--border-radius);
+}
 
 .ui.table>thead>tr:first-child>th:first-child {
     border-radius: var(--border-radius) 0 0;
@@ -562,8 +549,14 @@ textarea,
   border-radius: 6px;
 }
 
+.ui.container .ui.tabular.menu .active.item,
+.ui.container .ui.tabular.menu .active.item:hover {
+  color: var(--color-white);
+  margin-top: 0;
+}
+
 .header-wrapper .ui.tabular.menu,
-.ui.secondary.menu {
+.ui.secondary.menu:not(.filter) {
   gap: 0.5rem;
 }
 .header-wrapper .ui.tabular.menu {
@@ -574,8 +567,7 @@ textarea,
 .page-content > .ui.menu .item {
   color: var(--color-white) !important;
 }
-.ui.menu .item .svg {
-  fill: var(--color-text-light-1);
+.page-content .ui.menu .item .svg {
   margin-right: 0.5rem !important;
 }
 .header-wrapper .ui.tabular.menu:not(.new-menu) .item,
@@ -642,35 +634,13 @@ textarea,
   color: #adbac7;
 }
 
-/* border color of warning message */
-.ui.warning.message {
-  background-color: #22272e;
-  color: var(--color-text);
-}
-
-.ui.warning.message,
-.ui.attached.warning.message {
-  box-shadow: null;
-}
-
-.ui.warning.message,
-.ui.attached.warning.message {
-  box-shadow: 0 0 0 0px #c9ba9b inset, 0 0 #0000;
-}
-
 /* background emoji reactions */
 .repository .segment.reactions .ui.label.basic.blue {
   background-color: transparent;
 }
 
-.ui.positive.message:not(.flash-success) {
-  background-color: #22272e;
-  color: #cdd9e5;
-}
-
-.ui.positive.message,
-.ui.attached.positive.message {
-  box-shadow: 0 0 0 1px #347d39 inset, 0 0 #0000;
+.diff-toggle-file-tree-button:hover {
+  color: var(--color-blue);
 }
 
 .diff-file-body .file-body.code-diff table tbody tr td {
@@ -681,12 +651,6 @@ a.blob-excerpt {
   background: var(--color-body);
 }
 
-/* PR open label */
-.ui.green.labels .label,
-.ui.ui.ui.green.label {
-  background-color: #347d39;
-}
-
 .comment-code-cloud {
   background-color: var(--color-navbar);
 }
@@ -760,35 +724,21 @@ a.ui.card:hover {
   border-bottom: 0px solid #a3c293;
 }
 
-/* info message banner colors */
-.ui.info.message {
-  background-color: var(--color-navbar);
-  color: var(--color-text);
-}
-
 /* PR timelines colors */
 .repository.view.issue .comment-list .timeline-item .badge {
-  background-color: #21262d;
-  color: var(--color-text);
   width: 30px;
   height: 30px;
   margin-left: -31px;
 }
 
-.repository.view.issue .comment-list .timeline-item .badge.badge-commit {
-  border-color: var(--color-navbar);
-  background: var(--color-navbar);
+.repository.view.issue .pull-desc code {
+  color: var(--color-text-light-1);
 }
 
-.repository.view.issue .comment-list .timeline:before {
-  background-color: var(--color-secondary);
-}
-
-.repository.view.issue .comment-list .timeline-item .badge .svg {
-  width: 20px;
-  height: 20px;
-  padding: 3px;
-  fill: var(--color-text-light-1);
+.repository.view.issue .pull-desc code a {
+  background-color: var(--color-label-bg);
+  padding: 0 4px;
+  border-radius: var(--border-radius);
 }
 
 .ui.top.attached.header.comment-header {
@@ -796,19 +746,19 @@ a.ui.card:hover {
 }
 
 .comment:target .header:before {
-  border-right-color: rgba(56, 139, 253, 0.4) !important;
+  border-right-color: var(--color-info-border) !important;
   box-shadow: none !important;
 }
 .comment:target .comment-container {
-  border-color: rgba(56, 139, 253, 0.4) !important;
+  border-color: var(--color-info-border) !important;
   box-shadow: none !important;
 }
 .comment:target .comment-container {
   background: var(--color-body);
 }
 .comment:target .comment-container .comment-header {
-  background: rgba(56, 139, 253, 0.1);
-  border-bottom-color: rgba(56, 139, 253, 0.4) !important;
+  background: var(--color-info-bg);
+  border-bottom-color: var(--color-info-border) !important;
 }
 
 /* review - pending label */
@@ -827,24 +777,6 @@ i.green.icon.icon.icon.icon {
   color: var(--color-primary);
 }
 
-span.green .svg {
-  color: var(--color-primary);
-}
-
-/* highlight color bg for highlighted lines */
-.lines-code.active,
-.lines-code .active {
-  border-radius: 6px;
-  background: #000000 !important;
-}
-
-.ui.ui.ui.ui.table tr.active,
-.ui.ui.table td.active {
-  box-shadow: 0 0 #000000de inset;
-  background: #e0e0e0;
-  color: --var(--color-text);
-}
-
 .following.bar #navbar {
   width: 100vw;
   border-bottom: 1px solid var(--color-secondary);
@@ -925,24 +857,6 @@ textarea:focus,
   line-height: 20px;
 }
 
-.ui.green.labels .label,
-.ui.ui.ui.green.label {
-  padding: 2px 5px;
-  line-height: 20px;
-  color: #cdd9e5 !important;
-  border-radius: 2em;
-}
-
-/* repository icon for files and directories */
-.repository.file.list #repo-files-table tbody .svg.octicon-file,
-.repository.file.list #repo-files-table tbody .svg.octicon-file-symlink-file,
-.repository.file.list #repo-files-table tbody .svg.octicon-file-directory-symlink,
-.repository.file.list #repo-files-table tbody .svg.octicon-file-directory-fill,
-.repository.file.list #repo-files-table tbody .svg.octicon-file-directory,
-.repository.file.list #repo-files-table tbody .svg.octicon-file-submodule {
-  color: var(--color-text-light-1);
-}
-
 .ui.secondary.pointing.menu .item > .circular.label {
   line-height: 10px;
 }
@@ -959,12 +873,6 @@ textarea:focus,
 
 /* borders -------------------------------------------------------------------*/
 
-// border width of active item in repo view
-.ui.tabular.menu .active.item,
-.ui.tabular.menu .active.item:hover {
-  border-width: initial;
-}
-
 .following.bar.light {
   border-bottom: 0px solid var(--color-secondary);
 }
@@ -973,10 +881,6 @@ textarea:focus,
   border-width: inherit;
 }
 
-footer {
-  border-width: inherit;
-}
-
 .repo-buttons .ui.labeled.button > .label {
   border-width: inherit;
   border: 1px solid var(--color-secondary) !important;
@@ -1003,12 +907,6 @@ footer {
   border-top-color: var(--color-secondary);
 }
 
-.ui.basic.primary.button,
-.ui.basic.primary.buttons .button {
-  color: #adbac7 !important;
-  font-weight: 500 !important;
-}
-
 .ui.labeled.button.disabled>.button,
 .ui.basic.buttons .button,
 .ui.basic.button,
@@ -1081,7 +979,8 @@ background: var(--color-hover);
   color: var(--color-white) !important;
 }
 
-// list in Pull requests view
-.issue.list > .item .desc {
-  color: var(--color-text);
-}
+.vch__day__square,
+.vch__legend__wrapper rect {
+  rx: 2px;
+  ry: 2px;
+}
\ No newline at end of file