diff --git a/public/css/default.css b/public/css/default.css index 861d2577..020da75e 100644 --- a/public/css/default.css +++ b/public/css/default.css @@ -375,34 +375,59 @@ footer a { input, select, .btn { background: #fff; - border: 1px solid #ccc; + border: 1px solid #dbdbdb; + border-radius: 4px; color: #000; font: 13px/1.7 "Open Sans", "Helvetica", sans-serif; padding: 3px; } -input[type=submit], button, .btn { - background: #ddd; - border-radius: 3px; - border: 1px solid #aaa; - display: inline-block; - font: inherit; - padding: 4px 5px; -} -input[type=submit]:hover, button:hover, .btn:hover { - background-color: #d0d0d0; - border-color: #a0a0a0; -} textarea { - border: 1px solid #ccc; - font: 12px/1.4 'Monaco', 'Inconsolata', 'DejaVu Sans Mono', monospace; + border: 1px solid #dbdbdb; + border-radius: 4px; + font: 14px/1.4 'Inconsolata', 'DejaVu Sans Mono', monospace; padding: 0.75%; - width: 98.5%; } + +input[type=submit], button, .btn { + background-color: #eee; + border-color: #dbdbdb; + border-width: 1px; + border-radius: 4px; + color: #363636; + cursor: pointer; + display: inline-block; + justify-content: center; + padding-bottom: calc(0.4em - 1px); + padding-left: 0.8em; + padding-right: 0.8em; + padding-top: calc(0.4em - 1px); + text-align: center; + white-space: nowrap; +} +input:hover, select:hover, button:hover, .btn:hover { + border-color: #b5b5b5; +} +input:focus, select:focus, button:focus, .btn:focus { + border-color: #3273dc; +} +input:focus:not(:active), select:focus:not(:active), button:focus:not(:active), .btn:focus:not(:active) { + box-shadow: 0px 0px 0px 2px rgba(50, 115, 220, 0.25); +} +input:active, select:active, button:active, .btn:active { + border-color: #4a4a4a; +} + .btn-red { - background: #F3B076; - border-color: #C98245; + background: #eebbaa; + border-color: #cc9988; +} +.btn-red:hover, .btn-red:focus { + border-color: #bb7766; color: #000; } +.btn-red:focus:not(:active) { + box-shadow: 0px 0px 0px 2px rgba(241, 70, 104, 0.25); +} /* Login box styles