From cf2ffc5ecb2eefbb425a4d05583d3e4d9645bf2b Mon Sep 17 00:00:00 2001
From: cel 🌸 <cel@bunny.garden>
Date: Sat, 10 May 2025 02:31:40 +0100
Subject: feat: presences and presence icons

---
 assets/icons/available16color.svg |  3 +++
 assets/icons/away16color.svg      |  2 +-
 assets/icons/chat16color.svg      | 10 ++++++++++
 assets/icons/dnd16color.svg       |  2 +-
 assets/icons/xa16color.svg        | 10 ++++++++++
 assets/style.scss                 | 15 +++++++++++++++
 6 files changed, 40 insertions(+), 2 deletions(-)
 create mode 100644 assets/icons/available16color.svg
 create mode 100644 assets/icons/chat16color.svg
 create mode 100644 assets/icons/xa16color.svg

(limited to 'assets')

diff --git a/assets/icons/available16color.svg b/assets/icons/available16color.svg
new file mode 100644
index 0000000..e54c2f7
--- /dev/null
+++ b/assets/icons/available16color.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="8" cy="8" r="6" fill="#87EE23" stroke="#66BF10" stroke-width="2"/>
+</svg>
diff --git a/assets/icons/away16color.svg b/assets/icons/away16color.svg
index e35da57..8803c51 100644
--- a/assets/icons/away16color.svg
+++ b/assets/icons/away16color.svg
@@ -1,6 +1,6 @@
 <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
 <g clip-path="url(#clip0_204_583)">
-<path d="M12.3949 3.68876C14.4905 5.78437 14.3985 9.52573 11.8703 12.0539C9.3422 14.582 5.60084 14.674 3.50523 12.5784C2.7029 11.7761 2.22277 10.747 2.07449 9.63325C2.10824 9.63849 2.14189 9.64327 2.17541 9.64762C2.83698 9.73336 3.54898 9.66529 4.21793 9.51478C5.52363 9.22102 6.93329 8.5485 7.73555 7.67748C8.50721 6.83967 9.11302 5.50754 9.35486 4.24412C9.47772 3.60222 9.51846 2.91991 9.40702 2.28141C9.4053 2.27156 9.40354 2.2617 9.40175 2.25184C10.5339 2.39262 11.5812 2.87506 12.3949 3.68876Z" fill="#FFCE07" stroke="black" stroke-width="2"/>
+<path d="M3.50535 12.5786C2.70294 11.7762 2.22417 10.7466 2.07594 9.63274C2.10924 9.6379 2.1423 9.64365 2.17538 9.64793C2.83692 9.73367 3.54906 9.66584 4.21798 9.51535C5.52368 9.22158 6.9333 8.54817 7.73556 7.67715C8.50707 6.83941 9.11299 5.50773 9.35486 4.2445C9.47773 3.60261 9.51808 2.91981 9.40665 2.28132C9.40504 2.27208 9.40281 2.26294 9.40112 2.25369C10.5335 2.39442 11.5815 2.87482 12.3953 3.68862C14.4907 5.78422 14.3984 9.52565 11.8705 12.0538C9.34237 14.5819 5.60098 14.674 3.50535 12.5786Z" fill="#FFCE07" stroke="#D0A700" stroke-width="2"/>
 </g>
 <defs>
 <clipPath id="clip0_204_583">
diff --git a/assets/icons/chat16color.svg b/assets/icons/chat16color.svg
new file mode 100644
index 0000000..d4a2479
--- /dev/null
+++ b/assets/icons/chat16color.svg
@@ -0,0 +1,10 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_214_198)">
+<path d="M2.32171 6.75399C2.68825 5.71497 3.48076 4.5717 5.03364 3.5225L5.3547 3.31455C6.12876 2.83032 7.54957 2.29008 9.04407 2.20066C10.4342 2.11758 11.7523 2.42625 12.7153 3.37165L12.9029 3.56876C13.9254 4.72163 14.072 6.07691 13.6105 7.33885C13.1668 8.55207 12.1506 9.68103 10.7797 10.3505L10.5014 10.4785C8.79928 11.2069 7.43339 11.1579 6.19304 11.2025L5.12138 11.2413L5.23485 12.3081C5.2644 12.5851 5.38057 12.8882 5.48855 13.128C5.52044 13.1988 5.5553 13.2722 5.59296 13.3471C5.19706 13.1688 4.81599 12.9476 4.45863 12.6893C3.44189 11.9544 2.68078 10.9727 2.32417 9.99369L2.25848 9.79823C1.99751 8.95405 1.92678 7.87353 2.32171 6.75399Z" fill="#87EE23" stroke="#66BF10" stroke-width="2"/>
+</g>
+<defs>
+<clipPath id="clip0_214_198">
+<rect width="16" height="16" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/assets/icons/dnd16color.svg b/assets/icons/dnd16color.svg
index e69cbe3..8e18fae 100644
--- a/assets/icons/dnd16color.svg
+++ b/assets/icons/dnd16color.svg
@@ -1,3 +1,3 @@
 <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M6 14L2 10V6L6 2H10L14 6V10L10 14H6Z" fill="#C1173C" stroke="black" stroke-width="2"/>
+<path d="M6 14L2 10V6L6 2H10L14 6V10L10 14H6Z" fill="#C1173C" stroke="#8B0C28" stroke-width="2"/>
 </svg>
diff --git a/assets/icons/xa16color.svg b/assets/icons/xa16color.svg
new file mode 100644
index 0000000..1e3643e
--- /dev/null
+++ b/assets/icons/xa16color.svg
@@ -0,0 +1,10 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_214_392)">
+<path d="M3.50535 12.5786C2.70294 11.7762 2.22417 10.7466 2.07594 9.63274C2.10924 9.6379 2.1423 9.64365 2.17538 9.64793C2.83692 9.73367 3.54906 9.66584 4.21798 9.51535C5.52368 9.22158 6.9333 8.54817 7.73556 7.67715C8.50707 6.83941 9.11299 5.50773 9.35486 4.2445C9.47773 3.60261 9.51808 2.91981 9.40665 2.28132C9.40504 2.27208 9.40281 2.26294 9.40112 2.25369C10.5335 2.39442 11.5815 2.87482 12.3953 3.68862C14.4907 5.78422 14.3984 9.52565 11.8705 12.0538C9.34237 14.5819 5.60098 14.674 3.50535 12.5786Z" fill="#F99E36" stroke="#D06F00" stroke-width="2"/>
+</g>
+<defs>
+<clipPath id="clip0_214_392">
+<rect width="16" height="16" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/assets/style.scss b/assets/style.scss
index 14909c5..b03393c 100644
--- a/assets/style.scss
+++ b/assets/style.scss
@@ -1,4 +1,8 @@
 /* App-wide styling */
+img {
+  display: block;
+}
+
 body {
   max-width: 100vw;
   max-height: 100vh;
@@ -163,6 +167,7 @@ p {
 
 .chats-list-item, .roster-list-item, {
   display: flex;
+  align-items: start;
   gap: 8px;
   border-radius: 1em;
   padding: 0.5em;
@@ -456,6 +461,16 @@ p {
   padding: 4px 8px;
 }
 
+.avatar-with-presence {
+  position: relative;
+}
+
+.avatar-with-presence>.presence-show-icon {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+}
+
 /* font-families */
 
 /* thai */
-- 
cgit