diff options
| author | syuilo <4439005+syuilo@users.noreply.github.com> | 2025-04-27 19:55:56 +0900 |
|---|---|---|
| committer | syuilo <4439005+syuilo@users.noreply.github.com> | 2025-04-27 19:55:56 +0900 |
| commit | 0a1ff77f23f0fdbc569f6184bad74ae86cd45a2e (patch) | |
| tree | 843a0a59cd57214f4aa2611509270746cb2f9725 /packages/frontend/src/style.scss | |
| parent | Update CHANGELOG.md (diff) | |
| download | misskey-0a1ff77f23f0fdbc569f6184bad74ae86cd45a2e.tar.gz misskey-0a1ff77f23f0fdbc569f6184bad74ae86cd45a2e.tar.bz2 misskey-0a1ff77f23f0fdbc569f6184bad74ae86cd45a2e.zip | |
perf(frontend): use css-native implementation for spacer rather than vue component
Diffstat (limited to 'packages/frontend/src/style.scss')
| -rw-r--r-- | packages/frontend/src/style.scss | 24 |
1 files changed, 24 insertions, 0 deletions
diff --git a/packages/frontend/src/style.scss b/packages/frontend/src/style.scss index 9a3a43bdc3..03dfbfe94b 100644 --- a/packages/frontend/src/style.scss +++ b/packages/frontend/src/style.scss @@ -175,6 +175,30 @@ rt { text-align: center; } +._spacer { + width: 100%; + max-width: calc(min(var(--MI_SPACER-w, 100%), 100%) - (var(--MI_SPACER-max, 24px) * 2)); + margin: var(--MI_SPACER-max, 24px) auto; + container-type: inline-size; + + /* 子に継承させない */ + --MI_SPACER-w: initial; + --MI_SPACER-min: initial; + --MI_SPACER-max: initial; +} + +._forceShrinkSpacer ._spacer { + max-width: calc(min(var(--MI_SPACER-w, 100%), 100%) - (var(--MI_SPACER-min, 12px) * 2)); + margin: var(--MI_SPACER-min, 12px) auto; +} + +@container (max-width: 450px) { + ._spacer { + max-width: calc(min(var(--MI_SPACER-w, 100%), 100%) - (var(--MI_SPACER-min, 12px) * 2)); + margin: var(--MI_SPACER-min, 12px) auto; + } +} + ._pageContainer { container-type: size; contain: strict; |