feat: allow overrides
This commit is contained in:
@@ -119,6 +119,14 @@
|
||||
--bubble-bot-bg: var(--solid-iris);
|
||||
--bubble-bot-text: var(--slate-12);
|
||||
|
||||
// Bubble spacing (ratio of 1 = default, 1.5 = 50% larger, 0.5 = 50% smaller)
|
||||
--bubble-spacing-ratio: 1;
|
||||
--bubble-radius: calc(0.75rem * var(--bubble-spacing-ratio));
|
||||
--bubble-radius-sm: calc(0.125rem * var(--bubble-spacing-ratio));
|
||||
--bubble-radius-md: calc(0.375rem * var(--bubble-spacing-ratio));
|
||||
--bubble-radius-lg: calc(0.5rem * var(--bubble-spacing-ratio));
|
||||
--bubble-padding: calc(0.75rem * var(--bubble-spacing-ratio));
|
||||
|
||||
--alpha-1: 67, 67, 67, 0.06;
|
||||
--alpha-2: 201, 202, 207, 0.15;
|
||||
--alpha-3: 255, 255, 255, 0.96;
|
||||
@@ -244,6 +252,14 @@
|
||||
--bubble-bot-bg: var(--solid-iris);
|
||||
--bubble-bot-text: var(--slate-12);
|
||||
|
||||
// Bubble spacing (inherited from light mode, can be overridden)
|
||||
--bubble-spacing-ratio: 1;
|
||||
--bubble-radius: calc(0.75rem * var(--bubble-spacing-ratio));
|
||||
--bubble-radius-sm: calc(0.125rem * var(--bubble-spacing-ratio));
|
||||
--bubble-radius-md: calc(0.375rem * var(--bubble-spacing-ratio));
|
||||
--bubble-radius-lg: calc(0.5rem * var(--bubble-spacing-ratio));
|
||||
--bubble-padding: calc(0.75rem * var(--bubble-spacing-ratio));
|
||||
|
||||
--alpha-1: 36, 36, 36, 0.8;
|
||||
--alpha-2: 139, 147, 182, 0.15;
|
||||
--alpha-3: 36, 38, 45, 0.9;
|
||||
|
||||
@@ -38,10 +38,10 @@ const varaintBaseMap = {
|
||||
|
||||
const orientationMap = {
|
||||
[ORIENTATION.LEFT]:
|
||||
'left-bubble rounded-xl ltr:rounded-bl-sm rtl:rounded-br-sm',
|
||||
'left-bubble rounded-[var(--bubble-radius)] ltr:rounded-bl-[var(--bubble-radius-sm)] rtl:rounded-br-[var(--bubble-radius-sm)]',
|
||||
[ORIENTATION.RIGHT]:
|
||||
'right-bubble rounded-xl ltr:rounded-br-sm rtl:rounded-bl-sm',
|
||||
[ORIENTATION.CENTER]: 'rounded-md',
|
||||
'right-bubble rounded-[var(--bubble-radius)] ltr:rounded-br-[var(--bubble-radius-sm)] rtl:rounded-bl-[var(--bubble-radius-sm)]',
|
||||
[ORIENTATION.CENTER]: 'rounded-[var(--bubble-radius-md)]',
|
||||
};
|
||||
|
||||
const flexOrientationClass = computed(() => {
|
||||
@@ -60,7 +60,7 @@ const messageClass = computed(() => {
|
||||
if (variant.value !== MESSAGE_VARIANTS.ACTIVITY) {
|
||||
classToApply.push(orientationMap[orientation.value]);
|
||||
} else {
|
||||
classToApply.push('rounded-lg');
|
||||
classToApply.push('rounded-[var(--bubble-radius-lg)]');
|
||||
}
|
||||
|
||||
return classToApply;
|
||||
|
||||
@@ -23,7 +23,6 @@ const attachment = computed(() => {
|
||||
|
||||
const { isLoaded, hasError, loadWithRetry } = useLoadWithRetry();
|
||||
|
||||
const showGallery = ref(false);
|
||||
const isDownloading = ref(false);
|
||||
const { showGallery, isGalleryAllowed, toggleGallery } = useGallery();
|
||||
|
||||
|
||||
Reference in New Issue
Block a user