Tweak website theme colors (#95)

Fixes https://github.com/go-gitea/gitea/issues/15711

## Main changes

- Use `#528321` for link color and general greenish elements
- Use `#333` for blackish elements
- Use a grey navbar (#f4f4f4) with black text
- Update inline-code coloring (`.code` class)

cc @silverwind

Co-authored-by: pat-s <patrick.schratz@gmail.com>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Reviewed-on: https://gitea.com/gitea/theme/pulls/95
Reviewed-by: 6543 <6543@obermui.de>
Reviewed-by: silverwind <silverwind@noreply.gitea.io>
Co-authored-by: pat-s <pat-s@noreply.gitea.io>
Co-committed-by: pat-s <pat-s@noreply.gitea.io>
This commit is contained in:
pat-s 2021-08-03 11:20:48 +08:00 committed by Lunny Xiao
parent a7d7da49ac
commit 87dd2d410d
1 changed files with 53 additions and 2 deletions

View File

@ -60,6 +60,10 @@
// Mobile Styles
.navbar {
background-color: #f4f4f4;
}
.navbar-background{
-webkit-transition: opacity ease 300ms;
transition: opacity ease 300ms;
@ -95,6 +99,7 @@
.navbar-item{
padding: 0.5em 2em 0.5em 1.5em;
color: #333;
}
.logo{
@ -102,6 +107,10 @@
}
}
a.navbar-item, .navbar-link {
color: #333;
}
.navbar-burger.burger{
position: fixed;
top: 0;
@ -120,6 +129,14 @@
opacity: 1;
}
a {
color: #528321;
}
a.navbar-item:focus, a.navbar-item:focus-within, a.navbar-item:hover, a.navbar-item.is-active, .navbar-link:focus, .navbar-link:focus-within, .navbar-link:hover, .navbar-link.is-active {
color: #333;
}
.toc {
padding-bottom: 10px;
}
@ -152,7 +169,7 @@
color: #2b3c4e;
}
.menu-list a.is-active {
background-color: #1abc9c;
background-color: #528321;
color: #fff;
}
.menu-list li ul {
@ -162,7 +179,7 @@
}
.menu-label {
color: #1abc9c;
color: #528321;
font-size: 0.8em;
letter-spacing: 0.1em;
text-transform: uppercase;
@ -174,3 +191,37 @@
margin-bottom: 0.5em;
}
code {
background-color: #ecf0f1;
color: black;
font-size: 0.85em;
font-weight: normal;
padding: .2em .4em;
border-radius: 6px;
}
.button.is-success {
background-color: #528321;
border-color: transparent;
color: #fff;
}
.hero.is-primary {
background-color: #f4f4f4;
}
.hero.is-primary .title {
color: #333;
}
.hero.is-primary .subtitle {
color: #333;
}
.hero.is-link {
color: #333;
}
.feature-shoutout a {
color: black !important;
}