mirror of
https://github.com/Chalarangelo/mini.css.git
synced 2025-09-03 02:42:39 +02:00
Button styling update for consistency
This commit is contained in:
Angelos Chalaris
50
dist/mini-default.css
vendored
50
dist/mini-default.css
vendored
@@ -655,6 +655,7 @@ input:not([type]), [type="text"], [type="email"], [type="number"], [type="search
|
||||
border-color: #bdbdbd; }
|
||||
|
||||
::-webkit-input-placeholder {
|
||||
opacity: 1;
|
||||
color: #616161; }
|
||||
|
||||
::-moz-placeholder {
|
||||
@@ -662,6 +663,7 @@ input:not([type]), [type="text"], [type="email"], [type="number"], [type="search
|
||||
color: #616161; }
|
||||
|
||||
::-ms-placeholder {
|
||||
opacity: 1;
|
||||
color: #616161; }
|
||||
|
||||
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
|
||||
@@ -677,19 +679,19 @@ button {
|
||||
|
||||
button, [type="button"], [type="submit"], [type="reset"], a.button, label.button, .button {
|
||||
display: inline-block;
|
||||
background: rgba(207, 216, 220, 0.75);
|
||||
background: rgba(207, 207, 207, 0.75);
|
||||
color: #212121;
|
||||
border: 0;
|
||||
border-radius: 2px;
|
||||
padding: 4px 6px;
|
||||
margin: 4px;
|
||||
padding: 8px 12px;
|
||||
margin: 8px;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.15);
|
||||
text-decoration: none;
|
||||
-webkit-transition: all 0.3s ease 0s;
|
||||
transition: all 0.3s ease 0s;
|
||||
cursor: pointer; }
|
||||
button:hover, button:active, button:focus, [type="button"]:hover, [type="button"]:active, [type="button"]:focus, [type="submit"]:hover, [type="submit"]:active, [type="submit"]:focus, [type="reset"]:hover, [type="reset"]:active, [type="reset"]:focus, a.button:hover, a.button:active, a.button:focus, label.button:hover, label.button:active, label.button:focus, .button:hover, .button:active, .button:focus {
|
||||
background: #cfd8dc;
|
||||
background: #cfcfcf;
|
||||
opacity: 1; }
|
||||
button:disabled, button[disabled], [type="button"]:disabled, [type="button"][disabled], [type="submit"]:disabled, [type="submit"][disabled], [type="reset"]:disabled, [type="reset"][disabled], a.button:disabled, a.button[disabled], label.button:disabled, label.button[disabled], .button:disabled, .button[disabled] {
|
||||
cursor: not-allowed;
|
||||
@@ -711,8 +713,10 @@ input[type="file"] {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
border: 1px solid #bdbdbd;
|
||||
border-radius: 2px; }
|
||||
border: 1px solid #9e9e9e;
|
||||
border-radius: 2px;
|
||||
margin: 8px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 2px 3px rgba(0, 0, 0, 0.15); }
|
||||
.button-group button, .button-group [type="button"], .button-group [type="submit"], .button-group [type="reset"], .button-group a.button, .button-group label.button, .button-group .button {
|
||||
margin: 0;
|
||||
-webkit-box-flex: 1;
|
||||
@@ -723,9 +727,10 @@ input[type="file"] {
|
||||
flex-basis: 0;
|
||||
text-align: center;
|
||||
border: 0;
|
||||
border-radius: 0; }
|
||||
border-radius: 0;
|
||||
box-shadow: none; }
|
||||
.button-group button + button, .button-group button + [type="button"], .button-group button + [type="submit"], .button-group button + [type="reset"], .button-group button + a.button, .button-group button + label.button, .button-group button + .button, .button-group [type="button"] + button, .button-group [type="button"] + [type="button"], .button-group [type="button"] + [type="submit"], .button-group [type="button"] + [type="reset"], .button-group [type="button"] + a.button, .button-group [type="button"] + label.button, .button-group [type="button"] + .button, .button-group [type="submit"] + button, .button-group [type="submit"] + [type="button"], .button-group [type="submit"] + [type="submit"], .button-group [type="submit"] + [type="reset"], .button-group [type="submit"] + a.button, .button-group [type="submit"] + label.button, .button-group [type="submit"] + .button, .button-group [type="reset"] + button, .button-group [type="reset"] + [type="button"], .button-group [type="reset"] + [type="submit"], .button-group [type="reset"] + [type="reset"], .button-group [type="reset"] + a.button, .button-group [type="reset"] + label.button, .button-group [type="reset"] + .button, .button-group a.button + button, .button-group a.button + [type="button"], .button-group a.button + [type="submit"], .button-group a.button + [type="reset"], .button-group a.button + a.button, .button-group a.button + label.button, .button-group a.button + .button, .button-group label.button + button, .button-group label.button + [type="button"], .button-group label.button + [type="submit"], .button-group label.button + [type="reset"], .button-group label.button + a.button, .button-group label.button + label.button, .button-group label.button + .button, .button-group .button + button, .button-group .button + [type="button"], .button-group .button + [type="submit"], .button-group .button + [type="reset"], .button-group .button + a.button, .button-group .button + label.button, .button-group .button + .button {
|
||||
border-left: 1px solid #bdbdbd; }
|
||||
border-left: 1px solid #9e9e9e; }
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.button-group {
|
||||
@@ -734,7 +739,7 @@ input[type="file"] {
|
||||
flex-direction: column; }
|
||||
.button-group button + button, .button-group button + [type="button"], .button-group button + [type="submit"], .button-group button + [type="reset"], .button-group button + a.button, .button-group button + label.button, .button-group button + .button, .button-group [type="button"] + button, .button-group [type="button"] + [type="button"], .button-group [type="button"] + [type="submit"], .button-group [type="button"] + [type="reset"], .button-group [type="button"] + a.button, .button-group [type="button"] + label.button, .button-group [type="button"] + .button, .button-group [type="submit"] + button, .button-group [type="submit"] + [type="button"], .button-group [type="submit"] + [type="submit"], .button-group [type="submit"] + [type="reset"], .button-group [type="submit"] + a.button, .button-group [type="submit"] + label.button, .button-group [type="submit"] + .button, .button-group [type="reset"] + button, .button-group [type="reset"] + [type="button"], .button-group [type="reset"] + [type="submit"], .button-group [type="reset"] + [type="reset"], .button-group [type="reset"] + a.button, .button-group [type="reset"] + label.button, .button-group [type="reset"] + .button, .button-group a.button + button, .button-group a.button + [type="button"], .button-group a.button + [type="submit"], .button-group a.button + [type="reset"], .button-group a.button + a.button, .button-group a.button + label.button, .button-group a.button + .button, .button-group label.button + button, .button-group label.button + [type="button"], .button-group label.button + [type="submit"], .button-group label.button + [type="reset"], .button-group label.button + a.button, .button-group label.button + label.button, .button-group label.button + .button, .button-group .button + button, .button-group .button + [type="button"], .button-group .button + [type="submit"], .button-group .button + [type="reset"], .button-group .button + a.button, .button-group .button + label.button, .button-group .button + .button {
|
||||
border: 0;
|
||||
border-top: 1px solid #bdbdbd; } }
|
||||
border-top: 1px solid #9e9e9e; } }
|
||||
[type="checkbox"], [type="radio"] {
|
||||
height: 1px;
|
||||
width: 1px;
|
||||
@@ -1309,13 +1314,13 @@ ul.breadcrumbs {
|
||||
|
||||
button.primary, [type="button"].primary, [type="submit"].primary,
|
||||
[type="reset"].primary, .button.primary {
|
||||
background: #1565c0;
|
||||
background: rgba(2, 119, 189, 0.9);
|
||||
color: #f5f5f5; }
|
||||
button.primary:hover, button.primary:active, button.primary:focus, [type="button"].primary:hover, [type="button"].primary:active, [type="button"].primary:focus, [type="submit"].primary:hover, [type="submit"].primary:active, [type="submit"].primary:focus,
|
||||
[type="reset"].primary:hover,
|
||||
[type="reset"].primary:active,
|
||||
[type="reset"].primary:focus, .button.primary:hover, .button.primary:active, .button.primary:focus {
|
||||
background: rgba(21, 101, 192, 0.85); }
|
||||
background: #0277bd; }
|
||||
|
||||
button.secondary, [type="button"].secondary, [type="submit"].secondary,
|
||||
[type="reset"].secondary, .button.secondary {
|
||||
@@ -1329,24 +1334,35 @@ button.secondary, [type="button"].secondary, [type="submit"].secondary,
|
||||
|
||||
button.tertiary, [type="button"].tertiary, [type="submit"].tertiary,
|
||||
[type="reset"].tertiary, .button.tertiary {
|
||||
background: rgba(139, 195, 74, 0.8); }
|
||||
background: rgba(85, 139, 47, 0.85);
|
||||
color: #f5f5f5; }
|
||||
button.tertiary:hover, button.tertiary:active, button.tertiary:focus, [type="button"].tertiary:hover, [type="button"].tertiary:active, [type="button"].tertiary:focus, [type="submit"].tertiary:hover, [type="submit"].tertiary:active, [type="submit"].tertiary:focus,
|
||||
[type="reset"].tertiary:hover,
|
||||
[type="reset"].tertiary:active,
|
||||
[type="reset"].tertiary:focus, .button.tertiary:hover, .button.tertiary:active, .button.tertiary:focus {
|
||||
background: #8bc34a; }
|
||||
background: #558b2f; }
|
||||
|
||||
button.inverse, [type="button"].inverse, [type="submit"].inverse,
|
||||
[type="reset"].inverse, .button.inverse {
|
||||
background: #212121;
|
||||
color: #fafafa; }
|
||||
button.inverse:hover, button.inverse:active, button.inverse:focus, [type="button"].inverse:hover, [type="button"].inverse:active, [type="button"].inverse:focus, [type="submit"].inverse:hover, [type="submit"].inverse:active, [type="submit"].inverse:focus,
|
||||
[type="reset"].inverse:hover,
|
||||
[type="reset"].inverse:active,
|
||||
[type="reset"].inverse:focus, .button.inverse:hover, .button.inverse:active, .button.inverse:focus {
|
||||
background: rgba(33, 33, 33, 0.9); }
|
||||
|
||||
button.small, [type="button"].small, [type="submit"].small,
|
||||
[type="reset"].small, .button.small {
|
||||
border-radius: 1px;
|
||||
padding: 1px 2px;
|
||||
margin: 2px; }
|
||||
padding: 4px 6px;
|
||||
margin: 6px 8px; }
|
||||
|
||||
button.large, [type="button"].large, [type="submit"].large,
|
||||
[type="reset"].large, .button.large {
|
||||
border-radius: 4px;
|
||||
padding: 10px 15px;
|
||||
margin: 7px; }
|
||||
padding: 12px 18px;
|
||||
margin: 10px 8px; }
|
||||
|
||||
@media (min-width: 480px) {
|
||||
.card.large {
|
||||
|
||||
Reference in New Issue
Block a user