water.css/src/parts/_forms.css

98 lines
1.5 KiB
CSS
Raw Normal View History

button,
select,
2019-04-06 15:07:11 -04:00
input[type='submit'],
input[type='button'],
2019-08-26 12:40:08 -04:00
input[type='checkbox'],
input[type='range'] {
2019-04-06 15:07:11 -04:00
cursor: pointer;
}
2019-04-11 14:22:01 -04:00
input:not([type='checkbox']):not([type='radio']),
select {
2019-04-06 15:07:11 -04:00
display: block;
}
input:not([type='checkbox']):not([type='radio']),
input[type='range'],
select,
button,
textarea {
2019-04-06 15:07:11 -04:00
-webkit-appearance: none;
}
textarea {
margin-right: 0;
width: 100%;
box-sizing: border-box;
resize: vertical;
}
select {
background: var(--background) var(--select-arrow) calc(100% - 12px) 50% / 12px no-repeat;
padding-right: 35px;
}
select::-ms-expand {
display: none;
}
select[multiple] {
padding-right: 10px;
background-image: none;
overflow-y: auto;
}
button,
input[type='submit'],
input[type='button'] {
2019-04-06 15:07:11 -04:00
padding-right: 30px;
padding-left: 30px;
}
button:hover,
input[type='submit']:hover,
input[type='button']:hover {
background: var(--button-hover);
2019-04-06 15:07:11 -04:00
}
input:focus,
select:focus,
button:focus,
textarea:focus {
box-shadow: 0 0 0 2px var(--focus);
2019-04-06 15:07:11 -04:00
}
input[type='checkbox']:active,
2019-04-11 14:22:01 -04:00
input[type='radio']:active,
2019-04-06 15:07:11 -04:00
input[type='submit']:active,
input[type='button']:active,
2019-08-26 12:57:52 -04:00
input[type='range']:active,
2019-04-06 15:07:11 -04:00
button:active {
transform: translateY(2px);
}
input:disabled,
select:disabled,
button:disabled,
textarea:disabled {
2019-04-06 15:07:11 -04:00
cursor: not-allowed;
opacity: 0.5;
2019-04-06 15:07:11 -04:00
}
::placeholder {
color: var(--form-placeholder);
}
fieldset {
border: 1px var(--focus) solid;
border-radius: 6px;
margin: 0;
margin-bottom: 6px;
padding: 10px;
}
legend {
font-size: 0.9em;
font-weight: 600;
}