summaryrefslogtreecommitdiffstats
path: root/app/common/styles/components
diff options
context:
space:
mode:
authorYoshie Muranaka <yoshiemuranaka@gmail.com>2019-11-04 10:07:32 -0800
committerGunnar Mills <gmills@us.ibm.com>2019-11-26 16:33:21 +0000
commit0d11902c896bc65196489a50be55d16ca24da1cf (patch)
tree2a65835cba827da869cd34365030e6453c4f250c /app/common/styles/components
parent1ab0f7c1d59e3ccae14d92ba865ec52c53772ca2 (diff)
downloadphosphor-webui-0d11902c896bc65196489a50be55d16ca24da1cf.tar.gz
phosphor-webui-0d11902c896bc65196489a50be55d16ca24da1cf.zip
Create alert banner component
This reusuable component will help to make sure banner implementations are consistent and will help reduce redundant code. Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com> Change-Id: I3a16f65d36c2d61abf54c300e2ed5defeadee298
Diffstat (limited to 'app/common/styles/components')
-rw-r--r--app/common/styles/components/alert-banner.scss30
-rw-r--r--app/common/styles/components/index.scss3
2 files changed, 32 insertions, 1 deletions
diff --git a/app/common/styles/components/alert-banner.scss b/app/common/styles/components/alert-banner.scss
new file mode 100644
index 0000000..8df9486
--- /dev/null
+++ b/app/common/styles/components/alert-banner.scss
@@ -0,0 +1,30 @@
+.alert-banner {
+ padding: 1rem 1rem 0.75rem;
+ border-left-width: 3px;
+ border-left-style: solid;
+ display: flex;
+ .status-icon {
+ margin-right: 1rem;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ width: 1.2rem;
+ }
+}
+
+.alert-banner--error {
+ background-color: $notification-error--light;
+ border-left-color: $notification-error--dark;
+}
+.alert-banner--success {
+ background-color: $notification-success--light;
+ border-left-color: $notification-success--dark;
+}
+.alert-banner--warn {
+ background-color: $notification-warn--light;
+ border-left-color: $notification-warn--dark;
+}
+.alert-banner--info {
+ background-color: $notification-info--light;
+ border-left-color: $notification-info--dark;
+} \ No newline at end of file
diff --git a/app/common/styles/components/index.scss b/app/common/styles/components/index.scss
index fc36b38..3a4bdb7 100644
--- a/app/common/styles/components/index.scss
+++ b/app/common/styles/components/index.scss
@@ -1,2 +1,3 @@
@import "./form-elements.scss";
-@import "./table.scss"; \ No newline at end of file
+@import "./table.scss";
+@import "./alert-banner.scss"; \ No newline at end of file
OpenPOWER on IntegriCloud