release v3.0

This commit is contained in:
pat-s 2022-08-22 12:55:26 +02:00
parent 1bd187680f
commit aff576e893
No known key found for this signature in database
GPG key ID: 3C6318841EF78925
8 changed files with 1626 additions and 40 deletions

View file

@ -1,10 +1,12 @@
# gitea-github-theme # gitea-github-theme
Opinionated GitHub-based light and dark themes for Gitea
Created and tested with Gitea v1.15. **Opinionated** GitHub-based light and dark themes for Gitea including an automatic theme switch option.
Created and tested with Gitea v1.15 - 1.17.
The theme might work with future versions though Gitea devs might change some CSS classes in the meantime and things might potentially look odd - just try yourself :) The theme might work with future versions though Gitea devs might change some CSS classes in the meantime and things might potentially look odd - just try yourself :)
I might update the theme over time to fix oversights and other issues - no guarantee though. I might update the theme over time to fix oversights and other issues - no guarantee though.
## Installation ## Installation
1. If you do not have admin access to a Gitea instance, you can use the [Stylus](https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne/related) browser extension and use the CSS provided in this repo for the Gitea URL 1. If you do not have admin access to a Gitea instance, you can use the [Stylus](https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne/related) browser extension and use the CSS provided in this repo for the Gitea URL
@ -14,16 +16,67 @@ I might update the theme over time to fix oversights and other issues - no guara
3. Now users can select this theme in their settings under "account" 3. Now users can select this theme in their settings under "account"
4. (optional) If you want to make this theme the default of your instance, set it in `DEFAULT_THEME` in `app.ini` 4. (optional) If you want to make this theme the default of your instance, set it in `DEFAULT_THEME` in `app.ini`
## Using automatic theme switching based on system preference
To use automatic theme switching, add `theme-github-auto.css` into your respective `themes` folder as described above.
This file contains both light and dark styles and selects the respective one based on the system preference selected by the user via the `@media (prefers-color-scheme:` CSS selector (tested on macOS).
For some reasons using `@imports` does not work and hence the file contains the c/p content of both the light and dark themes together.
If this is somehow possible and I did not managed to get it configured, please let me know!
## Changes to default Gitea theme ## Changes to default Gitea theme
- Aligned primary green, grey, red and blue colors with GitHub - Aligned primary green, grey, red and blue colors with GitHub
- Aligned `border-radius` with GitHub - Aligned `border-radius` with GitHub
- Related theme by removing a lot of hover colors and dominant button background-colors - Related theme by removing a lot of hover colors and dominant button background-colors
- Aligned markup background to GitHub's value - Aligned markup background to GitHub's value
- Decreased navbar height and font size
- Many small overrides of colors and font-sizes
## Helm chart instructions
To use custom themes with the [Gitea helm chart](https://gitea.com/gitea/helm-chart):
1. Create a secret containing the CSS files (here's an example via `terraform`, plain k8s secrets will also work)
```hcl
resource "kubernetes_secret" "gitea-themes" {
metadata {
name = "gitea-themes"
namespace = "gitea"
}
data = {
"theme-github.css" = "${file("files/gitea/gitea-github-theme-light.css")}"
"theme-github-dark.css" = "${file("files/gitea/gitea-github-theme-dark.css")}"
"theme-github-auto.css" = "${file("files/gitea/gitea-github-theme-auto.css")}"
}
type = "Opaque"
}
```
2. Mount the secret via `extraVolumes` in `values.yaml`:
```yml
extraVolumes:
- name: gitea-themes
secret:
secretName: gitea-themes
```
3. Add the theme options into the config in `values.yaml`:
```yml
gitea:
config:
ui:
DEFAULT_THEME: github-auto
THEMES: auto,gitea,arc-green,github,github-dark,github-auto
```
## Screenshots ## Screenshots
| | | ![](figs/screenshot1.png)
| :----------------------------: | :----------------------------: |
| ![](figs/screenshot1.png) | ![](figs/screenshot2.png) | ![](figs/screenshot-dark1.png)
| ![](figs/screenshot-dark1.png) | ![](figs/screenshot-dark2.png) |

Binary file not shown.

Before

Width:  |  Height:  |  Size: 230 KiB

After

Width:  |  Height:  |  Size: 185 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 116 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 97 KiB

After

Width:  |  Height:  |  Size: 175 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 93 KiB

1186
theme-github-auto.css Normal file

File diff suppressed because it is too large Load diff

View file

@ -1,5 +1,6 @@
:root { :root {
--color-primary: #347d39; --color-primary: #347d39;
--color-secondary: #535865;
--border-radius: 6px; --border-radius: 6px;
--color-body: #373e47; --color-body: #373e47;
--color-navbar: #22272e; --color-navbar: #22272e;
@ -12,14 +13,21 @@
--color-light: #22272e; --color-light: #22272e;
--color-button: #22272e; --color-button: #22272e;
--color-input-background: #22272e; --color-input-background: #22272e;
--color-input-border-hover: #8e8c8c;
--color-input-text: #adbac7; --color-input-text: #adbac7;
--color-box-header: #22272e; --color-box-header: #22272e;
--color-active: #22272e; --color-active: #22272e;
--color-menu: #22272e; --color-menu: #22272e;
--color-secondary: #454a57;
--color-caret: var(--color-text); --color-caret: var(--color-text);
/* allows gitea to detect dark themes and changes the monaco code editor colors to dark ones */
--is-dark-theme: true; --is-dark-theme: true;
--color-blue: #539bf5;
--color-input-background: #22272e;
/* 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);
} }
.ui.list .list > .item > .content, .ui.list .list > .item > .content,
@ -66,28 +74,33 @@
.ui.green.buttons .button, .ui.green.buttons .button,
.ui.green.button { .ui.green.button {
background-color: #347d39; background-color: #347d39;
color: #fff !important; color: #ffffffe6 !important;
} }
.repository.file.list #repo-files-table tbody .svg.octicon-file-directory, .repository.file.list #repo-files-table tbody .svg.octicon-file-directory,
.repository.file.list #repo-files-table tbody .svg.octicon-file-submodule { .repository.file.list #repo-files-table tbody .svg.octicon-file-submodule {
color: #768390; color: #768390;
} }
a, a,
.ui.breadcrumb a { .ui.breadcrumb a {
/* color: var(--color-text); */ /* color: var(--color-text); */
color: #539bf5; color: var(--color-blue);
} }
.repo-title a { .repo-title a {
color: #539bf5 !important; color: var(--color-blue) !important;
} }
.ui.table > thead > tr > th { .ui.table > thead > tr > th {
background: #636e7b1a; background: #636e7b1a;
color: #dbdbdb !important; color: #dbdbdb !important;
} }
.repository.file.list #repo-files-table tr { .repository.file.list #repo-files-table tr {
background: #22272e; background: #22272e;
} }
.repo-icon { .repo-icon {
display: inline-block; display: inline-block;
transform: scale(0.75); transform: scale(0.75);
@ -95,7 +108,7 @@ a,
} }
.repository.file.list #file-buttons .ui.button { .repository.file.list #file-buttons .ui.button {
color: #fff !important; color: #ffffffe6 !important;
} }
.ui.basic.green.button, .ui.basic.green.button,
@ -106,24 +119,28 @@ a,
box-shadow: inset 0 0 0 1px rgba(34, 36, 38, 0.15) !important; box-shadow: inset 0 0 0 1px rgba(34, 36, 38, 0.15) !important;
color: #dbdbdb !important; color: #dbdbdb !important;
} }
.ui.basic.green.button:focus, .ui.basic.green.button:focus,
.ui.basic.green.buttons .button:focus, .ui.basic.green.buttons .button:focus,
.ui.basic.primary.button:focus, .ui.basic.primary.button:focus,
.ui.basic.primary.buttons .button:focus { .ui.basic.primary.buttons .button:focus {
box-shadow: inset 0 0 0 0px #808080 !important; box-shadow: inset 0 0 0 0px #808080 !important;
} }
.ui.basic.green.button:hover, .ui.basic.green.button:hover,
.ui.basic.green.buttons .button:hover, .ui.basic.green.buttons .button:hover,
.ui.basic.primary.button:hover, .ui.basic.primary.button:hover,
.ui.basic.primary.buttons .button:hover { .ui.basic.primary.buttons .button:hover {
background-color: #22272e !important; background-color: #22272e !important;
} }
.ui.basic.green.button:hover, .ui.basic.green.button:hover,
.ui.basic.green.buttons .button:hover, .ui.basic.green.buttons .button:hover,
.ui.basic.primary.button:hover, .ui.basic.primary.button:hover,
.ui.basic.primary.buttons .button:hover { .ui.basic.primary.buttons .button:hover {
box-shadow: inset 0 0 0 0px #808080 !important; box-shadow: inset 0 0 0 0px #808080 !important;
} }
.issue.list { .issue.list {
list-style: none; list-style: none;
margin-top: 1rem; margin-top: 1rem;
@ -131,22 +148,28 @@ a,
border-radius: 6px; border-radius: 6px;
padding: 3px 10px 3px 10px; padding: 3px 10px 3px 10px;
} }
.ui.menu .item { .ui.menu .item {
background-color: #22272e; background-color: #22272e;
} }
.ui.horizontal.segments > .segment { .ui.horizontal.segments > .segment {
background-color: #22272e; background-color: #22272e;
border-radius: 6px; border-radius: 6px;
} }
.ui.attached.header { .ui.attached.header {
border-radius: 6px; border-radius: 6px;
} }
.repository.file.list .repo-description { .repository.file.list .repo-description {
color: #adbac7; color: #adbac7;
} }
.commit-summary a.default-link { .commit-summary a.default-link {
color: #adbac7 !important; color: #adbac7 !important;
} }
.markup h1, .markup h1,
.markup h2, .markup h2,
.markup h3, .markup h3,
@ -155,10 +178,12 @@ a,
.markup h6 { .markup h6 {
color: #adbac7; color: #adbac7;
} }
.markup code, .markup code,
.markup tt { .markup tt {
color: #adbac7; color: #adbac7;
} }
.markup p, .markup p,
.markup blockquote, .markup blockquote,
.markup details, .markup details,
@ -169,32 +194,41 @@ a,
.markup pre { .markup pre {
color: #adbac7; color: #adbac7;
} }
.repo-list-link { .repo-list-link {
color: #539bf5 !important; color: var(--color-blue) !important;
} }
.ui.menu.two.item .item { .ui.menu.two.item .item {
border: 1px solid var(--color-secondary); border: 1px solid var(--color-secondary);
} }
a, a,
.push.news { .push.news {
color: null; color: null;
} }
.ui.header { .ui.header {
color: #a6aab5; color: #a6aab5;
} }
.repo-description { .repo-description {
color: #a6aab5 !important; color: #a6aab5 !important;
} }
a.ui.label { a.ui.label {
/* color: #adbac7 !important; */ /* color: #adbac7 !important; */
border-color: var(--color-secondary) !important; border-color: var(--color-secondary) !important;
} }
.ui.label { .ui.label {
border-color: var(--color-secondary) !important; border-color: var(--color-secondary) !important;
} }
.ui.menu .item { .ui.menu .item {
color: #adbac7; color: #adbac7;
} }
.ui .sha.label { .ui .sha.label {
padding: 6px 10px 6px; padding: 6px 10px 6px;
} }
@ -273,15 +307,11 @@ textarea,
border-color: var(--color-secondary); border-color: var(--color-secondary);
} }
/* right border of "find repository" field */
.ui.action.input:not([class*="left action"]) > input {
border-right-color: var(--color-light);
}
/* background color of code display */ /* background color of code display */
.lines-code { .lines-code {
background-color: #22272e; background-color: #22272e;
} }
.code-diff-unified .add-code, .code-diff-unified .add-code,
.code-diff-unified .add-code td, .code-diff-unified .add-code td,
.code-diff-split .add-code .lines-num-new, .code-diff-split .add-code .lines-num-new,
@ -292,6 +322,7 @@ textarea,
.code-diff-split .del-code .add-code.lines-code-new { .code-diff-split .del-code .add-code.lines-code-new {
background: #224035; background: #224035;
} }
.tag-code, .tag-code,
.tag-code td { .tag-code td {
background-color: var(--color-body); background-color: var(--color-body);
@ -315,8 +346,9 @@ textarea,
} }
.chroma .nb { .chroma .nb {
color: #539bf5; color: var(--color-blue);
} }
.chroma .nx { .chroma .nx {
color: var(--color-text); color: var(--color-text);
} }
@ -324,24 +356,31 @@ textarea,
.chroma .nv { .chroma .nv {
color: #08dddd; color: #08dddd;
} }
.chroma .si { .chroma .si {
color: #8ddb8c; color: #8ddb8c;
} }
.chroma .nt { .chroma .nt {
color: #50eb75; color: #50eb75;
} }
.chroma .nd { .chroma .nd {
color: #c4cfcf; color: #c4cfcf;
} }
.chroma .o { .chroma .o {
color: #eb3243; color: #eb3243;
} }
.chroma .nc { .chroma .nc {
color: #16e9e9; color: #16e9e9;
} }
.chroma .nn { .chroma .nn {
color: #16e9e9; color: #16e9e9;
} }
.chroma .s { .chroma .s {
color: #8ddb8c; color: #8ddb8c;
} }
@ -357,7 +396,8 @@ textarea,
} }
.repository.file.list #repo-files-table td a { .repository.file.list #repo-files-table td a {
color: #7f8699 !important; /* color: #7f8699 !important; */
color: var(--color-blue) !important;
} }
/* gpg commit label */ /* gpg commit label */
@ -384,6 +424,7 @@ textarea,
.ui.basic.label:not(.tag):not(.image):not(.ribbon) { .ui.basic.label:not(.tag):not(.image):not(.ribbon) {
color: #adbac7; color: #adbac7;
} }
.repo-buttons .ui.labeled.button.disabled > .label { .repo-buttons .ui.labeled.button.disabled > .label {
color: #adbac7; color: #adbac7;
} }
@ -393,10 +434,12 @@ textarea,
background-color: #22272e; background-color: #22272e;
color: var(--color-text); color: var(--color-text);
} }
.ui.warning.message, .ui.warning.message,
.ui.attached.warning.message { .ui.attached.warning.message {
box-shadow: null; box-shadow: null;
} }
.ui.warning.message, .ui.warning.message,
.ui.attached.warning.message { .ui.attached.warning.message {
box-shadow: 0 0 0 0px #c9ba9b inset, 0 0 #0000; box-shadow: 0 0 0 0px #c9ba9b inset, 0 0 #0000;
@ -414,11 +457,12 @@ textarea,
.ui.positive.message { .ui.positive.message {
background-color: #22272e; background-color: #22272e;
color: #fff; color: #ffffffe6;
} }
.ui.positive.message, .ui.positive.message,
.ui.attached.positive.message { .ui.attached.positive.message {
box-shadow: 0 0 0 1px #2c662d inset, 0 0 #0000; box-shadow: 0 0 0 1px #347d39 inset, 0 0 #0000;
} }
/* diff color deletion */ /* diff color deletion */
@ -439,6 +483,7 @@ textarea,
.lines-type-marker { .lines-type-marker {
background-color: var(--color-navbar); background-color: var(--color-navbar);
} }
a.blob-excerpt { a.blob-excerpt {
background: var(--color-body); background: var(--color-body);
} }
@ -455,6 +500,7 @@ a.blob-excerpt {
.ui.form .field .dropdown .menu > .item { .ui.form .field .dropdown .menu > .item {
background-color: var(--color-navbar); background-color: var(--color-navbar);
} }
.comment-code-cloud { .comment-code-cloud {
background-color: var(--color-navbar); background-color: var(--color-navbar);
} }
@ -484,21 +530,28 @@ a.blob-excerpt {
.user.profile .ui.card #profile-avatar { .user.profile .ui.card #profile-avatar {
background: var(--color-navbar); background: var(--color-navbar);
} }
.ui.cards > .card > .content, .ui.cards > .card > .content,
.ui.card > .content { .ui.card > .content {
background: var(--color-navbar); background: var(--color-navbar);
} }
.user.profile .ui.card .extra.content ul li:not(:last-child) { .user.profile .ui.card .extra.content ul li:not(:last-child) {
border-bottom: 1px solid var(--color-secondary); border-bottom: 1px solid var(--color-secondary);
background-color: var(--color-navbar); background-color: var(--color-navbar);
} }
.user.profile .ui.card .extra.content ul li { .user.profile .ui.card .extra.content ul li {
background-color: var(--color-navbar); background-color: var(--color-navbar);
} }
/* right border of profile search bar */ /* right border of profile search bar */
.ui.action.input:not([class*="left action"]) > input { .ui.action.input:not([class*="left action"]) > input {
border-right-color: var(--color-text); border-right-color: var(--color-secondary);
}
.ui.action.input:not([class*="left action"]) > input:focus {
border-right-color: var(--color-secondary);
} }
/* font color line numbers */ /* font color line numbers */
@ -519,14 +572,17 @@ a.blob-excerpt {
.ui .info.segment.top { .ui .info.segment.top {
background-color: var(--color-navbar) !important; background-color: var(--color-navbar) !important;
} }
.repository .ui.attached.isSigned.isVerified.top, .repository .ui.attached.isSigned.isVerified.top,
.repository .ui.attached.isSigned.isVerified.message { .repository .ui.attached.isSigned.isVerified.message {
border-top: 0px solid var(--color-text); border-top: 0px solid var(--color-text);
} }
.repository .ui.attached.isSigned.isVerified { .repository .ui.attached.isSigned.isVerified {
border-left: 0px solid var(--color-text); border-left: 0px solid var(--color-text);
border-right: 0px solid var(--color-text); border-right: 0px solid var(--color-text);
} }
.repository .ui.attached.isSigned.isVerified:last-child, .repository .ui.attached.isSigned.isVerified:last-child,
.repository .ui.attached.isSigned.isVerified.bottom { .repository .ui.attached.isSigned.isVerified.bottom {
border-bottom: 0px solid #a3c293; border-bottom: 0px solid #a3c293;
@ -542,6 +598,7 @@ a.blob-excerpt {
.repository.view.issue .comment-list .timeline-item .badge .svg { .repository.view.issue .comment-list .timeline-item .badge .svg {
fill: black; fill: black;
} }
.repository.view.issue .comment-list .timeline-item .badge { .repository.view.issue .comment-list .timeline-item .badge {
background-color: var(--color-navbar); background-color: var(--color-navbar);
color: var(--color-text); color: var(--color-text);
@ -549,13 +606,16 @@ a.blob-excerpt {
height: 30px; height: 30px;
margin-left: -31px; margin-left: -31px;
} }
.repository.view.issue .comment-list .timeline-item .badge.badge-commit { .repository.view.issue .comment-list .timeline-item .badge.badge-commit {
border-color: var(--color-navbar); border-color: var(--color-navbar);
background: var(--color-navbar); background: var(--color-navbar);
} }
.repository.view.issue .comment-list .timeline:before { .repository.view.issue .comment-list .timeline:before {
background-color: var(--color-secondary); background-color: var(--color-secondary);
} }
.repository.view.issue .comment-list .timeline-item .badge .svg { .repository.view.issue .comment-list .timeline-item .badge .svg {
width: 20px; width: 20px;
height: 20px; height: 20px;
@ -570,6 +630,7 @@ input {
background: #b70f22; background: #b70f22;
color: var(--color-text); color: var(--color-text);
} }
.added-code { .added-code {
background: #0d8b2c; background: #0d8b2c;
color: var(--color-text); color: var(--color-text);
@ -586,9 +647,11 @@ input {
.bg-green { .bg-green {
background: var(--color-primary) !important; background: var(--color-primary) !important;
} }
i.green.icon.icon.icon.icon { i.green.icon.icon.icon.icon {
color: var(--color-primary); color: var(--color-primary);
} }
span.green .svg { span.green .svg {
color: var(--color-primary); color: var(--color-primary);
} }
@ -599,9 +662,141 @@ span.green .svg {
border-radius: 6px; border-radius: 6px;
background: #000000 !important; background: #000000 !important;
} }
.ui.ui.ui.ui.table tr.active, .ui.ui.ui.ui.table tr.active,
.ui.ui.table td.active { .ui.ui.table td.active {
box-shadow: 0 0 #000000de inset; box-shadow: 0 0 #000000de inset;
background: #e0e0e0; background: #e0e0e0;
color: --var(--color-text); 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;
/* default 52px */
min-height: 40px;
padding: 0 0.5rem;
}
::-webkit-scrollbar-thumb {
box-shadow: inset 0 0 0 6px var(--color-navbar);
}
::-webkit-scrollbar-thumb:hover {
box-shadow: inset 0 0 0 6px var(--color-text);
}
.following.bar #navbar .brand {
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:focus,
textarea:focus,
.ui.input input:focus,
.ui.form input:not([type]):focus,
.ui.form select:focus,
.ui.form textarea:focus,
.ui.form input[type="date"]:focus,
.ui.form input[type="datetime-local"]:focus,
.ui.form input[type="email"]:focus,
.ui.form input[type="file"]:focus,
.ui.form input[type="number"]:focus,
.ui.form input[type="password"]:focus,
.ui.form input[type="search"]:focus,
.ui.form input[type="tel"]:focus,
.ui.form input[type="text"]:focus,
.ui.form input[type="time"]:focus,
.ui.form input[type="url"]:focus,
.ui.selection.dropdown:focus,
.ui.checkbox input: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: var(--color-secondary);
}
.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;
}
.ui.green.labels .label,
.ui.ui.ui.green.label {
padding: 5px 16px;
line-height: 20px;
}
.ui.tabular.menu .active.item {
margin-bottom: 2px;
}
/* repository icon for directories */
.repository.file.list #repo-files-table tbody .svg.octicon-file-directory-fill,
.repository.file.list #repo-files-table tbody .svg.octicon-file-submodule {
color: #768390;
}
.ui.secondary.pointing.menu .item > .circular.label {
line-height: 10px;
}
.ui.grey.labels .label,
.ui.ui.ui.grey.label {
line-height: 10px;
}
.ui.primary.label,
.ui.primary.labels .label {
background-color: #768390 !important;
}

View file

@ -6,6 +6,7 @@
--color-markup-code-block: #f6f8fa; --color-markup-code-block: #f6f8fa;
--color-hover: none; --color-hover: none;
--color-purple: #8250df; --color-purple: #8250df;
--color-green: #1a7f37;
} }
.ui.label { .ui.label {
padding: 0.3em 0.5em; padding: 0.3em 0.5em;
@ -36,12 +37,12 @@
} }
.ui.green.buttons .button, .ui.green.buttons .button,
.ui.green.button { .ui.green.button {
background-color: #2da44e; background-color: #1a7f37;
color: #fff !important; color: #fff !important;
} }
.ui.green.labels .label, .ui.green.labels .label,
.ui.ui.ui.green.label { .ui.ui.ui.green.label {
background-color: #2da44e; background-color: #1a7f37;
color: #fff !important; color: #fff !important;
} }
.ui.label { .ui.label {
@ -59,10 +60,6 @@
.repository.file.list #repo-files-table tbody .svg.octicon-file-submodule { .repository.file.list #repo-files-table tbody .svg.octicon-file-submodule {
color: #54aeff; color: #54aeff;
} }
a,
.ui.breadcrumb a {
color: var(--color-text) !important;
}
.repo-title a { .repo-title a {
color: var(--color-primary) !important; color: var(--color-primary) !important;
} }
@ -135,6 +132,7 @@ a.muted:hover,
.ui.basic.red.buttons .button, .ui.basic.red.buttons .button,
.ui.basic.red.button { .ui.basic.red.button {
color: #cf222e !important; color: #cf222e !important;
font-weight: 500;
} }
* { * {
scrollbar-width: thin; scrollbar-width: thin;
@ -166,27 +164,40 @@ a.ui.label {
} }
.ui.basic.green.buttons .button, .ui.basic.green.buttons .button,
.ui.basic.green.button { .ui.basic.green.button {
color: #2da44e !important; color: #1a7f37 !important;
} }
.ui.basic.labels .label, .ui.basic.labels .label,
.ui.basic.label { .ui.basic.label {
color: var(--color-text) !important; color: var(--color-text) !important;
} }
.repository #commits-table td.sha .sha.label.isSigned.isVerified .detail.icon, .repository #repo-files-table .sha.label.isSigned.isVerified .detail.icon, .repository #rev-list .sha.label.isSigned.isVerified .detail.icon, .repository .timeline-item.commits-list .singular-commit .sha.label.isSigned.isVerified .detail.icon { .repository #commits-table td.sha .sha.label.isSigned.isVerified .detail.icon,
border-left: 1px solid #2da44e; .repository #repo-files-table .sha.label.isSigned.isVerified .detail.icon,
color: #2da44e; .repository #rev-list .sha.label.isSigned.isVerified .detail.icon,
.repository
.timeline-item.commits-list
.singular-commit
.sha.label.isSigned.isVerified
.detail.icon {
border-left: 1px solid #1a7f37;
color: #1a7f37;
} }
.repository.view.issue .comment-list .timeline-item.commits-list .singular-commit .shabox .sha.label.isSigned.isVerified { .repository.view.issue
border: 1px solid #2da44e; .comment-list
.timeline-item.commits-list
.singular-commit
.shabox
.sha.label.isSigned.isVerified {
border: 1px solid #1a7f37;
} }
.ui.labeled.icon.buttons>.button>.icon, .ui.labeled.icon.button>.icon { .ui.labeled.icon.buttons > .button > .icon,
.ui.labeled.icon.button > .icon {
border-right: 1px solid var(--color-secondary); border-right: 1px solid var(--color-secondary);
} }
.ui.buttons:not(.basic):not(.inverted)>.button:not(.basic):not(.inverted) { .ui.buttons:not(.basic):not(.inverted) > .button:not(.basic):not(.inverted) {
border-left: 1px solid var(--color-secondary); border-left: 1px solid var(--color-secondary);
} }
@ -194,10 +205,12 @@ a.ui.label {
.repository .ui.attached.isSigned.isVerified.message .ui.text { .repository .ui.attached.isSigned.isVerified.message .ui.text {
color: black; color: black;
} }
.repository .ui.attached.isSigned.isVerified:last-child, .repository .ui.attached.isSigned.isVerified.bottom { .repository .ui.attached.isSigned.isVerified:last-child,
.repository .ui.attached.isSigned.isVerified.bottom {
border-bottom: 1px solid #21ba45; border-bottom: 1px solid #21ba45;
} }
.repository .ui.attached.isSigned.isVerified.top, .repository .ui.attached.isSigned.isVerified.message { .repository .ui.attached.isSigned.isVerified.top,
.repository .ui.attached.isSigned.isVerified.message {
border-top: 1px solid var(--color-secondary); border-top: 1px solid var(--color-secondary);
} }
.repository .ui.attached.isSigned.isVerified { .repository .ui.attached.isSigned.isVerified {
@ -212,5 +225,144 @@ a.ui.label {
/* bg color of commit info box */ /* bg color of commit info box */
.ui .info.segment.top { .ui .info.segment.top {
background-color: var(--color-navbar)!important; background-color: var(--color-navbar) !important;
}
.repo-icon {
display: none;
}
/* navbar font size */
.ui.secondary.menu .item {
font-size: 13px;
}
#navbar .item {
margin: 0;
padding: 0.5em;
font-size: 14px;
color: black !important;
}
.following.bar #navbar {
width: 100vw;
/* default 52px */
min-height: 40px;
padding: 0 0.5rem;
}
::-webkit-scrollbar-thumb {
box-shadow: inset 0 0 0 6px var(--color-navbar);
}
::-webkit-scrollbar-thumb:hover {
box-shadow: inset 0 0 0 6px var(--color-text);
}
.following.bar #navbar .brand {
margin-top: -2px;
}
/* reduce navbar bottom margin */
.ui.ui.ui.container:not(.fluid) {
margin-bottom: -3px;
}
/* Link color for repo breadcrumbs */
a,
.ui.breadcrumb a {
color: var(--color-primary) !important;
}
/* color for repo menu bar to overwrite link color */
.ui.tabular.menu .item {
color: var(--color-text) !important;
}
.repository .ui.segment.sub-menu .list .item a {
color: var(--color-text) !important;
}
.ui .menu:not(.vertical) .item > .button.compact {
color: var(--color-text) !important;
}
.ui.labeled.button.disabled > .button,
.ui.basic.buttons .button,
.ui.basic.button {
color: var(--color-text-light) !important;
}
#manage_topic {
font-size: 12px;
color: var(--color-text) !important;
}
.ui.menu .item {
color: var(--color-text) !important;
}
/* font weight of "danger zone" buttons in "delete repo" */
.ui.label {
background: rgba(175, 184, 193, 0.2);
}
.comment-header .actions a {
color: black !important;
}
.ui.dropdown > .text {
color: black !important;
}
.repository.compare.pull .choose.branch .svg {
color: black !important;
}
a.muted {
color: black !important;
}
.repository.file.list #repo-files-table tbody .svg.octicon-file-directory-fill,
.repository.file.list #repo-files-table tbody .svg.octicon-file-submodule {
color: #54aeff !important;
}
.repository.file.list #repo-files-table td a {
color: black !important;
}
.ui.negative.buttons .button,
.ui.negative.button {
background-color: none;
color: #db2828;
}
.ui.green.button {
padding: 5px 16px;
line-height: 20px;
}
.ui.green.labels .label,
.ui.ui.ui.green.label {
padding: 5px 16px;
line-height: 20px;
}
.ui.tabular.menu .active.item {
margin-bottom: 2px;
}
.ui.menu .item > .label:not(.floating) {
padding: 0 6px;
line-height: 18px;
}
.ui.secondary.pointing.menu .item > .circular.label {
line-height: 10px;
}
.ui.grey.labels .label,
.ui.ui.ui.grey.label {
line-height: 10px;
} }