From 5014b7d0aac3ce8ebf0eefec17641cac347d0e8e Mon Sep 17 00:00:00 2001
From: Neon <1169307+neon-dev@users.noreply.github.com>
Date: Sun, 28 Apr 2024 13:04:40 +0000
Subject: [PATCH] Update dark theme (#6)

Updated everything to match GitHub's current design. This also fixes various inconsistencies and visual issues with some elements.

Reviewed-on: https://codeberg.org/pat-s/gitea-github-theme/pulls/6
Reviewed-by: Patrick Schratz <pat-s@noreply.codeberg.org>
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 | 859 ++++++++++++++++++++++--------------------
 theme-github-dark.css | 857 +++++++++++++++++++++--------------------
 2 files changed, 912 insertions(+), 804 deletions(-)

diff --git a/theme-github-auto.css b/theme-github-auto.css
index 533efb3..9232b00 100644
--- a/theme-github-auto.css
+++ b/theme-github-auto.css
@@ -441,13 +441,31 @@
 }
 @media (prefers-color-scheme: dark) {
   :root {
-    --color-primary: #347d39;
-    --color-secondary: #373e47;
+    --color-white: #e6edf3;
+    --color-red: #da3633;
+    --color-orange: #c9510c;
+    --color-yellow: #d29922;
+    --color-blue: #4493f8;
+    --color-green: #238636;
+    --color-green-light: #16ab39;
+    --color-primary: var(--color-green);
+    --color-primary-hover: #29903b;
+    --color-primary-active: #2e9a40;
+    --color-primary-light-4: #0e4429;
+    --color-primary-light-2: #006d32;
+    --color-primary-dark-2: #26a641;
+    --color-primary-dark-4: #39d353;
+    --color-secondary: #30363d;
+    --color-secondary-alpha-60: #161b22;
+    --color-secondary-bg: #30363d;
     --border-radius: 6px;
+    --color-light-border: var(--color-secondary);
     --color-body: #0d1117;
-    --color-navbar: #161b22;
+    --color-card: var(--color-body);
+    --color-navbar: #010409;
     --color-footer: #161b22;
     --color-text-light: #a6aab5;
+    --color-text-light-1: #848d97;
     --color-text-light-2: #adbac7;
     --color-grey-light: var(--color-text-light);
     --color-text: #bbc0ca;
@@ -455,30 +473,60 @@
     --color-markup-code-block: #636e7b66;
     --color-light: #22272e;
     --color-button: #22272e;
+    --color-expand-button: var(--color-body);
     --color-input-background: #22272e;
-    --color-input-border-hover: #8e8c8c;
+    --color-input-border-hover: var(--color-secondary);
     --color-input-text: #adbac7;
     --color-box-header: #22272e;
     --color-active: #22272e;
-    --color-menu: #22272e;
+    --color-menu: #161b22;
     --color-caret: var(--color-text);
     --is-dark-theme: true;
-    --color-blue: #4796f9;
     --color-input-background: #22272e;
-    --color-primary-contrast: #adbac7;
+    --color-primary-contrast: #ffffff;
     --color-text-light-2: #a6aab5;
-    --color-box-body: #161b22;
+    --color-box-body: var(--color-body);
     --color-box-header: #161b22;
-    --color-green-light: #16ab39;
-    --color-nav-bg: #161b22;
-    --color-header-wrapper: #161b22;
-    --color-nav-hover-bg: #808080;
+    --color-nav-bg: #010409;
+    --color-header-wrapper: #010409;
+    --color-nav-hover-bg: rgba(177, 186, 196, 0.12);
+    --color-hover: #292e36;
+    --color-label-bg: rgba(56, 139, 253, 0.1);
+    --color-label-hover-bg: #1f6feb;
+    --color-label-text: var(--color-blue);
+    --color-error-bg: #b62324;
+    --color-error-border: #f8514966;
+    --color-error-text: var(--color-white);
+    --color-success-bg: #122117;
+    --color-success-border: #2ea04366;
+    --color-success-text: var(--color-green);
 
     /* 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` */
     --color-primary-light-3: #71798e;
-    --color-editor-line-highlight: #71798e;
-    --color-code-bg: var(--color-input-background);
+    --color-editor-line-highlight: var(--color-body);
+    --color-code-bg: var(--color-body);
+
+    --color-diff-removed-row-bg: rgba(248, 81, 73, 0.15);
+    --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-word-bg: rgba(46, 160, 67, 0.4);
+  }
+
+  .text.primary,
+  .flex-item a:not(.label, .button):hover,
+  .combo-markdown-editor .markdown-toolbar-button:hover {
+    color: var(--color-blue) !important;
+  }
+  .text.primary.svg {
+    color: var(--color-text) !important;
+  }
+
+  .page-content.dashboard,
+  .page-content.explore,
+  .page-content.repository:not(.new),
+  .page-content.signin {
+    margin-top: 10px;
   }
 
   .ui.list .list > .item > .content,
@@ -493,19 +541,18 @@
 
   .ui.repository.list,
   .ui.user.list {
-    background: var(--color-box-body);
+    background: var(--color-box-header);
     padding: 1em;
     border-radius: 0.75em;
   }
 
-  .ui.header .sub.header {
-    color: #636e7b;
+  .ui.avatar:not(.org-avatar) {
+    border-radius: 50% !important;
+    box-shadow: 0 0 0 1px var(--color-secondary);
   }
 
-  .ui .error.header {
-    border-color: var(--color-red) !important;
-    background-color: var(--color-red) !important;
-    color: #cdd9e5fff !important;
+  .ui.header .sub.header {
+    color: #636e7b;
   }
 
   .ui.modal > .header {
@@ -530,28 +577,29 @@
     padding: 5px 10px;
   }
 
-  .repository.file.list #repo-files-table tbody .svg.octicon-file-directory,
-  .repository.file.list #repo-files-table tbody .svg.octicon-file-submodule {
-    color: #768390;
-  }
-
   a,
   .ui.breadcrumb a {
-    /* color: var(--color-text); */
     color: var(--color-blue);
   }
+  a[href="#"] {
+    color: var(--color-text);
+  }
+  a:hover,
+  a.muted:hover,
+  .ui.breadcrumb a:hover,
+  .ui.floating.jump.select-label.dropdown:hover,
+  .muted-links a:hover {
+    color: var(--color-blue);
+  }
+  a.text:hover,
+  a.muted.text:hover,
+  .ui.breadcrumb a.text:hover,
+  .muted-links a:hover {
+    text-decoration: none;
+  }
 
   .repo-title a {
-    color: var(--color-blue) !important;
-  }
-
-  .ui.table > thead > tr > th {
-    background: #636e7b1a;
-    color: #dbdbdb !important;
-  }
-
-  .repository.file.list #repo-files-table tr {
-    background: #22272e;
+    color: var(--color-white) !important;
   }
 
   .repo-icon {
@@ -560,6 +608,14 @@
     margin-right: -0.05rem !important;
   }
 
+  .interact-fg:hover {
+    color: var(--color-blue) !important;
+  }
+
+  .repository.file.list .file-actions .btn-octicon:hover {
+    color: var(--color-blue) !important;
+  }
+
   .repository.file.list #file-buttons .ui.button {
     color: #cdd9e5 !important;
   }
@@ -594,34 +650,72 @@
     box-shadow: inset 0 0 0 0px #808080 !important;
   }
 
