From e8f9eda6e4e32c8533535fc99a3e81c8f6b2a7cf Mon Sep 17 00:00:00 2001
From: Julian Lam <julian@nodebb.org>
Date: Wed, 15 Nov 2017 12:38:40 -0500
Subject: [PATCH 1/2] theme changes for nodebb/nodebb#6069

---
 less/modules/alerts.less | 33 +++++++++++++++++++++++++++++++++
 1 file changed, 33 insertions(+)

diff --git a/less/modules/alerts.less b/less/modules/alerts.less
index d2ebcd8..9ad5444 100644
--- a/less/modules/alerts.less
+++ b/less/modules/alerts.less
@@ -7,6 +7,39 @@
 	bottom: 0px;
 
 	.alert {
+		&::before {
+			position: relative;
+			top: -15px;
+			left: -15px;
+			display: block;
+			height: 2px;
+			width: 0;
+			transition: inherit;
+		}
+
+		&.alert-info::before {
+			background-color: @material-info;
+		}
+
+		&.alert-warning::before {
+			background-color: @material-warning;
+		}
+
+		&.alert-success::before {
+			background-color: @material-success;
+		}
+
+		&.alert-danger::before {
+			background-color: @material-danger;
+		}
+
+		&.animate {
+			&::before {
+				width: ~"calc(100% + 50px)";
+				background-color: lighten(@material-info, 50%);
+			}
+		}
+
 		background-color: white;
 		border: 0;
 		border-left: 5px solid !important;

From 314fa1c61c3b5b568adda666f435d4808a5ee408 Mon Sep 17 00:00:00 2001
From: Julian Lam <julian@nodebb.org>
Date: Thu, 16 Nov 2017 10:10:58 -0500
Subject: [PATCH 2/2] fixed incorrect final colour when transitioning during
 alert timeouts, nodebb/nodebb#6069

---
 less/modules/alerts.less | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

diff --git a/less/modules/alerts.less b/less/modules/alerts.less
index 9ad5444..97168c9 100644
--- a/less/modules/alerts.less
+++ b/less/modules/alerts.less
@@ -34,9 +34,24 @@
 		}
 
 		&.animate {
+			&.alert-info::before {
+				background-color: lighten(@brand-info, 25%);
+			}
+			
+			&.alert-warning::before {
+				background-color: lighten(@brand-warning, 25%);
+			}
+			
+			&.alert-success::before {
+				background-color: lighten(@brand-success, 25%);
+			}
+			
+			&.alert-danger::before {
+				background-color: lighten(@brand-danger, 25%);
+			}
+			
 			&::before {
 				width: ~"calc(100% + 50px)";
-				background-color: lighten(@material-info, 50%);
 			}
 		}