notifications lua example

1 files changed, 69 insertions, 0 deletions

diff --git a/examples/lua/notification-popups/style.scss b/examples/lua/notification-popups/style.scss
new file mode 100644
index 0000000..8eb764a
--- /dev/null
+++ b/examples/lua/notification-popups/style.scss
@@ -0,0 +1,69 @@
+$bg: #212223;
+$fg: #f1f1f1;
+$accent: #378df7;
+$radius: 7px;
+
+window.notification-popups {
+  box.notifications {
+    padding: 0.5em;
+  }
+}
+
+.icon {
+  min-width: 68px;
+  min-height: 68px;
+  margin-right: 1em;
+}
+
+.icon {
+  icon {
+    font-size: 58px;
+    margin: 5px;
+    color: $fg;
+  }
+  box {
+    min-width: 68px;
+    min-height: 68px;
+    border-radius: $radius;
+    background-size: contain;
+    background-repeat: no-repeat;
+    background-position: center;
+  }
+}
+
+.notification {
+  min-width: 350px;
+  border-radius: 11px;
+  padding: 1em;
+  margin: 0.5em;
+  border: 1px solid transparentize($fg, 0.9);
+  background-color: $bg;
+
+  &.critical {
+    border: 1px solid $accent;
+  }
+
+  .title {
+    color: $fg;
+    font-size: 1.4em;
+  }
+
+  .body {
+    color: transparentize($fg, 0.4);
+  }
+
+  .actions {
+    .action-button {
+      margin: 0 0.4em;
+      margin-top: 0.8em;
+
+      &:first-child {
+        margin-left: 0;
+      }
+
+      &:last-child {
+        margin-right: 0;
+      }
+    }
+  }
+}