+  .ui.basic.red.buttons .button,
+  .ui.basic.red.button,
+  .ui.basic.red.buttons .button:focus,
+  .ui.basic.red.button:focus {
+    color: #f85149;
+    background: var(--color-button);
+    border-color: var(--color-light-border);
+  }
+  .ui.basic.red.buttons .button:hover,
+  .ui.basic.red.button:hover {
+    color: #ffffff;
+    background: #b62324;
+    border-color: #f0f6fc1a;
+  }
+  .ui.basic.red.buttons .button:active,
+  .ui.basic.red.button:active {
+    color: #ffffff;
+    background: #d03533;
+    border-color: #f0f6fc1a;
+  }
+
   .issue.list {
     list-style: none;
     margin-top: 1rem;
     background-color: #22272e;
     border-radius: 6px;
     padding: 3px 10px 3px 10px;
-    border: 1px solid #373e47;
+    border: 1px solid var(--color-secondary);
+  }
+
+  .issue-content-right {
+    border: 0 !important;
+    padding: 0 !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 > input.search {
+    padding: 0 8px !important;
+    min-height: 28px;
+  }
+  .issue-content-right .ui.button ~ .ui.button,
+  .issue-content-right > form ~ .ui.button {
+    margin-top: .5rem !important;
   }
 
   .ui.menu .item {
     background-color: #22272e;
   }
 
-  .ui.horizontal.segments > .segment {
-    background-color: #22272e;
-    border-radius: 6px;
+  .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) {
+    border-radius: 0 0 var(--border-radius) var(--border-radius);
   }
 
   .ui.attached.header {
     border-radius: 6px;
   }
 
-  .repository.file.list .repo-description {
-    color: #adbac7;
-  }
-
-  .commit-summary a.default-link {
-    color: #adbac7 !important;
+  .ui.attached.table {
+    background-color: var(--color-body);
   }
 
   .markup h1,
@@ -653,39 +747,28 @@
     color: var(--color-blue) !important;
   }
 
-  .ui.menu.two.item .item {
-    border: 1px solid #373e47;
-    background: #161b22;
-  }
-
-  a,
-  .push.news {
-    color: null;
-  }
-
-  .ui.header {
-    color: #a6aab5;
+  #org-info a {
+    color: var(--color-white);
   }
 
   .repo-description {
-    color: #a6aab5 !important;
+    color: var(--color-white);
   }
 
-  a.ui.label {
-    color: #adbac7 !important;
+  .ui.label:not(.basic) {
+    border-radius: 2em;
+  }
+
+  .ui.label.sha {
+    color: var(--color-text);
+    background: unset !important;
     border-color: var(--color-secondary) !important;
+    border-radius: 0.375rem;
   }
 
-  .ui.label {
-    border-color: var(--color-secondary) !important;
-  }
-
-  .ui.menu .item {
-    color: #adbac7;
-  }
-
-  .ui .sha.label {
-    padding: 6px 10px 6px;
+  .ui.labels a.label:hover,
+  a.ui.label:hover {
+    color: var(--color-white);
   }
 
   /* repo list dashboard */
@@ -693,51 +776,91 @@
     background-color: #22272e;
   }
 
-  /* ssh and search repository fields */
-  input,
-  textarea,
-  .ui.input > input,
-  .ui.form input:not([type]),
-  .ui.form select,
-  .ui.form textarea,
-  .ui.form input[type="date"],
-  .ui.form input[type="datetime-local"],
-  .ui.form input[type="email"],
-  .ui.form input[type="file"],
-  .ui.form input[type="number"],
-  .ui.form input[type="password"],
-  .ui.form input[type="search"],
-  .ui.form input[type="tel"],
-  .ui.form input[type="text"],
-  .ui.form input[type="time"],
-  .ui.form input[type="url"],
-  .ui.selection.dropdown,
-  .ui.checkbox label:before,
-  .ui.checkbox input:checked ~ label:before,
-  .ui.checkbox input:not([type="radio"]):indeterminate ~ label:before {
-    border-color: #373e47 !important;
-  }
-
-  /* hover repository rows */
-  .repository.file.list #repo-files-table tr:hover {
-    background-color: var(--color-hover);
-  }
-
   /* due date boxes */
   .repository .metas #deadlineForm input {
     border-color: var(--color-secondary);
   }
 
-  /* border color dependencies block in issues */
-  #new-dependency-drop-list.ui.selection.dropdown {
-    border-color: var(--color-secondary);
+  /* default border radius */
+  .ui.button,
+  .ui.basic.buttons .button,
+  .ui.basic.button,
+  .ui.dropdown .menu,
+  .ui.form input:not([type]),
+  .ui.form input[type="date"],
+  .ui.form input[type="datetime-local"],
+  .ui.form input[type="email"],
+  .ui.form input[type="number"],
+  .ui.form input[type="password"],
+  .ui.form input[type="search"],
+  .ui.form input[type="tel"],
+  .ui.form input[type="time"],
+  .ui.form input[type="text"],
+  .ui.form input[type="file"],
+  .ui.form input[type="url"],
+  .ui.form textarea,
+  .ui.input textarea,
+  .ui.label,
+  .ui.menu,
+  .ui.segment,
+  .ui.segments,
+  .ui.secondary.menu .dropdown.item>.menu,
+  .ui.selection.dropdown,
+  .ui.selection.dropdown .menu,
+  .ui.table,
+  .ui.text.menu .dropdown.item>.menu {
+    border-radius: var(--border-radius);
   }
 
-  .page-content .ui.button {
-    border-color: var(--color-secondary);
+  .ui.floating.dropdown>.menu {
+    border-radius: var(--border-radius) !important;
   }
 
-  /* border color form fields settings page */
+  /* no border radius between connected buttons */
+  .ui.buttons .button {
+    border-radius: 0;
+  }
+
+  /* default left border radius */
+  .ui.action.input > .dropdown:first-child,
+  .ui.action.input > .button:first-child,
+  .ui.action.input > .buttons:first-child > .button,
+  .ui.compact.menu:not(.secondary) .item:first-child,
+  .ui.horizontal.segments > .segment:first-child {
+    border-radius: var(--border-radius) 0 0 var(--border-radius);
+  }
+
+  /* default right border radius */
+  .ui.action.input > .dropdown:last-child,
+  .ui.action.input > .button:last-child,
+  .ui.action.input > .buttons:last-child > .button,
+  .ui.compact.menu:not(.secondary) .item:last-child,
+  .ui.horizontal.segments > .segment:last-child {
+    border-radius: 0 var(--border-radius) var(--border-radius) 0;
+  }
+
+  /* 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;
+  }
+
+  /* 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);
+  }
+
+  .ui.table>thead>tr:first-child>th:first-child {
+      border-radius: var(--border-radius) 0 0;
+  }
+  .ui.table>thead>tr:first-child>th:last-child {
+      border-radius: 0 var(--border-radius) 0 0;
+  }
+
+  /* border color form fields */
   input,
   textarea,
   .ui.input > input,
@@ -762,20 +885,8 @@
     border-color: var(--color-secondary);
   }
 
-  /* background color of code display */
-  .lines-code {
-    background-color: #22272e;
-  }
-
-  .code-diff-unified .add-code,
-  .code-diff-unified .add-code td,
-  .code-diff-split .add-code .lines-num-new,
-  .code-diff-split .add-code .lines-type-marker-new,
-  .code-diff-split .add-code .lines-code-new,
-  .code-diff-split .del-code .add-code.lines-num-new,
-  .code-diff-split .del-code .add-code.lines-type-marker-new,
-  .code-diff-split .del-code .add-code.lines-code-new {
-    background: rgba(70, 149, 74, 0.15);
+  .ui.input > input {
+    transition: none;
   }
 
   .tag-code,
@@ -783,21 +894,39 @@
     background-color: var(--color-body);
   }
 
-  /* green code color dark theme */
+  /* code highlighting dark theme */
+  .chroma .cm, /* block comments */
+  .chroma .c1 /* line comments */ {
+    color: #8b949e;
+  }
+
+  /* strings */
+  .chroma .s,
+  .chroma .cpf {
+    color: #a5d6ff;
+  }
+
   .chroma .s2 {
     color: #8ddb8c;
   }
 
-  .chroma .k {
-    color: #f47067;
+  /* keywords */
+  .chroma .k,
+  .chroma .kc,
+  .chroma .kd,
+  .chroma .kn,
+  .chroma .kt {
+    color: #ff7b72;
   }
 
   .chroma .m {
     color: #6cb6ff;
   }
 
+  /* method names */
+  .chroma .na,
   .chroma .nf {
-    color: #96d0ff;
+    color: #d2a8ff;
   }
 
   .chroma .nb {
@@ -824,64 +953,131 @@
     color: #c4cfcf;
   }
 
+  .chroma .n, /* variable & referenced class names */
+  .chroma .nc, /* class names */
+  .chroma .nn /* import names */ {
+    color: #c9d1d9;
+  }
+
+  /* operators */
   .chroma .o {
-    color: #eb3243;
+    color: #c9d1d9;
   }
 
-  .chroma .nc {
-    color: #16e9e9;
+  .repository.file.list #repo-files-table thead tr th {
+    padding: 12px 12px 12px 20px;
   }
 
-  .chroma .nn {
-    color: #16e9e9;
+  .repository.file.list #repo-files-table tbody tr {
+    background: var(--color-body);
   }
 
-  .chroma .s {
-    color: #8ddb8c;
-  }
-
-  /* border color repo files */
-  .repository.file.list #repo-files-table td {
-    // border-bottom: 1px solid #373e47;
+  .repository.file.list #repo-files-table tbody tr:hover {
+    background: var(--color-box-header);
   }
 
   /* text color repo files */
-  .repository.file.list #repo-files-table td {
-    color: var(--color-text-light) !important;
-    background: #161b22;
+  .repository.file.list #repo-files-table td.name a,
+  .repository.file.list #repo-files-table td a:not(.muted) {
+    color: var(--color-white);
   }
 
-  .repository.file.list #repo-files-table td a {
-    /* color: #7f8699 !important; */
-    color: var(--color-blue) !important;
+  .repository.file.list #repo-files-table td a:hover {
+    color: var(--color-blue);
+  }
+
+  .repository #commits-table.ui.basic.striped.table tbody tr:nth-child(2n) {
+    background-color: var(--color-body) !important;
+  }
+
+  .repository #commits-table .author a {
+    color: var(--color-text);
   }
 
   /* gpg commit label  */
   .repository #commits-table td.sha .sha.label.isSigned.isVerified,
   .repository #repo-files-table .sha.label.isSigned.isVerified,
   .repository #rev-list .sha.label.isSigned.isVerified,
