2014-07-07 23:46:32 +08:00
|
|
|
.alert {
|
|
|
|
padding: 8px 35px 8px 14px;
|
|
|
|
background-color: scale-color($danger, $lightness: 75%);
|
|
|
|
color: #c09853;
|
|
|
|
|
|
|
|
.close {
|
|
|
|
position: relative;
|
|
|
|
top: -2px;
|
|
|
|
right: -21px;
|
|
|
|
line-height: 18px;
|
|
|
|
float: right;
|
2014-12-16 11:12:56 +08:00
|
|
|
font-size: 1.429em;
|
2014-07-07 23:46:32 +08:00
|
|
|
font-weight: bold;
|
|
|
|
color: $primary;
|
|
|
|
opacity: 0.2;
|
|
|
|
filter: alpha(opacity = 20);
|
|
|
|
@include hover {
|
|
|
|
color: $primary;
|
|
|
|
text-decoration: none;
|
|
|
|
cursor: pointer;
|
|
|
|
opacity: 0.4;
|
|
|
|
filter: alpha(opacity = 40);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
button.close {
|
|
|
|
padding: 0;
|
|
|
|
cursor: pointer;
|
|
|
|
background: transparent;
|
|
|
|
border: 0;
|
|
|
|
-webkit-appearance: none;
|
|
|
|
}
|
|
|
|
&.alert-success {
|
2014-08-06 21:31:13 +08:00
|
|
|
background-color: dark-light-diff($success, $secondary, 50%, -60%);
|
|
|
|
color: $primary;
|
2014-07-07 23:46:32 +08:00
|
|
|
}
|
|
|
|
&.alert-error {
|
2014-08-06 21:31:13 +08:00
|
|
|
background-color: rgba(dark-light-diff($danger, $secondary, 50%, -60%), .5);
|
|
|
|
color: $primary;
|
2014-07-07 23:46:32 +08:00
|
|
|
}
|
|
|
|
&.alert-info {
|
2015-05-20 09:10:40 +08:00
|
|
|
background-color: dark-light-diff($tertiary, $secondary, 85%, -65%);
|
2014-07-07 23:46:32 +08:00
|
|
|
color: $primary;
|
2016-04-26 12:36:28 +08:00
|
|
|
&.clickable {
|
2016-04-25 06:24:17 +08:00
|
|
|
color: $tertiary;
|
|
|
|
}
|
2014-07-07 23:46:32 +08:00
|
|
|
}
|
|
|
|
}
|