diff --git a/static/css/custom.css b/static/css/custom.css index 8b4a0d5..c74cfcb 100644 --- a/static/css/custom.css +++ b/static/css/custom.css @@ -1,35 +1,36 @@ .button, button, -input[type='button'], -input[type='reset'], -input[type='submit'] { +input[type="button"], +input[type="reset"], +input[type="submit"] { background-color: #4d87ca; border: 0.1rem solid #4d87ca; - border-radius: .4rem; + border-radius: 0.4rem; color: #fff; cursor: pointer; display: inline-block; font-size: 1.1rem; font-weight: 700; height: 3.8rem; - letter-spacing: .1rem; + letter-spacing: 0.1rem; line-height: 3.8rem; - padding: 0 3.0rem; + padding: 0 3rem; text-align: center; text-decoration: none; text-transform: uppercase; white-space: nowrap; } -.button:focus, .button:hover, +.button:focus, +.button:hover, button:focus, button:hover, -input[type='button']:focus, -input[type='button']:hover, -input[type='reset']:focus, -input[type='reset']:hover, -input[type='submit']:focus, -input[type='submit']:hover { +input[type="button"]:focus, +input[type="button"]:hover, +input[type="reset"]:focus, +input[type="reset"]:hover, +input[type="submit"]:focus, +input[type="submit"]:hover { background-color: #606c76; border-color: #606c76; color: #fff; @@ -38,140 +39,145 @@ input[type='submit']:hover { .button[disabled], button[disabled], -input[type='button'][disabled], -input[type='reset'][disabled], -input[type='submit'][disabled] { +input[type="button"][disabled], +input[type="reset"][disabled], +input[type="submit"][disabled] { cursor: default; - opacity: .5; + opacity: 0.5; } -.button[disabled]:focus, .button[disabled]:hover, +.button[disabled]:focus, +.button[disabled]:hover, button[disabled]:focus, button[disabled]:hover, -input[type='button'][disabled]:focus, -input[type='button'][disabled]:hover, -input[type='reset'][disabled]:focus, -input[type='reset'][disabled]:hover, -input[type='submit'][disabled]:focus, -input[type='submit'][disabled]:hover { +input[type="button"][disabled]:focus, +input[type="button"][disabled]:hover, +input[type="reset"][disabled]:focus, +input[type="reset"][disabled]:hover, +input[type="submit"][disabled]:focus, +input[type="submit"][disabled]:hover { background-color: #4d87ca; border-color: #4d87ca; } .button.button-outline, button.button-outline, -input[type='button'].button-outline, -input[type='reset'].button-outline, -input[type='submit'].button-outline { +input[type="button"].button-outline, +input[type="reset"].button-outline, +input[type="submit"].button-outline { background-color: transparent; color: #4d87ca; } -.button.button-outline:focus, .button.button-outline:hover, +.button.button-outline:focus, +.button.button-outline:hover, button.button-outline:focus, button.button-outline:hover, -input[type='button'].button-outline:focus, -input[type='button'].button-outline:hover, -input[type='reset'].button-outline:focus, -input[type='reset'].button-outline:hover, -input[type='submit'].button-outline:focus, -input[type='submit'].button-outline:hover { +input[type="button"].button-outline:focus, +input[type="button"].button-outline:hover, +input[type="reset"].button-outline:focus, +input[type="reset"].button-outline:hover, +input[type="submit"].button-outline:focus, +input[type="submit"].button-outline:hover { background-color: transparent; border-color: #606c76; color: #606c76; } -.button.button-outline[disabled]:focus, .button.button-outline[disabled]:hover, +.button.button-outline[disabled]:focus, +.button.button-outline[disabled]:hover, button.button-outline[disabled]:focus, button.button-outline[disabled]:hover, -input[type='button'].button-outline[disabled]:focus, -input[type='button'].button-outline[disabled]:hover, -input[type='reset'].button-outline[disabled]:focus, -input[type='reset'].button-outline[disabled]:hover, -input[type='submit'].button-outline[disabled]:focus, -input[type='submit'].button-outline[disabled]:hover { +input[type="button"].button-outline[disabled]:focus, +input[type="button"].button-outline[disabled]:hover, +input[type="reset"].button-outline[disabled]:focus, +input[type="reset"].button-outline[disabled]:hover, +input[type="submit"].button-outline[disabled]:focus, +input[type="submit"].button-outline[disabled]:hover { border-color: inherit; color: #4d87ca; } .button.button-clear, button.button-clear, -input[type='button'].button-clear, -input[type='reset'].button-clear, -input[type='submit'].button-clear { +input[type="button"].button-clear, +input[type="reset"].button-clear, +input[type="submit"].button-clear { background-color: transparent; border-color: transparent; color: #4d87ca; } -.button.button-clear:focus, .button.button-clear:hover, +.button.button-clear:focus, +.button.button-clear:hover, button.button-clear:focus, button.button-clear:hover, -input[type='button'].button-clear:focus, -input[type='button'].button-clear:hover, -input[type='reset'].button-clear:focus, -input[type='reset'].button-clear:hover, -input[type='submit'].button-clear:focus, -input[type='submit'].button-clear:hover { +input[type="button"].button-clear:focus, +input[type="button"].button-clear:hover, +input[type="reset"].button-clear:focus, +input[type="reset"].button-clear:hover, +input[type="submit"].button-clear:focus, +input[type="submit"].button-clear:hover { background-color: transparent; border-color: transparent; color: #606c76; } -.button.button-clear[disabled]:focus, .button.button-clear[disabled]:hover, +.button.button-clear[disabled]:focus, +.button.button-clear[disabled]:hover, button.button-clear[disabled]:focus, button.button-clear[disabled]:hover, -input[type='button'].button-clear[disabled]:focus, -input[type='button'].button-clear[disabled]:hover, -input[type='reset'].button-clear[disabled]:focus, -input[type='reset'].button-clear[disabled]:hover, -input[type='submit'].button-clear[disabled]:focus, -input[type='submit'].button-clear[disabled]:hover { +input[type="button"].button-clear[disabled]:focus, +input[type="button"].button-clear[disabled]:hover, +input[type="reset"].button-clear[disabled]:focus, +input[type="reset"].button-clear[disabled]:hover, +input[type="submit"].button-clear[disabled]:focus, +input[type="submit"].button-clear[disabled]:hover { color: #4d87ca; } -input[type='email'], -input[type='number'], -input[type='password'], -input[type='search'], -input[type='tel'], -input[type='text'], -input[type='url'], -input[type='color'], -input[type='date'], -input[type='month'], -input[type='week'], -input[type='datetime'], -input[type='datetime-local'], +input[type="email"], +input[type="number"], +input[type="password"], +input[type="search"], +input[type="tel"], +input[type="text"], +input[type="url"], +input[type="color"], +input[type="date"], +input[type="month"], +input[type="week"], +input[type="datetime"], +input[type="datetime-local"], input:not([type]), textarea, select { -webkit-appearance: none; - -moz-appearance: none; - appearance: none; + -moz-appearance: none; + appearance: none; background-color: transparent; border: 0.1rem solid #d1d1d1; - border-radius: .4rem; + border-radius: 0.4rem; box-shadow: none; box-sizing: inherit; height: 3.8rem; - padding: .6rem 1.0rem; + padding: 0.6rem 1rem; width: 100%; } -input[type='email']:focus, -input[type='number']:focus, -input[type='password']:focus, -input[type='search']:focus, -input[type='tel']:focus, -input[type='text']:focus, -input[type='url']:focus, -input[type='color']:focus, -input[type='date']:focus, -input[type='month']:focus, -input[type='week']:focus, -input[type='datetime']:focus, -input[type='datetime-local']:focus, +input[type="email"]:focus, +input[type="number"]:focus, +input[type="password"]:focus, +input[type="search"]:focus, +input[type="tel"]:focus, +input[type="text"]:focus, +input[type="url"]:focus, +input[type="color"]:focus, +input[type="date"]:focus, +input[type="month"]:focus, +input[type="week"]:focus, +input[type="datetime"]:focus, +input[type="datetime-local"]:focus, input:not([type]):focus, textarea:focus, select:focus { @@ -180,8 +186,9 @@ select:focus { } select { - background: url('data:image/svg+xml;utf8,') center right no-repeat; - padding-right: 3.0rem; + background: url('data:image/svg+xml;utf8,') + center right no-repeat; + padding-right: 3rem; } select:focus { @@ -197,7 +204,7 @@ legend { display: block; font-size: 1.6rem; font-weight: 700; - margin-bottom: .5rem; + margin-bottom: 0.5rem; } fieldset { @@ -205,13 +212,13 @@ fieldset { padding: 0; } -input[type='checkbox'], -input[type='radio'] { +input[type="checkbox"], +input[type="radio"] { display: inline; } .label-inline { display: inline-block; font-weight: normal; - margin-left: .5rem; + margin-left: 0.5rem; }