Skip to content

Instantly share code, notes, and snippets.

@tbuyle
Last active June 25, 2020 07:12
Show Gist options
  • Save tbuyle/f0be059dc65eb10d75d594a9fb4a0df3 to your computer and use it in GitHub Desktop.
Save tbuyle/f0be059dc65eb10d75d594a9fb4a0df3 to your computer and use it in GitHub Desktop.
Material Alert (prototype for djibe / material)
.alert {
background-color: #fff;
border-top-left-radius: 0;
border-top-right-radius: 0;
border-top: 0;
border-left: 0;
.container:before {
@extend .navbar-toggler-icon;
content: "info";
vertical-align: middle;
font-size: 250%;
}
@each $color, $values in $theme-colors {
&.alert-#{$color} .container:before {
color: theme-color($color);
}
}
&.alert-success .container:before {
content: "check"
}
&.alert-warning .container:before {
content: "priority_high"
}
&.alert-danger .container:before {
content: "clear"
}
&.alert-info .container:before {
content: "notifications_none"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment