mirror of
https://github.com/go-gitea/gitea.git
synced 2026-05-06 05:55:22 +00:00
6ba907d89c
1. Fix ugly commit form "warning" message 2. Use JSONError for "Update PR Branch" response 3. Remove useless "timeline" class 4. Make timeline review default to "comment" to avoid icon missing 5. Align PR's "command line instructions" UI 6. Simply "Update PR branch" button logic And then some TODOs are fixed. --------- Signed-off-by: wxiaoguang <wxiaoguang@gmail.com>
190 lines
4.2 KiB
CSS
190 lines
4.2 KiB
CSS
/* based on Fomantic UI checkbox module, with just the parts extracted that we use. If you find any
|
|
unused rules here after refactoring, please remove them. */
|
|
|
|
input[type="radio"] {
|
|
appearance: none;
|
|
width: var(--checkbox-size);
|
|
height: var(--checkbox-size);
|
|
border: 1px solid var(--color-input-border);
|
|
border-radius: 50%;
|
|
background: var(--color-input-background);
|
|
}
|
|
|
|
input[type="radio"]:checked {
|
|
background: var(--color-white);
|
|
border: 4px solid var(--color-primary);
|
|
}
|
|
|
|
input[type="checkbox"] {
|
|
appearance: none;
|
|
display: inline-grid;
|
|
place-content: center;
|
|
width: var(--checkbox-size);
|
|
height: var(--checkbox-size);
|
|
border: 1px solid var(--color-input-border);
|
|
border-radius: 3px;
|
|
background: var(--color-input-background);
|
|
overflow: hidden;
|
|
print-color-adjust: exact;
|
|
}
|
|
|
|
input[type="checkbox"]::before {
|
|
content: "";
|
|
background: var(--color-white);
|
|
width: var(--checkbox-size);
|
|
height: var(--checkbox-size);
|
|
clip-path: inset(var(--checkbox-size) 0 0 0);
|
|
mask-image: var(--checkbox-mask-checked);
|
|
-webkit-mask-image: var(--checkbox-mask-checked);
|
|
mask-size: 75%;
|
|
-webkit-mask-size: 75%;
|
|
mask-repeat: no-repeat;
|
|
-webkit-mask-repeat: no-repeat;
|
|
mask-position: center;
|
|
-webkit-mask-position: center;
|
|
}
|
|
|
|
input[type="checkbox"]:checked,
|
|
input[type="checkbox"]:indeterminate {
|
|
background: var(--color-primary);
|
|
border-color: var(--color-primary);
|
|
}
|
|
|
|
input[type="checkbox"]:checked::before {
|
|
clip-path: inset(0);
|
|
}
|
|
|
|
input[type="checkbox"]:disabled:checked,
|
|
input[type="checkbox"]:disabled:indeterminate {
|
|
background: var(--color-secondary-dark-4);
|
|
border-color: var(--color-secondary-dark-4);
|
|
}
|
|
|
|
input[type="radio"]:disabled:checked {
|
|
border-color: var(--color-secondary-dark-4);
|
|
}
|
|
|
|
input[type="checkbox"]:indeterminate::before {
|
|
clip-path: inset(0);
|
|
mask-image: var(--checkbox-mask-indeterminate);
|
|
-webkit-mask-image: var(--checkbox-mask-indeterminate);
|
|
mask-size: 75%;
|
|
-webkit-mask-size: 75%;
|
|
}
|
|
|
|
.ui.checkbox {
|
|
position: relative;
|
|
display: inline-block;
|
|
vertical-align: baseline;
|
|
min-height: var(--checkbox-size);
|
|
line-height: var(--checkbox-size);
|
|
min-width: var(--checkbox-size);
|
|
padding: 1px;
|
|
}
|
|
|
|
.ui.checkbox input[type="checkbox"],
|
|
.ui.checkbox input[type="radio"] {
|
|
position: absolute;
|
|
top: 1px;
|
|
left: 0;
|
|
width: var(--checkbox-size);
|
|
height: var(--checkbox-size);
|
|
}
|
|
|
|
.ui.checkbox label {
|
|
position: relative;
|
|
display: block;
|
|
}
|
|
|
|
.ui.checkbox label,
|
|
.ui.radio.checkbox label {
|
|
margin-left: 20px;
|
|
}
|
|
|
|
.ui.checkbox + label {
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.ui.disabled.checkbox input,
|
|
.ui.disabled.checkbox label,
|
|
.ui.checkbox input[disabled] ~ label {
|
|
cursor: default !important;
|
|
opacity: 0.5;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.ui.radio.checkbox {
|
|
min-height: var(--checkbox-size);
|
|
}
|
|
|
|
/* "switch" styled checkbox */
|
|
|
|
.ui.toggle.checkbox {
|
|
min-height: 1.5rem;
|
|
}
|
|
.ui.toggle.checkbox input {
|
|
width: 3.5rem;
|
|
height: 21px;
|
|
opacity: 0;
|
|
z-index: 3;
|
|
}
|
|
.ui.toggle.checkbox label {
|
|
min-height: 1.5rem;
|
|
padding-left: 4.5rem;
|
|
padding-top: 0.15em;
|
|
}
|
|
.ui.toggle.checkbox label::before {
|
|
display: block;
|
|
position: absolute;
|
|
content: "";
|
|
z-index: 1;
|
|
top: 0;
|
|
width: 49px;
|
|
height: 21px;
|
|
border-radius: 500rem;
|
|
left: 0;
|
|
}
|
|
.ui.toggle.checkbox label::after {
|
|
background: var(--color-white);
|
|
box-shadow: 1px 1px 4px 1px var(--color-shadow);
|
|
position: absolute;
|
|
content: "";
|
|
opacity: 1;
|
|
z-index: 2;
|
|
width: 18px;
|
|
height: 18px;
|
|
top: 1.5px;
|
|
left: 1.5px;
|
|
border-radius: 500rem;
|
|
transition: background 0.3s ease, left 0.3s ease;
|
|
}
|
|
.ui.toggle.checkbox input ~ label::after {
|
|
left: 1.5px;
|
|
}
|
|
.ui.toggle.checkbox input:checked ~ label::after {
|
|
left: 29px;
|
|
}
|
|
.ui.toggle.checkbox input:focus ~ label::before,
|
|
.ui.toggle.checkbox label::before {
|
|
background: var(--color-input-toggle-background);
|
|
}
|
|
.ui.toggle.checkbox label,
|
|
.ui.toggle.checkbox input:checked ~ label,
|
|
.ui.toggle.checkbox input:focus:checked ~ label {
|
|
color: var(--color-text) !important;
|
|
}
|
|
.ui.toggle.checkbox input:checked ~ label::before,
|
|
.ui.toggle.checkbox input:focus:checked ~ label::before {
|
|
background: var(--color-primary) !important;
|
|
}
|
|
|
|
label.gt-checkbox {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 0.25em;
|
|
}
|
|
|
|
.ui.form .field > label.gt-checkbox {
|
|
display: flex;
|
|
}
|