domi/forgejo-domi
1
0
Fork 0
forked from forgejo/forgejo
Code Pull requests Activity

Consolidate more CSS colors into variables (#21402)

Browse source 
Move more colors into variables. The only real notable change is the dot
in the release timeline. Also, made the variable comments a bit more
clear.

<img width="279" alt="Screen Shot 2022-10-10 at 21 10 23"
src="https://user-images.githubusercontent.com/115237/194938496-e5a21056-67c4-4219-9c68-134b0edf0e61.png">

<img width="88" alt="Screen Shot 2022-10-10 at 21 31 53"
src="https://user-images.githubusercontent.com/115237/194939712-f666c43e-fb1a-4045-be52-1176391bd8ea.png">

<img width="90" alt="Screen Shot 2022-10-10 at 21 31 44"
src="https://user-images.githubusercontent.com/115237/194939710-2e620c06-75a9-41b7-a3e1-18eab7a57614.png">

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
This commit is contained in:
silverwind 2022-10-12 18:26:27 +02:00 • committed by GitHub
parent 42b803554c
commit ac3a61ea17
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 30 additions and 65 deletions
Download patch file Download diff file Expand all files Collapse all files

32
web_src/less/_base.less
View file

@ -1,12 +1,16 @@
:root {
/* documented customizable variables */
/* fonts */
--fonts-proportional: -apple-system, "Segoe UI", system-ui, "Roboto", "Helvetica Neue", "Arial";
--fonts-monospace: "SFMono-Regular", "Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", monospace, var(--fonts-emoji);
--fonts-emoji: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", "Twemoji Mozilla";
/* other variables */
/* backgrounds */
--checkbox-mask-checked: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-1 -1 18 18" width="16" height="16"><path fill-rule="evenodd" d="M13.78 4.22a.75.75 0 010 1.06l-7.25 7.25a.75.75 0 01-1.06 0L2.22 9.28a.75.75 0 011.06-1.06L6 10.94l6.72-6.72a.75.75 0 011.06 0z"></path></svg>');
--checkbox-mask-indeterminate: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2 7.75A.75.75 0 012.75 7h10a.75.75 0 010 1.5h-10A.75.75 0 012 7.75z"></path></svg>');
/* non-color variables */
--border-radius: .28571429rem;
--opacity-disabled: .55;
--height-loading: 12rem;
/* base colors */
--color-primary: #4183c4;
--color-primary-dark-1: #3876b3;
--color-primary-dark-2: #31699f;
@ -61,7 +65,7 @@
/* console colors */
--color-console-fg: #ffffff;
--color-console-bg: #171717;
/* colors */
/* named colors */
--color-red: #db2828;
--color-orange: #f2711c;
--color-yellow: #fbbd08;
@ -113,7 +117,6 @@
--color-info-border: #a9d5de;
--color-info-bg: #f8ffff;
--color-info-text: #276f86;
/* target-based colors */
--color-body: #ffffff;
--color-text-dark: #080808;
--color-text: #212121;
@ -159,12 +162,9 @@
--color-tooltip-text: #ffffff;
--color-header-bar: #ffffff;
--color-label-active-bg: #d0d0d0;
/* accent */
--color-small-accent: var(--color-primary-light-6);
--color-accent: var(--color-primary-light-4);
/* backgrounds */
--checkbox-mask-checked: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-1 -1 18 18" width="16" height="16"><path fill-rule="evenodd" d="M13.78 4.22a.75.75 0 010 1.06l-7.25 7.25a.75.75 0 01-1.06 0L2.22 9.28a.75.75 0 011.06-1.06L6 10.94l6.72-6.72a.75.75 0 011.06 0z"></path></svg>');
--checkbox-mask-indeterminate: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2 7.75A.75.75 0 012.75 7h10a.75.75 0 010 1.5h-10A.75.75 0 012 7.75z"></path></svg>');
--color-active-line: #fffbdd;
}
:root * {
@ -351,6 +351,10 @@ a.commit-statuses-trigger {
border-bottom: none !important;
}
.ui.dividing.header {
border-bottom-color: var(--color-secondary);
}
.page-content {
margin-top: 15px;
}
@ -1374,7 +1378,7 @@ footer {
max-width: calc(100vw - 1rem) !important;
.links > * {
border-left: 1px solid var(--color-secondary);
border-left: 1px solid var(--color-secondary-dark-1);
padding-left: 8px;
margin-left: 5px;
@ -1712,7 +1716,7 @@ a.ui.label:hover {
.lines-code.active,
.lines-code .active {
background: #fffbdd !important;
background: var(--color-active-line) !important;
}
.blame .lines-num {
@ -2114,6 +2118,10 @@ table th[data-sortt-desc] {
vertical-align: -.15em;
}
.minicolors-panel {
background: var(--color-secondary-dark-1) !important;
}
.labelspage {
list-style: none;
padding-top: 0;
@ -2215,6 +2223,10 @@ table th[data-sortt-desc] {
margin-top: inherit;
}
.ui.header .sub.header {
color: var(--color-text-light-1);
}
.flash-error details code,
.flash-warning details code {
display: block;