1
1
mirror of https://github.com/go-gitea/gitea synced 2025-07-22 18:28:37 +00:00

Form styling adjustments (#13501)

* Form styling adjustments

- Move all form-related styling to _forms.less
- Defined new form-related variables
- Fix spinner on frontpage repo search
- Add new rounded-* helpers and fix repo search radius

* misc arc green tweaks

Co-authored-by: zeripath <art27@cantab.net>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
Co-authored-by: Lauris BH <lauris@nix.lv>
This commit is contained in:
silverwind
2020-11-12 16:59:33 +01:00
committed by GitHub
parent 4117a443c2
commit c2e05d9f9a
6 changed files with 157 additions and 207 deletions

View File

@@ -53,8 +53,12 @@
--color-body: #383c4a;
--color-box-header: #454a57;
--color-box-body: #353945;
--color-text: #9aa0af;
--color-text: #b6bac5;
--color-timeline: #454a57;
--color-input-text: #dcdcdc;
--color-input-background: #2e323e;
--color-input-border: #454a57;
--color-input-border-hover: #505667;
}
/* Background */
@@ -565,10 +569,6 @@ body {
color: #fff;
}
.ui.attached.table {
border: 1px solid #304251;
}
.feeds .list ul li.private {
background: #353945;
}
@@ -647,19 +647,6 @@ footer {
background: #4b5162;
}
.ui.input input {
background: var(--color-secondary);
border: 1px solid var(--color-secondary);
color: #dbdbdb;
}
.ui.input input:focus,
.ui.input.focus input {
background: var(--color-secondary);
border: 1px solid #6a737d;
color: #dbdbdb;
}
.ui.accordion .title:not(.ui) {
color: #dbdbdb;
}
@@ -722,11 +709,6 @@ a.ui.basic.green.label:hover {
opacity: 1;
}
.ui.disabled.checkbox label,
.ui.checkbox input[disabled] ~ label {
color: var(--color-secondary-dark-6);
}
.ui.pagination.menu .active.item {
color: #dbdbdb;
background-color: #87ab63;
@@ -750,59 +732,12 @@ a.ui.basic.green.label:hover {
background: #505667;
}
.ui.form input:not([type]),
.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 {
color: var(--color-secondary-dark-6);
background: #2e323e;
.form .help {
color: #7f8699;
}
.ui.form input:not([type]):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 {
background: #2e323e;
border: 1px solid #505667;
color: #dbdbdb;
}
.ui.form input:not([type]):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 {
background: #2e323e;
color: #dbdbdb;
.ui .text.light.grey {
color: #7f8699 !important;
}
.ui.form .fields.error .field textarea,
@@ -856,10 +791,6 @@ a.ui.basic.green.label:hover {
color: #f9cbcb;
}
.ui.action.input:not([class*="left action"]) input:focus {
border-right-color: #6a737d !important;
}
.ui.green.button,
.ui.green.buttons .button {
background-color: #87ab63;
@@ -879,7 +810,7 @@ a.ui.basic.green.label:hover {
.ui.basic.button,
.ui.basic.buttons .button {
color: var(--color-secondary-dark-6);
background: rgba(0, 0, 0, .06);
background: rgba(0, 0, 0, .1);
box-shadow: none;
}
@@ -1035,10 +966,6 @@ a.ui.basic.green.label:hover {
color: #636363;
}
.ui.input {
color: #dbdbdb;
}
.overflow.menu .items .item {
color: #9d9d9d;
}
@@ -1327,20 +1254,6 @@ td.blob-hunk {
background: #2c303a;
}
.ui.checkbox label,
.ui.checkbox + label,
.ui.form .field > label {
color: var(--color-secondary-dark-6);
}
.ui.form .inline.field > label,
.ui.form .inline.field > p,
.ui.form .inline.fields .field > label,
.ui.form .inline.fields .field > p,
.ui.form .inline.fields > label {
color: var(--color-secondary-dark-6);
}
.user.settings .email.list .item:not(:first-child) {
border-top: 1px solid #3f4451;
}
@@ -1425,81 +1338,6 @@ td.blob-hunk {
background-color: #984646;
}
.ui.checkbox label:hover,
.ui.checkbox + label:hover {
color: #dbdbdb !important;
}
.ui.checkbox .box::before,
.ui.checkbox label::before {
background: #2e323e;
border: 1px solid var(--color-secondary);
}
.ui.checkbox .box:hover::before,
.ui.checkbox label:hover::before,
.ui.checkbox .box:active::before,
.ui.checkbox label:active::before {
background: #2e323e;
border-color: #6a737d;
}
.ui.checkbox input:focus ~ .box::before,
.ui.checkbox input:focus ~ label::before,
.ui.checkbox input:checked:focus ~ .box::before,
.ui.checkbox input:checked:focus ~ label::before {
background: #2e323e;
border-color: #6a737d;
}
.ui.checkbox input:checked ~ .box::after,
.ui.checkbox input:checked ~ label::after {
color: #dbdbdb;
}
.ui.checkbox input:checked ~ .box::before,
.ui.checkbox input:checked ~ label::before {
background: #2e323e;
opacity: 1;
color: #dbdbdb;
border-color: #505667;
}
.ui.checkbox input:checked:focus ~ .box::before,
.ui.checkbox input:checked:focus ~ label::before,
.ui.checkbox input:not([type="radio"]):indeterminate:focus ~ .box::before,
.ui.checkbox input:not([type="radio"]):indeterminate:focus ~ label::before {
background: #2e323e;
border-color: #6a737d;
}
.ui.checkbox input:checked:focus ~ .box::after,
.ui.checkbox input:checked:focus ~ label::after,
.ui.checkbox input:not([type="radio"]):indeterminate:focus ~ .box::after,
.ui.checkbox input:not([type="radio"]):indeterminate:focus ~ label::after {
background: #2e323e;
color: #dbdbdb;
}
.ui.checkbox input:focus ~ .box::after,
.ui.checkbox input:focus ~ label,
.ui.checkbox input:focus ~ label::after {
color: #9a9a9a;
}
.ui.radio.checkbox label::after,
.ui.radio.checkbox input:checked ~ label::after,
.ui.radio.checkbox input:focus ~ label::after,
.ui.radio.checkbox input:focus:checked ~ label::after {
background: #dbdbdb;
}
.ui.radio.checkbox input:checked ~ label::before,
.ui.radio.checkbox input:focus ~ label::before,
.ui.radio.checkbox input:focus:checked ~ label::before {
background: none;
}
.ui.selection.dropdown .menu > .item {
border-top: 1px solid #313c47;
}