More style shuffling

2025-01-10 15:12:59 +00:00
parent 6f7268f941
commit 07fcb7ee6b
2 changed files with 22 additions and 15 deletions
@@ -11,22 +11,27 @@

 .notification {
  position: absolute;
-  background-color: #eee;
-  border-radius: 6px;
-  border: solid 1px #ccc;
-  padding: 1rem;
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  width: 40ch;
+  padding: 4px;
  bottom: 0;
+  border-radius: 6px;

-  color: black;
-
-  &:visited {
+  & .notification--content {
+    border-radius: 6px;
+    background-color: #eee;
+    border: solid 1px black;
+    padding: 1rem;
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    width: 40ch;
    color: black;
+
+    &:visited {
+      color: black;
+    }
  }

+
  transform: translateY(var(--offset));
  z-index: var(--z-index);
  transition: transform 0.2s;
@@ -1,7 +1,9 @@
 <%= notification_tag notification do %>
-  <div class="avatar txt-small">
-    <%= avatar_image_tag(notification.creator) %>
-  </div>
+  <div class="notification--content shadow">
+    <div class="avatar txt-small">
+      <%= avatar_image_tag(notification.creator) %>
+    </div>

-  <%= notification.body %>
+    <%= notification.body %>
+  </div>
 <% end %>