-  .repository
-    .timeline-item.commits-list
-    .singular-commit
-    .sha.label.isSigned.isVerified {
+  .repository .timeline-item.commits-list .singular-commit .sha.label.isSigned.isVerified {
     border: 1.5px solid #21ba45 !important;
     background: transparent;
     border-radius: 6px;
   }
 
-  /* color of active tabular item, e.g. in PR view (conversations, commits, files changed) */
-  .ui.tabular.menu .active.item,
-  .ui.tabular.menu .active.item:hover {
-    background: var(--color-navbar);
-    border-bottom: 3px solid #f78166 !important;
-    border: 0px solid black;
-    color: #adbac7;
+  .header-wrapper .ui.tabular.menu,
+  .ui.secondary.menu {
+    gap: 0.5rem;
+  }
+  .header-wrapper .ui.tabular.menu {
+    min-height: 48px;
+    align-items: center;
+  }
+  .header-wrapper .ui.menu .item,
+  .page-content > .ui.menu .item {
+    color: var(--color-white) !important;
+  }
+  .ui.menu .item .svg {
+    fill: var(--color-text-light-1);
+    margin-right: 0.5rem !important;
+  }
+  .header-wrapper .ui.tabular.menu:not(.new-menu) .item,
+  .header-wrapper .ui.tabular.menu:not(.new-menu) .active.item,
+  .ui.secondary.menu:not(.new-menu) .item
+  .ui.secondary.menu:not(.new-menu) .active.item {
+    border: 0;
+    border-radius: var(--border-radius) !important;
+    align-items: center;
+    line-height: 30px;
+    padding: 0 8px;
+    margin-top: 0 !important;
+    margin-bottom: 0 !important;
+  }
+  .header-wrapper .ui.tabular.menu .item:hover,
+  .ui.secondary.menu .item:hover {
+    background: var(--color-nav-hover-bg) !important;
+  }
+  .header-wrapper .ui.tabular.menu:not(.new-menu) .active.item {
+    background: unset;
+  }
+  .header-wrapper .ui.tabular.menu:not(.new-menu) .active.item::after {
+    background: #f78166;
+    bottom: calc(50% - 25px);
+    content: "";
+    height: 2px;
+    position: absolute;
+    right: 50%;
+    transform: translate(50%, -50%);
+    width: 100%;
+    z-index: 1;
+  }
+  .ui.secondary.pointing.menu .active.item,
+  .ui.secondary.pointing.menu .active.item:hover {
+    border-color: #f78166;
+  }
+  .ui.menu.new-menu .item:last-child {
+    padding-right: 16px !important;
+  }
+
+  .ui.basic.label {
+    color: var(--color-text-light-1);
+    border-radius: 2em;
+    background: transparent;
+    font-weight: 400;
+    padding: 0 7px !important;
+    line-height: 18px;
+  }
+  .ui.menu .item > .label:not(.floating) {
+    padding: 4px 7px;
   }
 
   /* repo watch and fork counters */
-  .ui.basic.labels:not(.tag):not(.image):not(.ribbon) .label,
-  .ui.basic.label:not(.tag):not(.image):not(.ribbon) {
-    color: #adbac7;
+  .repo-buttons .ui.labeled.button>.label,
+  .repo-buttons .ui.labeled.button>.label:hover {
+    color: var(--color-white);
+    border-top-right-radius: var(--border-radius);
+    border-bottom-right-radius: var(--border-radius);
+    background: #21262d;
+    padding: 0 10px !important;
   }
 
   .repo-buttons .ui.labeled.button.disabled > .label {
@@ -904,17 +1100,12 @@
     box-shadow: 0 0 0 0px #c9ba9b inset, 0 0 #0000;
   }
 
-  /* repo svg icons */
-  .repository.view.issue .comment-list .timeline-item .badge .svg {
-    fill: #cdd9e5fff !important;
-  }
-
   /* background emoji reactions */
   .repository .segment.reactions .ui.label.basic.blue {
     background-color: transparent;
   }
 
-  .ui.positive.message {
+  .ui.positive.message:not(.flash-success) {
     background-color: #22272e;
     color: #cdd9e5;
   }
@@ -924,23 +1115,8 @@
     box-shadow: 0 0 0 1px #347d39 inset, 0 0 #0000;
   }
 
-  /* diff color deletion */
-  .code-diff-unified .del-code,
-  .code-diff-unified .del-code td,
-  .code-diff-split .del-code .lines-num-old,
-  .code-diff-split .del-code .lines-type-marker-old,
-  .code-diff-split .del-code .lines-code-old {
-    background: rgba(229, 83, 75, 0.15);
-  }
-
-  /* diff color neutral */
-  .lines-num,
-  .lines-code {
-    background-color: var(--color-navbar);
-  }
-
-  .lines-type-marker {
-    background-color: var(--color-navbar);
+  .diff-file-body .file-body.code-diff table tbody tr td {
+    line-height: 16px;
   }
 
   a.blob-excerpt {
@@ -953,30 +1129,10 @@
     background-color: #347d39;
   }
 
-  /* bg color of PR comment form */
-  .ui.form,
-  .ui.form .field .dropdown,
-  .ui.form .field .dropdown .menu > .item {
-    background-color: var(--color-navbar);
-  }
-
   .comment-code-cloud {
     background-color: var(--color-navbar);
   }
 
-  /* remove border of "new file" button */
-  .ui.buttons .button:first-child {
-    border-left: 1px solid var(--color-markup-code-block);
-  }
-
-  /* border color of dropdown svg */
-  .ui.form,
-  .ui.form .field .dropdown,
-  .ui.form .field .dropdown .menu > .item {
-    background-color: var(--color-border);
-    /* border: 0px solid black !important; */
-  }
-
   /* hover font color */
   .ui.secondary.pointing.menu .active.item,
   .ui.secondary.pointing.menu .active.item:hover,
@@ -990,35 +1146,26 @@
   .ui.selection.active.dropdown:hover,
   .ui.selection.active.dropdown .menu,
   .ui.selection.active.dropdown:hover .menu {
-    border-color: #373e47;
+    border-color: var(--color-secondary);
   }
 
-  /* user avatar background */
-  .user.profile .ui.card #profile-avatar {
-    background: var(--color-navbar);
-  }
 
-  .ui.cards > .card > .content,
-  .ui.card > .content {
-    background: var(--color-navbar);
+  .ui.cards > .card,
+  .ui.card,
+  .ui.cards a.card:hover,
+  a.ui.card:hover {
+    border: 0;
   }
-
-  .user.profile .ui.card .extra.content ul li:not(:last-child) {
-    border-bottom: 1px solid var(--color-secondary);
-    background-color: var(--color-navbar);
+  .ui.cards > .card > .extra, .ui.card > .extra {
+    border-top-color: var(--color-secondary) !important;
   }
-
-  .user.profile .ui.card .extra.content ul li {
-    background-color: var(--color-navbar);
-  }
-
-  /* right border of profile search bar */
-  .ui.action.input:not([class*="left action"]) > input {
-    border-right-color: var(--color-secondary);
+  .ui.cards > .card > .extra a:not(.ui):hover,
+  .ui.card > .extra a:not(.ui):hover {
+    color: var(--color-blue);
   }
 
   .ui.action.input:not([class*="left action"]) > input:focus {
-    border-right-color: var(--color-secondary);
+    border-right: none;
   }
 
   /* font color line numbers */
@@ -1061,8 +1208,9 @@
     color: var(--color-text);
   }
 
+  /* PR timelines colors */
   .repository.view.issue .comment-list .timeline-item .badge {
-    background-color: var(--color-navbar);
+    background-color: #21262d;
     color: var(--color-text);
     width: 30px;
     height: 30px;
@@ -1075,27 +1223,34 @@
   }
 
   .repository.view.issue .comment-list .timeline:before {
-    background-color: #373e47;
+    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);
   }
 
-  input {
-    caret-color: var(--color-text);
+  .ui.top.attached.header.comment-header {
+      padding: 0 16px;
   }
 
-  .removed-code {
-    background: #b70f22;
-    color: var(--color-text);
+  .comment:target .header:before {
+    border-right-color: rgba(56, 139, 253, 0.4) !important;
+    box-shadow: none !important;
   }
-
-  .added-code {
-    background: #0d8b2c;
-    color: var(--color-text);
+  .comment:target .comment-container {
+    border-color: rgba(56, 139, 253, 0.4) !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;
   }
 
   /* review - pending label */
@@ -1132,26 +1287,18 @@
     color: --var(--color-text);
   }
 
-  /* navbar font size */
-  .ui.secondary.menu .item {
-    font-size: 13px;
-  }
-
-  #navbar .item {
-    margin: 0;
-    padding: 0.5em;
-    font-size: 14px;
-  }
-
   .following.bar #navbar {
     width: 100vw;
-    border-bottom: 1px solid #373e47;
+    border-bottom: 1px solid var(--color-secondary);
     /* default 52px */
     min-height: 40px;
     padding: 0 0.5rem;
     background: var(--color-navbar);
   }
 
+  * {
+    scrollbar-color: unset;
+  }
   ::-webkit-scrollbar-thumb {
     box-shadow: inset 0 0 0 6px var(--color-navbar);
   }
@@ -1163,37 +1310,19 @@
     margin-top: -2px;
   }
 
-  /* border colors of search fields, e.g. "find repository" on main page */
-  input:hover,
-  textarea:hover,
-  .ui.input input:hover,
-  .ui.form input:not([type]):hover,
-  .ui.form select:hover,
-  .ui.form textarea:hover,
-  .ui.form input[type="date"]:hover,
-  .ui.form input[type="datetime-local"]:hover,
-  .ui.form input[type="email"]:hover,
-  .ui.form input[type="file"]:hover,
-  .ui.form input[type="number"]:hover,
-  .ui.form input[type="password"]:hover,
-  .ui.form input[type="search"]:hover,
-  .ui.form input[type="tel"]:hover,
-  .ui.form input[type="text"]:hover,
-  .ui.form input[type="time"]:hover,
-  .ui.form input[type="url"]:hover,
-  .ui.selection.dropdown:hover,
-  .ui.checkbox label:hover:before,
-  .ui.checkbox label:active:before,
   .ui.radio.checkbox label:after,
   .ui.radio.checkbox input:focus ~ label:before,
   .ui.radio.checkbox input:checked ~ label:before {
     border-color: var(--color-secondary);
   }
 
-  a:hover,
-  a.muted:hover,
-  .ui.breadcrumb a:hover {
-    color: var(--color-blue);
+  .input > input ~ button,
+  .input > input ~ .button {
+    border-left-width: 0 !important;
+  }
+  .input > input:focus ~ button,
+  .input > input:focus ~ .button {
+      border-color: var(--color-blue) !important;
   }
 
   input:focus,
@@ -1213,23 +1342,26 @@
   .ui.form input[type="text"]:focus,
   .ui.form input[type="time"]:focus,
   .ui.form input[type="url"]:focus,
-  .ui.selection.dropdown:focus,
+  .ui.selection.dropdown:focus {
+    border-color: var(--color-blue);
+    border-radius: var(--border-radius);
+  }
+
   .ui.checkbox input:focus ~ label:before,
+  .ui.checkbox input:focus ~ label::before,
   .ui.checkbox input:not([type="radio"]):indeterminate:focus ~ label:before,
+  .ui.checkbox input:not([type="radio"]):indeterminate:focus ~ label::before,
   .ui.checkbox input:checked:focus ~ label:before,
-  .ui.radio.checkbox input:focus:checked ~ label:before {
-    border-color: ;
+  .ui.checkbox input:checked:focus ~ label::before,
+  .ui.radio.checkbox input:focus:checked ~ label:before,
+  .ui.radio.checkbox input:focus:checked ~ label::before {
+    border-color: var(--color-blue);
   }
 
   .repo-icon {
     display: none;
   }
 
-  /* reduce navbar bottom margin */
-  .ui.ui.ui.container:not(.fluid) {
-    margin-bottom: -3px;
-  }
-
   .ui.green.button {
     padding: 5px 16px;
     line-height: 20px;
@@ -1243,17 +1375,14 @@
     border-radius: 2em;
   }
 
-  .ui.tabular.menu .active.item {
-    margin-bottom: 1px;
-  }
-
-  /* repository icon for directories */
-  .repository.file.list
-    #repo-files-table
-    tbody
-    .svg.octicon-file-directory-fill,
+  /* 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: #768390;
+    color: var(--color-text-light-1);
   }
 
   .ui.secondary.pointing.menu .item > .circular.label {
@@ -1267,12 +1396,7 @@
 
   .ui.primary.label,
   .ui.primary.labels .label {
-    background-color: #373e47 !important;
-  }
-
-  // timeline view icon color
-  .repository.view.issue .comment-list .timeline-item .badge .svg {
-    fill: #cdd9e5 !important;
+    background-color: var(--color-secondary) !important;
   }
 
   /* borders -------------------------------------------------------------------*/
@@ -1283,52 +1407,10 @@
     border-width: initial;
   }
 
-  // README border
-  .ui.attached:not(.message) + .ui.attached.segment:not(.top) {
-    border-width: inherit;
-  }
-
-  .ui.top.attached.header {
-    border-width: inherit;
-    border: 1px solid #373e47;
-  }
-
   .following.bar.light {
     border-bottom: 0px solid var(--color-secondary);
   }
 
-  .ui.action.input:not([class*="left action"]) > input {
-    border-width: inherit;
-  }
-
-  .ui.action.input > .dropdown:last-child,
-  .ui.action.input > .button:last-child,
-  .ui.action.input > .buttons:last-child > .button {
-    border-width: inherit;
-  }
-
-  .ui.action.input:not([class*="left action"])
-    > .ui.dropdown.selection:not(:focus):not(:hover) {
-    border-width: inherit;
-  }
-
-  .repository #clone-panel #repo-clone-https,
-  .repository #clone-panel #repo-clone-ssh {
-    border-width: inherit;
-  }
-
-  .ui.action.input > .dropdown:not(:first-child),
-  .ui.action.input > .button:not(:first-child),
-  .ui.action.input > .buttons:not(:first-child) > .button {
-    border-width: inherit;
-  }
-
-  .ui.segment,
-  .ui.segments,
-  .ui.attached.segment {
-    border-width: inherit;
-  }
-
   .ui.table {
     border-width: inherit;
   }
@@ -1337,60 +1419,30 @@
     border-width: inherit;
   }
 
-  .page-content .ui.button {
-    border-width: inherit;
-  }
-
   .repo-buttons .ui.labeled.button > .label {
     border-width: inherit;
-    border: 1px solid #373e47 !important;
+    border: 1px solid var(--color-secondary) !important;
   }
 
   .repo-button-row .button {
-    height: unset;
-  }
-
-  .repository .repository-summary .segment.language-stats {
-    height: 14px;
-    border-radius: 6px;
+    min-height: 30px;
   }
 
   .ui.table[class*="single line"],
   .ui.table [class*="single line"] {
     white-space: nowrap;
-    border: 1px solid #373e47;
+    border: 1px solid var(--color-secondary);
   }
 
-  .ui.tiny.input {
-    font-size: 0.85714286em;
-    border: 1px solid #373e47;
-    border-radius: 6px;
-  }
-
-  .ui.fluid.input {
-    border: 1px solid #373e47 !important;
-    border-radius: 6px;
-  }
-
-  .repository.view.issue .comment-list .comment > .content > div:last-child {
-    border: 0px solid #373e47 !important;
-  }
   .ui.basic.secondary.buttons .button,
   .ui.basic.secondary.button {
     color: var(--color-text) !important;
-    border: 1px solid #373e47 !important;
-  }
-  .ui.small.buttons .dropdown,
-  .ui.small.buttons .dropdown .menu > .item,
-  .ui.small.buttons .button,
-  .ui.small.buttons .or,
-  .ui.ui.ui.ui.small.button {
-    border: 1px solid #373e47 !important;
+    border: 1px solid var(--color-secondary) !important;
   }
 
   .ui.table > tr > td,
   .ui.table > tbody > tr > td {
-    border-top-color: #373e47;
+    border-top-color: var(--color-secondary);
   }
 
   .ui.basic.primary.button,
@@ -1399,19 +1451,44 @@
     font-weight: 500 !important;
   }
 
-  .feeds .list ul li .repo-list-link {
-    background: #161b22;
+  .ui.labeled.button.disabled>.button,
+  .ui.basic.buttons .button,
+  .ui.basic.button,
+  .ui.basic.buttons .button:focus,
+  .ui.basic.button:focus {
+    color: var(--color-text);
   }
-  .ui.attached:not(.message) + .ui.attached.segment:not(.top) {
-    border: 1px solid #373e47;
+
+  .ui.vertical.menu {
+    background: var(--color-body);
+    border: 0;
+  }
+  .ui.vertical.menu .header.item {
+    font-weight: 600;
+    background: unset;
+  }
+  .ui.vertical.menu .menu .item:hover {
+  background: var(--color-hover);
   }
-  .ui.menu .active.item,
-  .ui.menu .active.item:hover,
   .ui.vertical.menu .active.item,
   .ui.vertical.menu .active.item:hover {
-    background: #161b22;
+    background: #b1bac414 !important;
     font-weight: 500;
-    color: #adbac7;
+  }
+  .ui.vertical.menu .item,
+  .ui.vertical.menu .item > summary {
+    background: unset;
+    padding: 8px;
+    color: var(--color-white) !important;
+  }
+  .ui.vertical.menu .item,
+  .ui.vertical.menu .item.active,
+  .ui.vertical.menu .item:hover,
+  .ui.vertical.menu .item > summary {
+    border-radius: 6px;
+  }
+  .ui.vertical.menu .item::before {
+    background: unset;
   }
   .ui.primary.labels .label,
   .ui.ui.ui.primary.label {
@@ -1420,18 +1497,6 @@
   .issue.list a:not(.label):hover {
     color: var(--color-blue) !important;
   }
-  .ui.segment,
-  .ui.segments,
-  .ui.attached.segment {
-    border: 1px solid #373e47 !important;
-  }
-  .repository.view.issue .comment-list .comment .comment-container {
-    border: 1px solid #373e47;
-    border-radius: 0px;
-  }
-  .repository.view.issue .comment-list .comment > .content > div:first-child {
-    border-bottom: 1px solid #373e47 !important;
-  }
   .tag-code,
   .tag-code td,
   .tag-code .blob-excerpt {
@@ -1444,15 +1509,6 @@
     color: #cdd9e5;
   }
 
-  .ui.basic.red.buttons .button,
-  .ui.basic.red.button {
-    color: var(--color-red);
-    border: 1px solid var(--color-red);
-    border-radius: 16px;
-    padding: 5px 16px;
-    line-height: 20px;
-  }
-
   #navbar a.item .notification_count {
     color: var(--color-text);
   }
@@ -1464,8 +1520,7 @@
 
   .ui.secondary.menu .active.item,
   .ui.secondary.menu .active.item:hover {
-    color: #e3e3e3;
-    background-color: var(--color-nav-bg);
+    color: var(--color-white) !important;
   }
 
   // list in Pull requests view
diff --git a/theme-github-dark.css b/theme-github-dark.css
index 900c836..68b7851 100755
--- a/theme-github-dark.css
+++ b/theme-github-dark.css
@@ -1,11 +1,29 @@
 :root {
-  --color-primary: #347d39;
-  --color-secondary: #373e47;
+  --color-white: #e6edf3;
+  --color-red: #da3633;
+  --color-orange: #c9510c;
+  --color-yellow: #d29922;
+  --color-blue: #4493f8;
+  --color-green: #238636;
+  --color-green-light: #16ab39;
+  --color-primary: var(--color-green);
+  --color-primary-hover: #29903b;
+  --color-primary-active: #2e9a40;
+  --color-primary-light-4: #0e4429;
+  --color-primary-light-2: #006d32;
+  --color-primary-dark-2: #26a641;
+  --color-primary-dark-4: #39d353;
+  --color-secondary: #30363d;
+  --color-secondary-alpha-60: #161b22;
+  --color-secondary-bg: #30363d;
   --border-radius: 6px;
+  --color-light-border: var(--color-secondary);
   --color-body: #0d1117;
-  --color-navbar: #161b22;
+  --color-card: var(--color-body);
+  --color-navbar: #010409;
   --color-footer: #161b22;
   --color-text-light: #a6aab5;
+  --color-text-light-1: #848d97;
   --color-text-light-2: #adbac7;
   --color-grey-light: var(--color-text-light);
   --color-text: #bbc0ca;
@@ -13,30 +31,60 @@
   --color-markup-code-block: #636e7b66;
   --color-light: #22272e;
   --color-button: #22272e;
+  --color-expand-button: var(--color-body);
   --color-input-background: #22272e;
-  --color-input-border-hover: #8e8c8c;
+  --color-input-border-hover: var(--color-secondary);
   --color-input-text: #adbac7;
   --color-box-header: #22272e;
   --color-active: #22272e;
-  --color-menu: #22272e;
+  --color-menu: #161b22;
   --color-caret: var(--color-text);
   --is-dark-theme: true;
-  --color-blue: #4796f9;
   --color-input-background: #22272e;
-  --color-primary-contrast: #adbac7;
+  --color-primary-contrast: #ffffff;
   --color-text-light-2: #a6aab5;
-  --color-box-body: #161b22;
+  --color-box-body: var(--color-body);
   --color-box-header: #161b22;
-  --color-green-light: #16ab39;
-  --color-nav-bg: #161b22;
-  --color-header-wrapper: #161b22;
-  --color-nav-hover-bg: #808080;
+  --color-nav-bg: #010409;
+  --color-header-wrapper: #010409;
+  --color-nav-hover-bg: rgba(177, 186, 196, 0.12);
+  --color-hover: #292e36;
+  --color-label-bg: rgba(56, 139, 253, 0.1);
+  --color-label-hover-bg: #1f6feb;
+  --color-label-text: var(--color-blue);
+  --color-error-bg: #b62324;
+  --color-error-border: #f8514966;
+  --color-error-text: var(--color-white);
+  --color-success-bg: #122117;
+  --color-success-border: #2ea04366;
+  --color-success-text: var(--color-green);
 
   /* 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` */
   --color-primary-light-3: #71798e;
-  --color-editor-line-highlight: #71798e;
-  --color-code-bg: var(--color-input-background);
+  --color-editor-line-highlight: var(--color-body);
+  --color-code-bg: var(--color-body);
+
+  --color-diff-removed-row-bg: rgba(248, 81, 73, 0.15);
+  --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-word-bg: rgba(46, 160, 67, 0.4);
+}
+
+.text.primary,
+.flex-item a:not(.label, .button):hover,
+.combo-markdown-editor .markdown-toolbar-button:hover {
+  color: var(--color-blue) !important;
+}
+.text.primary.svg {
+  color: var(--color-text) !important;
+}
+
+.page-content.dashboard,
+.page-content.explore,
+.page-content.repository:not(.new),
+.page-content.signin {
+  margin-top: 10px;
 }
 
 .ui.list .list > .item > .content,
@@ -51,19 +99,18 @@
 
 .ui.repository.list,
 .ui.user.list {
-  background: var(--color-box-body);
+  background: var(--color-box-header);
   padding: 1em;
   border-radius: 0.75em;
 }
 
-.ui.header .sub.header {
-  color: #636e7b;
+.ui.avatar:not(.org-avatar) {
+  border-radius: 50% !important;
+  box-shadow: 0 0 0 1px var(--color-secondary);
 }
 
-.ui .error.header {
-  border-color: var(--color-red) !important;
-  background-color: var(--color-red) !important;
-  color: #cdd9e5fff !important;
+.ui.header .sub.header {
+  color: #636e7b;
 }
 
 .ui.modal > .header {
@@ -88,28 +135,29 @@
   padding: 5px 10px;
 }
 
-.repository.file.list #repo-files-table tbody .svg.octicon-file-directory,
-.repository.file.list #repo-files-table tbody .svg.octicon-file-submodule {
-  color: #768390;
-}
-
 a,
 .ui.breadcrumb a {
-  /* color: var(--color-text); */
   color: var(--color-blue);
 }
+a[href="#"] {
+  color: var(--color-text);
+}
+a:hover,
+a.muted:hover,
+.ui.breadcrumb a:hover,
+.ui.floating.jump.select-label.dropdown:hover,
+.muted-links a:hover {
+  color: var(--color-blue);
+}
+a.text:hover,
+a.muted.text:hover,
+.ui.breadcrumb a.text:hover,
+.muted-links a:hover {
+  text-decoration: none;
+}
 
 .repo-title a {
-  color: var(--color-blue) !important;
-}
-
-.ui.table > thead > tr > th {
-  background: #636e7b1a;
-  color: #dbdbdb !important;
-}
-
-.repository.file.list #repo-files-table tr {
-  background: #22272e;
+  color: var(--color-white) !important;
 }
 
 .repo-icon {
@@ -118,6 +166,14 @@ a,
   margin-right: -0.05rem !important;
 }
 
+.interact-fg:hover {
+  color: var(--color-blue) !important;
+}
+
+.repository.file.list .file-actions .btn-octicon:hover {
+  color: var(--color-blue) !important;
+}
+
 .repository.file.list #file-buttons .ui.button {
   color: #cdd9e5 !important;
 }
@@ -152,34 +208,72 @@ a,
   box-shadow: inset 0 0 0 0px #808080 !important;
 }
 
+.ui.basic.red.buttons .button,
+.ui.basic.red.button,
+.ui.basic.red.buttons .button:focus,
+.ui.basic.red.button:focus {
+  color: #f85149;
+  background: var(--color-button);
+  border-color: var(--color-light-border);
+}
+.ui.basic.red.buttons .button:hover,
+.ui.basic.red.button:hover {
+  color: #ffffff;
+  background: #b62324;
+  border-color: #f0f6fc1a;
+}
+.ui.basic.red.buttons .button:active,
+.ui.basic.red.button:active {
+  color: #ffffff;
+  background: #d03533;
+  border-color: #f0f6fc1a;
+}
+
 .issue.list {
   list-style: none;
   margin-top: 1rem;
   background-color: #22272e;
   border-radius: 6px;
   padding: 3px 10px 3px 10px;
-  border: 1px solid #373e47;
+  border: 1px solid var(--color-secondary);
+}
+
+.issue-content-right {
+  border: 0 !important;
+  padding: 0 !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 > input.search {
+  padding: 0 8px !important;
+  min-height: 28px;
+}
+.issue-content-right .ui.button ~ .ui.button,
+.issue-content-right > form ~ .ui.button {
+  margin-top: .5rem !important;
 }
 
 .ui.menu .item {
   background-color: #22272e;
 }
 
-.ui.horizontal.segments > .segment {
-  background-color: #22272e;
-  border-radius: 6px;
+.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) {
+  border-radius: 0 0 var(--border-radius) var(--border-radius);
 }
 
 .ui.attached.header {
   border-radius: 6px;
 }
 
-.repository.file.list .repo-description {
-  color: #adbac7;
-}
-
-.commit-summary a.default-link {
-  color: #adbac7 !important;
+.ui.attached.table {
+  background-color: var(--color-body);
 }
 
 .markup h1,
@@ -211,39 +305,28 @@ a,
   color: var(--color-blue) !important;
 }
 
-.ui.menu.two.item .item {
-  border: 1px solid #373e47;
-  background: #161b22;
-}
-
-a,
-.push.news {
-  color: null;
-}
-
-.ui.header {
-  color: #a6aab5;
+#org-info a {
+  color: var(--color-white);
 }
 
 .repo-description {
-  color: #a6aab5 !important;
+  color: var(--color-white);
 }
 
-a.ui.label {
-  color: #adbac7 !important;
+.ui.label:not(.basic) {
+  border-radius: 2em;
+}
+
+.ui.label.sha {
+  color: var(--color-text);
+  background: unset !important;
   border-color: var(--color-secondary) !important;
+  border-radius: 0.375rem;
 }
 
-.ui.label {
-  border-color: var(--color-secondary) !important;
-}
-
-.ui.menu .item {
-  color: #adbac7;
-}
-
-.ui .sha.label {
-  padding: 6px 10px 6px;
+.ui.labels a.label:hover,
+a.ui.label:hover {
+  color: var(--color-white);
 }
 
 /* repo list dashboard */
@@ -251,51 +334,91 @@ a.ui.label {
   background-color: #22272e;
 }
 
-/* ssh and search repository fields */
-input,
-textarea,
-.ui.input > input,
-.ui.form input:not([type]),
-.ui.form select,
-.ui.form textarea,
-.ui.form input[type="date"],
-.ui.form input[type="datetime-local"],
-.ui.form input[type="email"],
-.ui.form input[type="file"],
-.ui.form input[type="number"],
-.ui.form input[type="password"],
-.ui.form input[type="search"],
-.ui.form input[type="tel"],
-.ui.form input[type="text"],
-.ui.form input[type="time"],
-.ui.form input[type="url"],
-.ui.selection.dropdown,
-.ui.checkbox label:before,
-.ui.checkbox input:checked ~ label:before,
-.ui.checkbox input:not([type="radio"]):indeterminate ~ label:before {
-  border-color: #373e47 !important;
-}
-
-/* hover repository rows */
-.repository.file.list #repo-files-table tr:hover {
-  background-color: var(--color-hover);
-}
-
 /* due date boxes */
 .repository .metas #deadlineForm input {
   border-color: var(--color-secondary);
 }
 
-/* border color dependencies block in issues */
-#new-dependency-drop-list.ui.selection.dropdown {
-  border-color: var(--color-secondary);
+/* default border radius */
+.ui.button,
+.ui.basic.buttons .button,
+.ui.basic.button,
+.ui.dropdown .menu,
+.ui.form input:not([type]),
+.ui.form input[type="date"],
+.ui.form input[type="datetime-local"],
+.ui.form input[type="email"],
+.ui.form input[type="number"],
+.ui.form input[type="password"],
+.ui.form input[type="search"],
+.ui.form input[type="tel"],
+.ui.form input[type="time"],
+.ui.form input[type="text"],
+.ui.form input[type="file"],
+.ui.form input[type="url"],
+.ui.form textarea,
+.ui.input textarea,
+.ui.label,
+.ui.menu,
+.ui.segment,
+.ui.segments,
+.ui.secondary.menu .dropdown.item>.menu,
+.ui.selection.dropdown,
+.ui.selection.dropdown .menu,
+.ui.table,
+.ui.text.menu .dropdown.item>.menu {
+  border-radius: var(--border-radius);
 }
 
-.page-content .ui.button {
-  border-color: var(--color-secondary);
+.ui.floating.dropdown>.menu {
+  border-radius: var(--border-radius) !important;
 }
 
-/* border color form fields settings page */
+/* no border radius between connected buttons */
+.ui.buttons .button {
+  border-radius: 0;
+}
+
+/* default left border radius */
+.ui.action.input > .dropdown:first-child,
+.ui.action.input > .button:first-child,
+.ui.action.input > .buttons:first-child > .button,
+.ui.compact.menu:not(.secondary) .item:first-child,
+.ui.horizontal.segments > .segment:first-child {
+  border-radius: var(--border-radius) 0 0 var(--border-radius);
+}
+
+/* default right border radius */
+.ui.action.input > .dropdown:last-child,
+.ui.action.input > .button:last-child,
+.ui.action.input > .buttons:last-child > .button,
+.ui.compact.menu:not(.secondary) .item:last-child,
+.ui.horizontal.segments > .segment:last-child {
+  border-radius: 0 var(--border-radius) var(--border-radius) 0;
+}
+
+/* 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;
+}
+
+/* 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);
+}
+
+.ui.table>thead>tr:first-child>th:first-child {
+    border-radius: var(--border-radius) 0 0;
+}
+.ui.table>thead>tr:first-child>th:last-child {
+    border-radius: 0 var(--border-radius) 0 0;
+}
+
+/* border color form fields */
 input,
 textarea,
 .ui.input > input,
@@ -320,20 +443,8 @@ textarea,
   border-color: var(--color-secondary);
 }
 
-/* background color of code display */
-.lines-code {
-  background-color: #22272e;
-}
-
-.code-diff-unified .add-code,
-.code-diff-unified .add-code td,
-.code-diff-split .add-code .lines-num-new,
-.code-diff-split .add-code .lines-type-marker-new,
-.code-diff-split .add-code .lines-code-new,
-.code-diff-split .del-code .add-code.lines-num-new,
-.code-diff-split .del-code .add-code.lines-type-marker-new,
-.code-diff-split .del-code .add-code.lines-code-new {
-  background: rgba(70, 149, 74, 0.15);
+.ui.input > input {
+  transition: none;
 }
 
 .tag-code,
@@ -341,21 +452,39 @@ textarea,
   background-color: var(--color-body);
 }
 
-/* green code color dark theme */
+/* code highlighting dark theme */
+.chroma .cm, /* block comments */
+.chroma .c1 /* line comments */ {
+  color: #8b949e;
+}
+
+/* strings */
+.chroma .s,
+.chroma .cpf {
+  color: #a5d6ff;
+}
+
 .chroma .s2 {
   color: #8ddb8c;
 }
 
-.chroma .k {
-  color: #f47067;
+/* keywords */
+.chroma .k,
+.chroma .kc,
+.chroma .kd,
+.chroma .kn,
+.chroma .kt {
+  color: #ff7b72;
 }
 
 .chroma .m {
   color: #6cb6ff;
 }
 
+/* method names */
+.chroma .na,
 .chroma .nf {
-  color: #96d0ff;
+  color: #d2a8ff;
 }
 
 .chroma .nb {
@@ -382,64 +511,131 @@ textarea,
   color: #c4cfcf;
 }
 
+.chroma .n, /* variable & referenced class names */
+.chroma .nc, /* class names */
+.chroma .nn /* import names */ {
+  color: #c9d1d9;
+}
+
+/* operators */
 .chroma .o {
-  color: #eb3243;
+  color: #c9d1d9;
 }
 
-.chroma .nc {
-  color: #16e9e9;
+.repository.file.list #repo-files-table thead tr th {
+  padding: 12px 12px 12px 20px;
 }
 
-.chroma .nn {
-  color: #16e9e9;
+.repository.file.list #repo-files-table tbody tr {
+  background: var(--color-body);
 }
 
-.chroma .s {
-  color: #8ddb8c;
-}
-
-/* border color repo files */
-.repository.file.list #repo-files-table td {
-  // border-bottom: 1px solid #373e47;
+.repository.file.list #repo-files-table tbody tr:hover {
+  background: var(--color-box-header);
 }
 
 /* text color repo files */
-.repository.file.list #repo-files-table td {
-  color: var(--color-text-light) !important;
-  background: #161b22;
+.repository.file.list #repo-files-table td.name a,
+.repository.file.list #repo-files-table td a:not(.muted) {
+  color: var(--color-white);
 }
 
-.repository.file.list #repo-files-table td a {
-  /* color: #7f8699 !important; */
-  color: var(--color-blue) !important;
+.repository.file.list #repo-files-table td a:hover {
+  color: var(--color-blue);
+}
+
+.repository #commits-table.ui.basic.striped.table tbody tr:nth-child(2n) {
+  background-color: var(--color-body) !important;
+}
+
+.repository #commits-table .author a {
+  color: var(--color-text);
 }
 
 /* gpg commit label  */
 .repository #commits-table td.sha .sha.label.isSigned.isVerified,
 .repository #repo-files-table .sha.label.isSigned.isVerified,
 .repository #rev-list .sha.label.isSigned.isVerified,
