Style and template tweaks (#13828)

* Style and template tweaks

- Get red and green buttons on arc green closer to base theme
- EasyMDE adjustments, toolbar and focus border
- Fix header on 404 repo page
- Tweaks to frontpage search, add 'Create Repo' button
- Fix misaligned box headers
- Fix pagination on arc-green
- Fix background and footer on explore and repo search

* better fix for header button alignment

* add label hover for reactions
This commit is contained in:
silverwind 2020-12-04 12:18:37 +01:00 committed by GitHub
parent 557479642d
commit bb50ab2861
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
18 changed files with 119 additions and 139 deletions

View file

@ -69,7 +69,7 @@
--color-purple: #a333c8;
--color-pink: #e03997;
--color-brown: #a5673f;
--color-grey: #767676;
--color-grey: #888888;
--color-black: #1b1c1d;
--color-gold: #a1882b;
--color-white: #ffffff;
@ -97,6 +97,7 @@
--color-markdown-table-row: #00000008;
--color-markdown-code-block: #00000010;
--color-button: #ffffff;
--color-code-bg: #ffffff;
}
:root:lang(ja) {
@ -253,6 +254,10 @@ a.muted:hover,
border-color: var(--color-primary);
}
.CodeMirror-focused {
border-color: var(--color-primary) !important;
}
.ui.action.input:not([class*="left action"]) > input:focus {
border-right-color: var(--color-primary);
}
@ -288,6 +293,10 @@ a.muted:hover,
background: none;
}
.ui.ui.menu .item.disabled {
color: var(--color-text-light-2);
}
.ui.dropdown .menu {
background: var(--color-menu);
border-color: var(--color-secondary);
@ -307,6 +316,8 @@ a.muted:hover,
}
.ui.dropdown .menu .active.item {
color: var(--color-text);
background: var(--color-active);
font-weight: normal;
}
@ -523,17 +534,15 @@ a.muted:hover,
flex-direction: inherit;
}
.ui.dropdown:not(.labeled) > .dropdown.icon {
height: 14px;
vertical-align: bottom;
margin-bottom: -2px;
margin-left: .5rem;
}
.ui.dropdown .menu {
border-color: var(--color-secondary);
}
.ui.pagination.menu .active.item {
color: var(--color-text);
background: var(--color-active);
}
.ui.form .field > .selection.dropdown > .dropdown.icon {
height: auto;
}
@ -1266,6 +1275,11 @@ a.ui.label:hover {
color: var(--color-text);
}
.ui.basic.labels a.label:hover,
a.ui.basic.label:hover {
background: var(--color-label-hover);
}
.ui.label > .detail .icons {
margin-right: .25em;
}
@ -1597,6 +1611,7 @@ a.ui.label:hover {
}
.ui.attached.header {
position: relative;
background: var(--color-box-header);
border-color: var(--color-secondary);
@ -1606,6 +1621,14 @@ a.ui.label:hover {
}
}
/* fix misaligned right buttons on box headers */
.ui.attached.header .right {
position: absolute;
right: .78571429rem;
top: 50%;
transform: translateY(-50%);
}
/* https://github.com/go-gitea/gitea/issues/10210 */
.ui.attached.segment ~ .ui.top.attached.header {
margin-top: 1rem;

View file

@ -1,7 +1,6 @@
/* Background */
.chroma {
background-color: #ffffff;
.chroma,
.lines-code {
background-color: var(--color-code-bg);
}
/* LineTableTD */

View file

@ -63,7 +63,8 @@
}
}
.dashboard-repos {
.dashboard-repos,
.dashboard-orgs {
margin: 0 1px; /* Accomodate for Semantic's 1px hacks on .attached elements */
}

View file

@ -37,12 +37,26 @@
border-color: var(--color-secondary);
}
.editor-toolbar button {
border: none !important;
color: var(--color-text-light);
}
.editor-toolbar button:not(:hover) {
background-color: transparent !important;
}
.editor-toolbar i.separator {
border-left: none;
border-right-color: var(--color-secondary);
}
.editor-toolbar button:hover {
background: var(--color-hover);
}
.editor-toolbar button.active {
background: var(--color-active);
}
.editor-loading {

View file

@ -20,6 +20,9 @@
word-break: break-all !important;
}
.full-screen-width { width: 100vw !important; }
.full-screen-height { height: 100vw !important; }
.rounded { border-radius: var(--border-radius) !important; }
.rounded-top { border-radius: var(--border-radius) var(--border-radius) 0 0 !important; }
.rounded-bottom { border-radius: 0 0 var(--border-radius) var(--border-radius) !important; }

