aboutsummaryrefslogtreecommitdiffstats
path: root/old-apps/web-shared/src/styles/components/alert.scss
diff options
context:
space:
mode:
authorivarlovlie <git@ivarlovlie.no>2022-09-20 09:24:27 +0200
committerivarlovlie <git@ivarlovlie.no>2022-09-20 09:24:27 +0200
commita9072370ca1eb9a5cce928b1d487db0f307edea6 (patch)
tree59c3c23df930a8b5f888dc7813923abf4ceefed4 /old-apps/web-shared/src/styles/components/alert.scss
parent56fa963a1d63cbe0bf28e29e717cceaa417c45c1 (diff)
downloadgreatoffice-a9072370ca1eb9a5cce928b1d487db0f307edea6.tar.xz
greatoffice-a9072370ca1eb9a5cce928b1d487db0f307edea6.zip
feat: Move old apps into it's own directory
Diffstat (limited to 'old-apps/web-shared/src/styles/components/alert.scss')
-rw-r--r--old-apps/web-shared/src/styles/components/alert.scss69
1 files changed, 69 insertions, 0 deletions
diff --git a/old-apps/web-shared/src/styles/components/alert.scss b/old-apps/web-shared/src/styles/components/alert.scss
new file mode 100644
index 0000000..9d9008d
--- /dev/null
+++ b/old-apps/web-shared/src/styles/components/alert.scss
@@ -0,0 +1,69 @@
+@use '../base' as *;
+
+/* --------------------------------
+
+File#: _1_alert
+Title: Alert
+Descr: Feedback message
+Usage: codyhouse.co/license
+
+-------------------------------- */
+
+.alert {
+ background-color: alpha(var(--color-primary), 0.2);
+ color: var(--color-contrast-higher);
+
+ // hide element
+ position: absolute;
+ clip: rect(1px, 1px, 1px, 1px);
+ clip-path: inset(50%);
+}
+
+.alert__icon {
+ color: var(--color-primary);
+}
+
+.alert__close-btn {
+ display: inline-block;
+
+ .icon {
+ display: block;
+ }
+
+ &:hover {
+ opacity: 0.7;
+ }
+}
+
+// themes
+.alert--success {
+ background-color: alpha(var(--color-success), 0.2);
+
+ .alert__icon {
+ color: var(--color-success);
+ }
+}
+
+.alert--error {
+ background-color: alpha(var(--color-error), 0.2);
+
+ .alert__icon {
+ color: var(--color-error);
+ }
+}
+
+.alert--warning {
+ background-color: alpha(var(--color-warning), 0.2);
+
+ .alert__icon {
+ color: var(--color-warning);
+ }
+}
+
+// toggle visibility
+.alert--is-visible {
+ position: static;
+ clip: auto;
+ clip-path: none;
+}
+