pepepper/fluxer
1
0 Fork 0
mirror of https://github.com/fluxerapp/fluxer synced 2026-10-17 21:15:32 +09:00
Code Issues Packages Projects Releases Wiki Activity

fix(app): rework composer layout and footer alignment (#1591)

Browse Source
This commit is contained in:
Hampus authored and GitHub committed 2026-08-14 19:28:22 +02:00
1 parent d56c1e5674
commit 01432bc682
76 files changed
+8772 -8759
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

fluxer_app/src/app/globals.css
+38 -13
View File
@@ -98,13 +98,37 @@ var {
--media-border-radius: 0.25rem;
--input-container-padding: 0.625rem;
--footer-row-height: 4.5rem;
--input-container-min-height: var(--footer-row-height);
--list-row-min-height: 4.5rem;
--input-wrapper-padding-x: 0.5rem;
--input-wrapper-padding-bottom: 0.5rem;
--textarea-top-bar-height: 2.5rem;
--textarea-line-height: 1.375rem;
--textarea-content-offset: calc((var(--user-area-content-height) - var(--textarea-line-height)) / 2);
--footer-box-height: 3.625rem;
--footer-box-inset: 0.375rem;
--footer-box-inset-inline: var(--footer-box-inset);
--footer-box-radius: var(--radius-lg);
--footer-box-inner-inset: 0.5rem;
--outline-frame-border-width: 0.0625rem;
--composer-mobile-box-height: 3rem;
--composer-action-gap: 0.25rem;
--floating-surface-ring-color: color-mix(in srgb, var(--background-modifier-accent) 20%, transparent);
--floating-surface-ring-color-strong: color-mix(in srgb, var(--background-modifier-accent) 45%, transparent);
--footer-box-padding-y: max(0rem, calc((var(--footer-box-height) - var(--textarea-button-height, 2rem)) / 2));
--composer-mobile-padding-y: max(
0rem,
calc((var(--composer-mobile-box-height) - var(--textarea-button-height, 2rem)) / 2)
);
--footer-row-height: calc(var(--footer-box-height) + var(--footer-box-inset) * 2);
--input-container-min-height: var(--footer-row-height);
--textarea-min-height: var(--footer-box-height);
--textarea-padding-y: var(--footer-box-padding-y);
--composer-box-inset: max(0rem, calc((var(--input-container-min-height) - var(--textarea-min-height)) / 2));
--composer-box-inset-inline: min(var(--footer-box-inset), var(--chat-horizontal-padding, var(--spacing-4)));
--composer-box-padding-inline: max(
0rem,
calc(var(--chat-horizontal-padding, var(--spacing-4)) - var(--composer-box-inset-inline))
);
--typing-indicator-height: 1rem;
--typing-pill-height: 1rem;
@@ -113,10 +137,6 @@ var {
--typing-avatar-size: 0.75rem;
--typing-indicator-animation-size: 1rem;
--typing-indicator-gap: 0px;
--typing-upload-column-width: calc(
var(--user-area-content-height) +
(var(--textarea-side-button-padding, 0.34375rem) * 2)
);
--spoiler-border-radius: 0.375rem;
--markup-restricted-inline-icon-baseline-shift: -0.125em;
@@ -145,14 +165,19 @@ var {
--layout-guild-list-width: 4.5rem;
--layout-sidebar-width: 20rem;
--layout-header-height: 3.5rem;
--layout-user-area-height: var(--input-container-min-height);
--layout-user-area-height: var(--footer-box-height);
--layout-user-area-reserved-height: 0px;
--layout-mobile-bottom-nav-reserved-height: 0px;
--user-area-content-height: 2.25rem;
--user-area-padding-y: calc((var(--layout-user-area-height) - var(--user-area-content-height)) / 2);
--user-area-padding-x: var(--spacing-4);
--user-area-box-inset-block-end: calc(var(--footer-box-inset) + var(--outline-frame-border-width));
--user-area-content-height: var(--textarea-button-height, 2rem);
--user-area-padding-y: var(--footer-box-padding-y);
--user-area-padding-x: var(--footer-box-inner-inset);
--user-area-avatar-lead: max(
var(--footer-box-inner-inset),
calc(var(--layout-guild-list-width) / 2 - var(--footer-box-inset-inline) - var(--user-area-content-height) / 2)
);
--voice-connection-padding-y: var(--spacing-2);
--footer-row-padding-y: var(--user-area-padding-y);
--voice-connection-padding-x: var(--footer-box-inner-inset);
--layout-header-popout-width: calc(var(--layout-sidebar-width) - (var(--spacing-4) * 2));
--layout-gap: var(--spacing-4);