mirror of
https://github.com/chylex/Lightning-Tracker.git
synced 2024-09-19 10:42:48 +02:00
283 lines
5.2 KiB
CSS
283 lines
5.2 KiB
CSS
.field-group {
|
|
margin-bottom: 12px;
|
|
}
|
|
|
|
.field-group.flex {
|
|
display: flex;
|
|
align-items: start;
|
|
}
|
|
|
|
form .message {
|
|
font-size: 16px;
|
|
margin: 0 0 20px;
|
|
}
|
|
|
|
form .message .icon {
|
|
font-size: 15px;
|
|
margin-right: 3px;
|
|
}
|
|
|
|
form .message.success {
|
|
color: #2a6600;
|
|
}
|
|
|
|
form .message.error {
|
|
color: #8c1b1b;
|
|
}
|
|
|
|
input, select, textarea {
|
|
display: inline-block;
|
|
margin-bottom: 8px;
|
|
color: #000000;
|
|
font-size: 15px;
|
|
}
|
|
|
|
input[type=text],
|
|
input[type=password],
|
|
input[type=email],
|
|
input[type=number],
|
|
textarea,
|
|
select {
|
|
padding: 7px 8px;
|
|
width: 100%;
|
|
border: 1px solid #333333;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
input[type=text].invalid,
|
|
input[type=password].invalid,
|
|
input[type=email].invalid,
|
|
input[type=number].invalid,
|
|
textarea.invalid,
|
|
select.invalid {
|
|
border: 1px solid #8c1b1b;
|
|
box-shadow: 0 0 4px -2px #8c1b1b inset;
|
|
}
|
|
|
|
input[type=text]:focus,
|
|
input[type=password]:focus,
|
|
input[type=email]:focus,
|
|
input[type=number]:focus,
|
|
textarea:focus,
|
|
select:focus {
|
|
outline: none !important;
|
|
box-shadow: 0 0 4px -2px #1b618c inset;
|
|
}
|
|
|
|
input[type=text]:disabled,
|
|
input[type=password]:disabled,
|
|
input[type=email]:disabled,
|
|
input[type=number]:disabled,
|
|
textarea:disabled,
|
|
select:disabled {
|
|
color: #222222;
|
|
background-color: #e2e2e2;
|
|
}
|
|
|
|
textarea {
|
|
min-height: 75px;
|
|
height: 140px;
|
|
resize: vertical;
|
|
font-size: 16px;
|
|
}
|
|
|
|
select {
|
|
appearance: none;
|
|
}
|
|
|
|
select[size] {
|
|
padding: 0;
|
|
overflow: hidden;
|
|
/*noinspection CssUnknownProperty*/
|
|
scrollbar-width: none;
|
|
-ms-overflow-style: none;
|
|
}
|
|
|
|
select:not([size]) {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
height: 36px;
|
|
padding: 0 0 0 8px;
|
|
}
|
|
|
|
select:not([size]):disabled {
|
|
color: #222222;
|
|
}
|
|
|
|
@supports (appearance: none) {
|
|
select:not([size]) {
|
|
padding-right: 22px;
|
|
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 5'%3E%3Cpath d='M3.996,5l3.996,-5l-7.992,0l3.996,5Z'/%3E%3C/svg%3E") no-repeat calc(100% - 8px) 50% / 11px;
|
|
}
|
|
|
|
select:not([size]):disabled {
|
|
background: #e2e2e2 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%237d7d7d' viewBox='0 0 8 5'%3E%3Cpath d='M3.996,5l3.996,-5l-7.992,0l3.996,5Z'/%3E%3C/svg%3E") no-repeat calc(100% - 8px) 50% / 11px;
|
|
}
|
|
}
|
|
|
|
@supports (-moz-appearance: none) {
|
|
select:not([size]) {
|
|
padding-left: 3px;
|
|
}
|
|
|
|
option:checked {
|
|
color: #ffffff;
|
|
box-shadow: 0 0 0 100px #2b5e7d inset;
|
|
}
|
|
}
|
|
|
|
@supports not (-moz-appearance: none) {
|
|
select[size]::-webkit-scrollbar {
|
|
width: 0;
|
|
display: none;
|
|
}
|
|
|
|
select:not([size]) select:focus option:checked {
|
|
color: #ffffff;
|
|
box-shadow: 0 0 0 100px #2b5e7d inset;
|
|
}
|
|
}
|
|
|
|
option {
|
|
padding: 7px 8px;
|
|
outline: none;
|
|
}
|
|
|
|
select:not(:disabled) option:not(:disabled) {
|
|
cursor: pointer;
|
|
}
|
|
|
|
option.icon:before {
|
|
/*noinspection CssNoGenericFontName*/
|
|
font-family: 'icomoon' !important;
|
|
margin-left: -1px;
|
|
margin-right: 5px;
|
|
line-height: 17px;
|
|
vertical-align: -6%;
|
|
}
|
|
|
|
details.multiselect > summary {
|
|
border: 1px solid #333333;
|
|
border-radius: 5px;
|
|
padding: 7px 28px 7px 8px;
|
|
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 5'%3E%3Cpath d='M3.996,5l3.996,-5l-7.992,0l3.996,5Z'/%3E%3C/svg%3E") no-repeat calc(100% - 8px) 50% / 11px;
|
|
overflow: hidden;
|
|
font-style: italic;
|
|
text-overflow: ellipsis;
|
|
cursor: pointer;
|
|
list-style: none;
|
|
}
|
|
|
|
details.multiselect > summary::-webkit-details-marker {
|
|
display: none;
|
|
}
|
|
|
|
details.multiselect > article {
|
|
position: absolute;
|
|
overflow-x: hidden;
|
|
overflow-y: auto;
|
|
max-height: 235px;
|
|
margin: 4px 0 0 !important;
|
|
padding: 6px 5px 1px;
|
|
border: 1px solid #333333;
|
|
border-radius: 5px;
|
|
background-color: #ffffff;
|
|
z-index: 100;
|
|
}
|
|
|
|
details.multiselect > article .field-group {
|
|
margin: 1px 0;
|
|
}
|
|
|
|
details.multiselect > article .icon {
|
|
font-size: 13px;
|
|
}
|
|
|
|
details.multiselect > article .issue-tag {
|
|
opacity: 0.3;
|
|
margin-left: -17px;
|
|
}
|
|
|
|
details.multiselect > article .issue-tag:before {
|
|
border-radius: 0;
|
|
box-shadow: none;
|
|
}
|
|
|
|
label {
|
|
display: inline-block;
|
|
margin-bottom: 5px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
label:empty {
|
|
display: none;
|
|
}
|
|
|
|
input[type=checkbox] {
|
|
margin: 3px 4px 8px 4px;
|
|
}
|
|
|
|
input[type=checkbox]:not(:disabled),
|
|
label:not(.disabled) {
|
|
cursor: pointer;
|
|
}
|
|
|
|
input[type=checkbox] + label,
|
|
div.checkbox-multiline-label > label {
|
|
font-size: 15px;
|
|
font-weight: normal;
|
|
vertical-align: 5%;
|
|
margin-top: 1px;
|
|
/* extends clickable label area to cover space between it and the checkbox */
|
|
margin-left: -17px;
|
|
padding-left: 17px;
|
|
}
|
|
|
|
div.checkbox-multiline {
|
|
display: flex;
|
|
position: relative;
|
|
align-items: flex-start;
|
|
margin: 3px 0 16px;
|
|
}
|
|
|
|
div.checkbox-multiline.parent:before,
|
|
div.checkbox-multiline.sibling:before {
|
|
display: block;
|
|
content: "";
|
|
position: absolute;
|
|
bottom: -26px;
|
|
width: 12px;
|
|
border-left: 1px dotted #000000;
|
|
border-bottom: 1px dotted #000000;
|
|
}
|
|
|
|
div.checkbox-multiline.parent:before {
|
|
top: 17px;
|
|
left: 10px;
|
|
}
|
|
|
|
div.checkbox-multiline.sibling:before {
|
|
top: 11px;
|
|
left: -10px;
|
|
}
|
|
|
|
div.checkbox-multiline.indented {
|
|
margin-left: 20px;
|
|
}
|
|
|
|
div.checkbox-multiline-label {
|
|
padding-left: 4px;
|
|
}
|
|
|
|
div.checkbox-multiline-label > label {
|
|
margin-top: 1px;
|
|
margin-bottom: 1px;
|
|
}
|
|
|
|
div.checkbox-multiline-label p {
|
|
color: #444444;
|
|
font-size: 15px;
|
|
line-height: 18px;
|
|
margin: 0;
|
|
}
|