1 files changed, 11 insertions, 0 deletions
diff --git a/internal/web/static/blog.css b/internal/web/static/blog.css
index b09689b..a3695ae 100644
--- a/internal/web/static/blog.css
+++ b/internal/web/static/blog.css
@@ -29,6 +29,14 @@ img { max-width: 100%; height: auto; }
 .post-body table { border-collapse: collapse; }
 .post-body th, .post-body td { border: 1px solid rgba(0,0,0,0.15); padding: 0.3em 0.6em; }
 .post-body hr { border: 0; border-top: 1px solid rgba(0,0,0,0.15); }
+/* announcements: translucent tints so they sit on any theme colour */
+.notice { margin: 0 0 1.5em; padding: 0.8em 1em; border: 1px solid rgba(0,0,0,0.15); }
+.notice-note { background: rgba(255, 200, 60, 0.18); border-left: 5px solid rgba(210, 150, 0, 0.85); }
+.notice-warning { background: rgba(220, 60, 40, 0.10); border-left: 5px solid rgba(190, 40, 30, 0.85); }
+.notice-title { margin: 0 0 0.3em; font-size: 1em; text-transform: uppercase; letter-spacing: 0.05em; }
+.notice-body > :first-child { margin-top: 0; }
+.notice-body > :last-child { margin-bottom: 0; }
+.content > .notice:last-child { margin: 1.5em 0 0; }
 .pager { margin-top: 2em; padding-top: 1em; border-top: 1px solid rgba(0,0,0,0.1); text-align: center; }
 .pager a, .pager span { margin: 0 0.8em; }
 .muted { opacity: 0.7; }
@@ -41,10 +49,13 @@ img { max-width: 100%; height: auto; }
 .nav-left-sidebar .body-wrap .site-nav a { display: block; padding: 0.4em 1em; }
 .nav-left-sidebar .body-wrap .site-nav .nav-inner { padding: 0; }
 .nav-left-sidebar .body-wrap .content { margin-left: 200px; }
+.nav-left-sidebar .body-wrap .sidebar-notices { float: left; clear: left; width: 180px; margin-top: 1em; }
+.nav-left-sidebar .body-wrap .sidebar-notices .notice { font-size: 0.9em; padding: 0.6em 0.8em; }
 @media (max-width: 700px) {
   .content { padding: 1em; }
   .site-title { font-size: 1.5em; }
   .nav-left-sidebar .body-wrap .site-nav { float: none; width: auto; margin-bottom: 1em; }
   .nav-left-sidebar .body-wrap .site-nav a { display: inline-block; }
   .nav-left-sidebar .body-wrap .content { margin-left: 0; }
+  .nav-left-sidebar .body-wrap .sidebar-notices { float: none; width: auto; margin: 0 0 1em; }
 }