M Makefile => Makefile +1 -0
@@ 3,6 3,7 @@
inputs=\
base.scss \
buttons.scss \
+ alerts.scss \
article.scss \
dark.scss \
forms.scss \
A alerts.scss => alerts.scss +15 -0
@@ 0,0 1,15 @@
+$alert-danger-background: #f8d7da;
+$alert-danger-color: #842029;
+$alert-danger-border-color: #f5c6cb;
+
+.alert {
+ padding: 0.5rem;
+ border: 1px solid transparent;
+ margin-bottom: 1rem;
+}
+
+.alert-danger {
+ background: $alert-danger-background;
+ color: $alert-danger-color;
+ border-color: $alert-danger-border-color;
+}
M base.scss => base.scss +1 -0
@@ 6,6 6,7 @@
@import "typography";
@import "utils";
+@import "alerts";
@import "article";
@import "buttons";
@import "forms";
A demo/alerts.html => demo/alerts.html +11 -0
@@ 0,0 1,11 @@
+<!doctype html>
+<html lang="en">
+<meta charset="utf-8" />
+<title>antiweb demo</title>
+<link rel="stylesheet" href="../base.css" />
+<main>
+ <h1>Alerts demo</h1>
+ <div class="alert alert-danger">
+ <strong>Notice!</strong> This is an <code>alert-danger</code> sample.
+ </div>
+</main>