diff --git a/src/parts/_forms.css b/src/parts/_forms.css index dfa2710..6661e56 100644 --- a/src/parts/_forms.css +++ b/src/parts/_forms.css @@ -1,12 +1,12 @@ button, -input[type="submit"], -input[type="button"], -input[type="checkbox"], -input[type="range"] { +input[type='submit'], +input[type='button'], +input[type='checkbox'], +input[type='range'] { cursor: pointer; } -input:not([type="checkbox"]):not([type="radio"]), +input:not([type='checkbox']):not([type='radio']), select { display: block; } @@ -29,7 +29,7 @@ textarea { outline: none; } -input:not([type="checkbox"]):not([type="radio"]), +input:not([type='checkbox']):not([type='radio']), select, button, textarea { @@ -44,15 +44,15 @@ textarea { } button, -input[type="submit"], -input[type="button"] { +input[type='submit'], +input[type='button'] { padding-right: 30px; padding-left: 30px; } button:hover, -input[type="submit"]:hover, -input[type="button"]:hover { +input[type='submit']:hover, +input[type='button']:hover { background: var(--button-hover); } @@ -63,11 +63,11 @@ textarea:focus { box-shadow: 0 0 0 2px var(--focus); } -input[type="checkbox"]:active, -input[type="radio"]:active, -input[type="submit"]:active, -input[type="button"]:active, -input[type="range"]:active, +input[type='checkbox']:active, +input[type='radio']:active, +input[type='submit']:active, +input[type='button']:active, +input[type='range']:active, button:active { transform: translateY(2px); } @@ -84,23 +84,23 @@ textarea:disabled { color: var(--form-placeholder); } -input[type="range"] { +input[type='range'] { -webkit-appearance: none; margin: 10px 0; background: transparent; } -input[type="range"]:focus { +input[type='range']:focus { outline: none; } -input[type="range"]::-webkit-slider-runnable-track { +input[type='range']::-webkit-slider-runnable-track { width: 100%; height: 9.5px; transition: 0.2s; background: var(--background); border-radius: 3px; } -input[type="range"]::-webkit-slider-thumb { +input[type='range']::-webkit-slider-thumb { box-shadow: 0px 1px 1px #000000, 0px 0px 1px #0d0d0d; height: 20px; width: 20px; @@ -109,24 +109,24 @@ input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; margin-top: -7px; } -input[type="range"]:focus::-webkit-slider-runnable-track { +input[type='range']:focus::-webkit-slider-runnable-track { background: var(--background); } -input[type="range"]::-moz-range-track { +input[type='range']::-moz-range-track { width: 100%; height: 9.5px; transition: 0.2s; background: var(--background); border-radius: 3px; } -input[type="range"]::-moz-range-thumb { +input[type='range']::-moz-range-thumb { box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; height: 20px; width: 20px; border-radius: 50%; background: var(--border); } -input[type="range"]::-ms-track { +input[type='range']::-ms-track { width: 100%; height: 9.5px; background: transparent; @@ -134,19 +134,19 @@ input[type="range"]::-ms-track { border-width: 16px 0; color: transparent; } -input[type="range"]::-ms-fill-lower { +input[type='range']::-ms-fill-lower { background: var(--background); border: 0.2px solid #010101; border-radius: 3px; box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; } -input[type="range"]::-ms-fill-upper { +input[type='range']::-ms-fill-upper { background: var(--background); border: 0.2px solid #010101; border-radius: 3px; box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; } -input[type="range"]::-ms-thumb { +input[type='range']::-ms-thumb { box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; border: 1px solid #000000; height: 20px; @@ -154,9 +154,9 @@ input[type="range"]::-ms-thumb { border-radius: 50%; background: var(--border); } -input[type="range"]:focus::-ms-fill-lower { +input[type='range']:focus::-ms-fill-lower { background: var(--background); } -input[type="range"]:focus::-ms-fill-upper { +input[type='range']:focus::-ms-fill-upper { background: var(--background); }