-.repository
-  .timeline-item.commits-list
-  .singular-commit
-  .sha.label.isSigned.isVerified {
+.repository .timeline-item.commits-list .singular-commit .sha.label.isSigned.isVerified {
   border: 1.5px solid #21ba45 !important;
   background: transparent;
   border-radius: 6px;
 }
 
-/* color of active tabular item, e.g. in PR view (conversations, commits, files changed) */
-.ui.tabular.menu .active.item,
-.ui.tabular.menu .active.item:hover {
-  background: var(--color-navbar);
-  border-bottom: 3px solid #f78166 !important;
-  border: 0px solid black;
-  color: #adbac7;
+.header-wrapper .ui.tabular.menu,
+.ui.secondary.menu {
+  gap: 0.5rem;
+}
+.header-wrapper .ui.tabular.menu {
+  min-height: 48px;
+  align-items: center;
+}
+.header-wrapper .ui.menu .item,
+.page-content > .ui.menu .item {
+  color: var(--color-white) !important;
+}
+.ui.menu .item .svg {
+  fill: var(--color-text-light-1);
+  margin-right: 0.5rem !important;
+}
+.header-wrapper .ui.tabular.menu:not(.new-menu) .item,
+.header-wrapper .ui.tabular.menu:not(.new-menu) .active.item,
+.ui.secondary.menu:not(.new-menu) .item
+.ui.secondary.menu:not(.new-menu) .active.item {
+  border: 0;
+  border-radius: var(--border-radius) !important;
+  align-items: center;
+  line-height: 30px;
+  padding: 0 8px;
+  margin-top: 0 !important;
+  margin-bottom: 0 !important;
+}
+.header-wrapper .ui.tabular.menu .item:hover,
+.ui.secondary.menu .item:hover {
+  background: var(--color-nav-hover-bg) !important;
+}
+.header-wrapper .ui.tabular.menu:not(.new-menu) .active.item {
+  background: unset;
+}
+.header-wrapper .ui.tabular.menu:not(.new-menu) .active.item::after {
+  background: #f78166;
+  bottom: calc(50% - 25px);
+  content: "";
+  height: 2px;
+  position: absolute;
+  right: 50%;
+  transform: translate(50%, -50%);
+  width: 100%;
+  z-index: 1;
+}
+.ui.secondary.pointing.menu .active.item,
+.ui.secondary.pointing.menu .active.item:hover {
+  border-color: #f78166;
+}
+.ui.menu.new-menu .item:last-child {
+  padding-right: 16px !important;
+}
+
+.ui.basic.label {
+  color: var(--color-text-light-1);
+  border-radius: 2em;
+  background: transparent;
+  font-weight: 400;
+  padding: 0 7px !important;
+  line-height: 18px;
+}
+.ui.menu .item > .label:not(.floating) {
+  padding: 4px 7px;
 }
 
 /* repo watch and fork counters */
-.ui.basic.labels:not(.tag):not(.image):not(.ribbon) .label,
-.ui.basic.label:not(.tag):not(.image):not(.ribbon) {
-  color: #adbac7;
+.repo-buttons .ui.labeled.button>.label,
+.repo-buttons .ui.labeled.button>.label:hover {
+  color: var(--color-white);
+  border-top-right-radius: var(--border-radius);
+  border-bottom-right-radius: var(--border-radius);
+  background: #21262d;
+  padding: 0 10px !important;
 }
 
 .repo-buttons .ui.labeled.button.disabled > .label {
@@ -462,17 +658,12 @@ textarea,
   box-shadow: 0 0 0 0px #c9ba9b inset, 0 0 #0000;
 }
 
-/* repo svg icons */
-.repository.view.issue .comment-list .timeline-item .badge .svg {
-  fill: #cdd9e5fff !important;
-}
-
 /* background emoji reactions */
 .repository .segment.reactions .ui.label.basic.blue {
   background-color: transparent;
 }
 
-.ui.positive.message {
+.ui.positive.message:not(.flash-success) {
   background-color: #22272e;
   color: #cdd9e5;
 }
@@ -482,23 +673,8 @@ textarea,
   box-shadow: 0 0 0 1px #347d39 inset, 0 0 #0000;
 }
 
-/* diff color deletion */
-.code-diff-unified .del-code,
-.code-diff-unified .del-code td,
-.code-diff-split .del-code .lines-num-old,
-.code-diff-split .del-code .lines-type-marker-old,
-.code-diff-split .del-code .lines-code-old {
-  background: rgba(229, 83, 75, 0.15);
-}
-
-/* diff color neutral */
-.lines-num,
-.lines-code {
-  background-color: var(--color-navbar);
-}
-
-.lines-type-marker {
-  background-color: var(--color-navbar);
+.diff-file-body .file-body.code-diff table tbody tr td {
+  line-height: 16px;
 }
 
 a.blob-excerpt {
@@ -511,30 +687,10 @@ a.blob-excerpt {
   background-color: #347d39;
 }
 
-/* bg color of PR comment form */
-.ui.form,
-.ui.form .field .dropdown,
-.ui.form .field .dropdown .menu > .item {
-  background-color: var(--color-navbar);
-}
-
 .comment-code-cloud {
   background-color: var(--color-navbar);
 }
 
-/* remove border of "new file" button */
-.ui.buttons .button:first-child {
-  border-left: 1px solid var(--color-markup-code-block);
-}
-
-/* border color of dropdown svg */
-.ui.form,
-.ui.form .field .dropdown,
-.ui.form .field .dropdown .menu > .item {
-  background-color: var(--color-border);
-  /* border: 0px solid black !important; */
-}
-
 /* hover font color */
 .ui.secondary.pointing.menu .active.item,
 .ui.secondary.pointing.menu .active.item:hover,
@@ -548,35 +704,26 @@ a.blob-excerpt {
 .ui.selection.active.dropdown:hover,
 .ui.selection.active.dropdown .menu,
 .ui.selection.active.dropdown:hover .menu {
-  border-color: #373e47;
+  border-color: var(--color-secondary);
 }
 
-/* user avatar background */
-.user.profile .ui.card #profile-avatar {
-  background: var(--color-navbar);
-}
 
-.ui.cards > .card > .content,
-.ui.card > .content {
-  background: var(--color-navbar);
+.ui.cards > .card,
+.ui.card,
+.ui.cards a.card:hover,
+a.ui.card:hover {
+  border: 0;
 }
-
-.user.profile .ui.card .extra.content ul li:not(:last-child) {
-  border-bottom: 1px solid var(--color-secondary);
-  background-color: var(--color-navbar);
+.ui.cards > .card > .extra, .ui.card > .extra {
+  border-top-color: var(--color-secondary) !important;
 }
-
-.user.profile .ui.card .extra.content ul li {
-  background-color: var(--color-navbar);
-}
-
-/* right border of profile search bar */
-.ui.action.input:not([class*="left action"]) > input {
-  border-right-color: var(--color-secondary);
+.ui.cards > .card > .extra a:not(.ui):hover,
+.ui.card > .extra a:not(.ui):hover {
+  color: var(--color-blue);
 }
 
 .ui.action.input:not([class*="left action"]) > input:focus {
-  border-right-color: var(--color-secondary);
+  border-right: none;
 }
 
 /* font color line numbers */
@@ -620,12 +767,8 @@ a.blob-excerpt {
 }
 
 /* PR timelines colors */
-.repository.view.issue .comment-list .timeline-item .badge .svg {
-  fill: black;
-}
-
 .repository.view.issue .comment-list .timeline-item .badge {
-  background-color: var(--color-navbar);
+  background-color: #21262d;
   color: var(--color-text);
   width: 30px;
   height: 30px;
@@ -638,27 +781,34 @@ a.blob-excerpt {
 }
 
 .repository.view.issue .comment-list .timeline:before {
-  background-color: #373e47;
+  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);
 }
 
-input {
-  caret-color: var(--color-text);
+.ui.top.attached.header.comment-header {
+    padding: 0 16px;
 }
 
-.removed-code {
-  background: #b70f22;
-  color: var(--color-text);
+.comment:target .header:before {
+  border-right-color: rgba(56, 139, 253, 0.4) !important;
+  box-shadow: none !important;
 }
-
-.added-code {
-  background: #0d8b2c;
-  color: var(--color-text);
+.comment:target .comment-container {
+  border-color: rgba(56, 139, 253, 0.4) !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;
 }
 
 /* review - pending label */
@@ -695,26 +845,18 @@ span.green .svg {
   color: --var(--color-text);
 }
 
-/* navbar font size */
-.ui.secondary.menu .item {
-  font-size: 13px;
-}
-
-#navbar .item {
-  margin: 0;
-  padding: 0.5em;
-  font-size: 14px;
-}
-
 .following.bar #navbar {
   width: 100vw;
-  border-bottom: 1px solid #373e47;
+  border-bottom: 1px solid var(--color-secondary);
   /* default 52px */
   min-height: 40px;
   padding: 0 0.5rem;
   background: var(--color-navbar);
 }
 
+* {
+  scrollbar-color: unset;
+}
 ::-webkit-scrollbar-thumb {
   box-shadow: inset 0 0 0 6px var(--color-navbar);
 }
@@ -726,37 +868,19 @@ span.green .svg {
   margin-top: -2px;
 }
 
-/* border colors of search fields, e.g. "find repository" on main page */
-input:hover,
-textarea:hover,
-.ui.input input:hover,
-.ui.form input:not([type]):hover,
-.ui.form select:hover,
-.ui.form textarea:hover,
-.ui.form input[type="date"]:hover,
-.ui.form input[type="datetime-local"]:hover,
-.ui.form input[type="email"]:hover,
-.ui.form input[type="file"]:hover,
-.ui.form input[type="number"]:hover,
-.ui.form input[type="password"]:hover,
-.ui.form input[type="search"]:hover,
-.ui.form input[type="tel"]:hover,
-.ui.form input[type="text"]:hover,
-.ui.form input[type="time"]:hover,
-.ui.form input[type="url"]:hover,
-.ui.selection.dropdown:hover,
-.ui.checkbox label:hover:before,
-.ui.checkbox label:active:before,
 .ui.radio.checkbox label:after,
 .ui.radio.checkbox input:focus ~ label:before,
 .ui.radio.checkbox input:checked ~ label:before {
   border-color: var(--color-secondary);
 }
 
-a:hover,
-a.muted:hover,
-.ui.breadcrumb a:hover {
-  color: var(--color-blue);
+.input > input ~ button,
+.input > input ~ .button {
+  border-left-width: 0 !important;
+}
+.input > input:focus ~ button,
+.input > input:focus ~ .button {
+    border-color: var(--color-blue) !important;
 }
 
 input:focus,
@@ -776,23 +900,26 @@ textarea:focus,
 .ui.form input[type="text"]:focus,
 .ui.form input[type="time"]:focus,
 .ui.form input[type="url"]:focus,
-.ui.selection.dropdown:focus,
+.ui.selection.dropdown:focus {
+  border-color: var(--color-blue);
+  border-radius: var(--border-radius);
+}
+
 .ui.checkbox input:focus ~ label:before,
+.ui.checkbox input:focus ~ label::before,
 .ui.checkbox input:not([type="radio"]):indeterminate:focus ~ label:before,
+.ui.checkbox input:not([type="radio"]):indeterminate:focus ~ label::before,
 .ui.checkbox input:checked:focus ~ label:before,
-.ui.radio.checkbox input:focus:checked ~ label:before {
-  border-color: ;
+.ui.checkbox input:checked:focus ~ label::before,
+.ui.radio.checkbox input:focus:checked ~ label:before,
+.ui.radio.checkbox input:focus:checked ~ label::before {
+  border-color: var(--color-blue);
 }
 
 .repo-icon {
   display: none;
 }
 
-/* reduce navbar bottom margin */
-.ui.ui.ui.container:not(.fluid) {
-  margin-bottom: -3px;
-}
-
 .ui.green.button {
   padding: 5px 16px;
   line-height: 20px;
@@ -806,14 +933,14 @@ textarea:focus,
   border-radius: 2em;
 }
 
-.ui.tabular.menu .active.item {
-  margin-bottom: 1px;
-}
-
-/* repository icon for directories */
+/* 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: #768390;
+  color: var(--color-text-light-1);
 }
 
 .ui.secondary.pointing.menu .item > .circular.label {
@@ -827,12 +954,7 @@ textarea:focus,
 
 .ui.primary.label,
 .ui.primary.labels .label {
-  background-color: #373e47 !important;
-}
-
-// timeline view icon color
-.repository.view.issue .comment-list .timeline-item .badge .svg {
-  fill: #cdd9e5 !important;
+  background-color: var(--color-secondary) !important;
 }
 
 /* borders -------------------------------------------------------------------*/
@@ -843,52 +965,10 @@ textarea:focus,
   border-width: initial;
 }
 
-// README border
-.ui.attached:not(.message) + .ui.attached.segment:not(.top) {
-  border-width: inherit;
-}
-
-.ui.top.attached.header {
-  border-width: inherit;
-  border: 1px solid #373e47;
-}
-
 .following.bar.light {
   border-bottom: 0px solid var(--color-secondary);
 }
 
-.ui.action.input:not([class*="left action"]) > input {
-  border-width: inherit;
-}
-
-.ui.action.input > .dropdown:last-child,
-.ui.action.input > .button:last-child,
-.ui.action.input > .buttons:last-child > .button {
-  border-width: inherit;
-}
-
-.ui.action.input:not([class*="left action"])
-  > .ui.dropdown.selection:not(:focus):not(:hover) {
-  border-width: inherit;
-}
-
-.repository #clone-panel #repo-clone-https,
-.repository #clone-panel #repo-clone-ssh {
-  border-width: inherit;
-}
-
-.ui.action.input > .dropdown:not(:first-child),
-.ui.action.input > .button:not(:first-child),
-.ui.action.input > .buttons:not(:first-child) > .button {
-  border-width: inherit;
-}
-
-.ui.segment,
-.ui.segments,
-.ui.attached.segment {
-  border-width: inherit;
-}
-
 .ui.table {
   border-width: inherit;
 }
@@ -897,60 +977,30 @@ footer {
   border-width: inherit;
 }
 
-.page-content .ui.button {
-  border-width: inherit;
-}
-
 .repo-buttons .ui.labeled.button > .label {
   border-width: inherit;
-  border: 1px solid #373e47 !important;
+  border: 1px solid var(--color-secondary) !important;
 }
 
 .repo-button-row .button {
-  height: unset;
-}
-
-.repository .repository-summary .segment.language-stats {
-  height: 14px;
-  border-radius: 6px;
+  min-height: 30px;
 }
 
 .ui.table[class*="single line"],
 .ui.table [class*="single line"] {
   white-space: nowrap;
-  border: 1px solid #373e47;
+  border: 1px solid var(--color-secondary);
 }
 
-.ui.tiny.input {
-  font-size: 0.85714286em;
-  border: 1px solid #373e47;
-  border-radius: 6px;
-}
-
-.ui.fluid.input {
-  border: 1px solid #373e47 !important;
-  border-radius: 6px;
-}
-
-.repository.view.issue .comment-list .comment > .content > div:last-child {
-  border: 0px solid #373e47 !important;
-}
 .ui.basic.secondary.buttons .button,
 .ui.basic.secondary.button {
   color: var(--color-text) !important;
-  border: 1px solid #373e47 !important;
-}
-.ui.small.buttons .dropdown,
-.ui.small.buttons .dropdown .menu > .item,
-.ui.small.buttons .button,
-.ui.small.buttons .or,
-.ui.ui.ui.ui.small.button {
-  border: 1px solid #373e47 !important;
+  border: 1px solid var(--color-secondary) !important;
 }
 
 .ui.table > tr > td,
 .ui.table > tbody > tr > td {
-  border-top-color: #373e47;
+  border-top-color: var(--color-secondary);
 }
 
 .ui.basic.primary.button,
@@ -959,19 +1009,44 @@ footer {
   font-weight: 500 !important;
 }
 
-.feeds .list ul li .repo-list-link {
-  background: #161b22;
+.ui.labeled.button.disabled>.button,
+.ui.basic.buttons .button,
+.ui.basic.button,
+.ui.basic.buttons .button:focus,
+.ui.basic.button:focus {
+  color: var(--color-text);
 }
-.ui.attached:not(.message) + .ui.attached.segment:not(.top) {
-  border: 1px solid #373e47;
+
+.ui.vertical.menu {
+  background: var(--color-body);
+  border: 0;
+}
+.ui.vertical.menu .header.item {
+  font-weight: 600;
+  background: unset;
+}
+.ui.vertical.menu .menu .item:hover {
+background: var(--color-hover);
 }
-.ui.menu .active.item,
-.ui.menu .active.item:hover,
 .ui.vertical.menu .active.item,
 .ui.vertical.menu .active.item:hover {
-  background: #161b22;
+  background: #b1bac414 !important;
   font-weight: 500;
-  color: #adbac7;
+}
+.ui.vertical.menu .item,
+.ui.vertical.menu .item > summary {
+  background: unset;
+  padding: 8px;
+  color: var(--color-white) !important;
+}
+.ui.vertical.menu .item,
+.ui.vertical.menu .item.active,
+.ui.vertical.menu .item:hover,
+.ui.vertical.menu .item > summary {
+  border-radius: 6px;
+}
+.ui.vertical.menu .item::before {
+  background: unset;
 }
 .ui.primary.labels .label,
 .ui.ui.ui.primary.label {
@@ -980,18 +1055,6 @@ footer {
 .issue.list a:not(.label):hover {
   color: var(--color-blue) !important;
 }
-.ui.segment,
-.ui.segments,
-.ui.attached.segment {
-  border: 1px solid #373e47 !important;
-}
-.repository.view.issue .comment-list .comment .comment-container {
-  border: 1px solid #373e47;
-  border-radius: 0px;
-}
-.repository.view.issue .comment-list .comment > .content > div:first-child {
-  border-bottom: 1px solid #373e47 !important;
-}
 .tag-code,
 .tag-code td,
 .tag-code .blob-excerpt {
@@ -1004,15 +1067,6 @@ footer {
   color: #cdd9e5;
 }
 
-.ui.basic.red.buttons .button,
-.ui.basic.red.button {
-  color: var(--color-red);
-  border: 1px solid var(--color-red);
-  border-radius: 16px;
-  padding: 5px 16px;
-  line-height: 20px;
-}
-
 #navbar a.item .notification_count {
   color: var(--color-text);
 }
@@ -1024,8 +1078,7 @@ footer {
 
 .ui.secondary.menu .active.item,
 .ui.secondary.menu .active.item:hover {
-  color: #e3e3e3;
-  background-color: var(--color-nav-bg);
+  color: var(--color-white) !important;
 }
 
 // list in Pull requests view