View file

@ -64,8 +64,8 @@
--color-purple: #a333c8;
--color-pink: #e03997;
--color-brown: #a5673f;
--color-grey: #767676;
--color-black: #1b1c1d;
--color-grey: #767a85;
--color-black: #1e222e;
--color-gold: #a1882b;
--color-white: #ffffff;
/* target-based colors */
@ -73,8 +73,8 @@
--color-box-header: #454a57;
--color-box-body: #353945;
--color-text: #bbc0ca;
--color-text-light: #969aa5;
--color-text-light-2: #767a85;
--color-text-light: #a6aab5;
--color-text-light-2: #868a95;
--color-footer: #2e323e;
--color-timeline: #4a505c;
--color-input-text: #d5dbe6;
@ -92,13 +92,9 @@
--color-markdown-table-row: #ffffff06;
--color-markdown-code-block: #2a2e3a;
--color-button: #353846;
--color-code-bg: #2a2e3a;
}
/* Background */
.chroma {
background-color: #2a2e3a;
}
/* LineTableTD */
.chroma .lntd {
@ -563,12 +559,6 @@ a.ui.basic.green.label:hover {
color: #fff !important;
}
.ui.basic.red.active.button,
.ui.basic.red.buttons .active.button {
box-shadow: 0 0 0 1px #b75252 inset !important;
color: #b75252 !important;
}
.ui.divider:not(.vertical):not(.horizontal) {
border-bottom-color: var(--color-secondary);
border-top-color: transparent;
@ -771,19 +761,6 @@ a.ui.basic.green.label:hover {
border-color: transparent !important;
}
.ui.basic.green.active.button,
.ui.basic.green.buttons .active.button {
color: #87ab63 !important;
box-shadow: 0 0 0 1px #87ab63 inset !important;
}
.ui.green.buttons .active.button,
.ui.green.buttons .active.button:active,
.ui.green.active.button,
.ui.green.button .active.button:active {
background: #87ab63;
}
.ui .info.segment.top {
background-color: var(--color-secondary) !important;
}
@ -840,23 +817,6 @@ td.blob-hunk {
background: #353945;
}
.ui.vertical.menu .active.item {
background: #4b5162;
}
.ui.vertical.menu .item {
background: #353945;
}
.ui.vertical.menu .header.item {
background: var(--color-secondary);
}
.ui.vertical.menu {
background: #353945;
border: 1px solid #333640;
}
.ui.card,
.ui.cards > .card {
background: #353945;
@ -966,12 +926,6 @@ td.blob-hunk {
color: rgba(158, 158, 158, 1);
}
.ui.basic.red.button,
.ui.basic.red.buttons .button {
box-shadow: 0 0 0 1px #a04141 inset !important;
color: #a04141 !important;
}
.ui.list .list > .item .header,
.ui.list > .item .header {
color: #dedede;
@ -1183,30 +1137,11 @@ a.blob-excerpt:hover {
filter: invert(100%);
}
.editor-toolbar {
background-color: var(--color-secondary);
border-color: var(--color-secondary);
}
.edit-diff > div > .ui.table {
border-left-color: var(--color-secondary) !important;
border-right-color: var(--color-secondary) !important;
}
.editor-toolbar button {
color: #87ab63 !important;
}
.editor-toolbar button.active,
.editor-toolbar button:hover {
background: #2a2e3a;
border-color: transparent;
}
.editor-toolbar i.separator {
border-right-color: #87ab63;
}
.repository .diff-detail-box {
background-color: #383c4a;
@ -1232,11 +1167,6 @@ a.blob-excerpt:hover {
}
}
.add-comment-left.add-comment-right .ui.attached.header {
border-color: var(--color-secondary);
border-right: none;
}
.file-comment {
color: var(--color-secondary-dark-6);
}