1 files changed, 39 insertions, 0 deletions

diff --git a/src/styles/objects/_message.vars.scss b/src/styles/objects/_message.vars.scss
new file mode 100644
index 0000000..f394894
--- /dev/null
+++ b/src/styles/objects/_message.vars.scss
@@ -0,0 +1,39 @@
+@use "pkg:iro-design/core.vars" as core;
+@use "pkg:iro-design/objects/avatar.vars" as avatar;
+@use "pkg:iro-sass/props";
+
+$avatar-size: props.def(--o-message--avatar-size, props.get(avatar.$size));
+
+$dot-radius: props.def(--o-message--dot-radius, 6px);
+$dot-width: props.def(--o-message--dot-width, 4px);
+
+$spacing-x: props.def(--o-message--spacing-x, props.get(core.$size--200));
+$spacing-y: props.def(--o-message--spacing-y, props.get(core.$size--150));
+$spacing-inner: props.def(--o-message--spacing-inner, props.get(core.$size--500));
+$spacing-outer: props.def(--o-message--spacing-outer, props.get(core.$size--700));
+$spacing-attachments: props.def(--o-message--spacing-attachments, props.get(core.$size--200));
+
+$line-width: props.def(--o-message--line-width, props.get(core.$border-width--medium));
+$line-offset: props.def(
+        --o-message--line-offset,
+        calc(0.5 * props.get($avatar-size) - props.get($line-width))
+);
+$line-curve: props.def(--o-message--line-curve, props.get(core.$size--250));
+
+$attachment-width: props.def(--o-message--attachment-width, props.get(core.$size--2000));
+
+$colors: props.def(
+        --o-message,
+        (
+                --meta: props.get(core.$theme, --text-mute-more),
+                --line: props.get(core.$theme, --border),
+                --dot: (
+                        --border: props.get(core.$theme, --text-mute-more),
+                        --bg: props.get(core.$theme, --bg-base),
+                ),
+                --attachment: (
+                        --bg: props.get(core.$theme, --border-mute),
+                ),
+        ),
+        "color"
+);