style(dm): widen desktop dashboard at xl/2xl breakpoints
Bump container max-width and right context column at xl/2xl so the reference and notes panels get noticeably more room on larger monitors. Mobile and lg layouts are unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
@@ -7,7 +7,7 @@ import { dmTranslations as T } from '../../i18n/dm-translations';
|
|||||||
<DmCard padding="md" dataTestid="notes-section">
|
<DmCard padding="md" dataTestid="notes-section">
|
||||||
<textarea
|
<textarea
|
||||||
id="notes-textarea"
|
id="notes-textarea"
|
||||||
class="w-full h-64 bg-[var(--bg-input)] border border-[var(--border-color)] rounded-lg p-4 text-[var(--text-primary)] placeholder:text-[var(--text-muted)] focus:border-[var(--gold)] focus:ring-1 focus:ring-[var(--gold)] transition-all resize-none"
|
class="w-full h-64 xl:h-80 2xl:h-96 bg-[var(--bg-input)] border border-[var(--border-color)] rounded-lg p-4 text-[var(--text-primary)] placeholder:text-[var(--text-muted)] focus:border-[var(--gold)] focus:ring-1 focus:ring-[var(--gold)] transition-all resize-none"
|
||||||
placeholder={T.emptyNotesPlaceholder}
|
placeholder={T.emptyNotesPlaceholder}
|
||||||
data-testid="notes-textarea"
|
data-testid="notes-textarea"
|
||||||
></textarea>
|
></textarea>
|
||||||
|
|||||||
@@ -37,8 +37,8 @@ const {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Dashboard grid -->
|
<!-- Dashboard grid -->
|
||||||
<div class="flex-1 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6 w-full">
|
<div class="flex-1 max-w-7xl xl:max-w-[1600px] 2xl:max-w-[1800px] mx-auto px-4 sm:px-6 lg:px-8 py-6 w-full">
|
||||||
<div class="grid grid-cols-1 lg:grid-cols-[260px_1fr_300px] gap-4">
|
<div class="grid grid-cols-1 lg:grid-cols-[260px_1fr_320px] xl:grid-cols-[280px_minmax(0,1fr)_460px] 2xl:grid-cols-[300px_minmax(0,1fr)_560px] gap-4 xl:gap-6">
|
||||||
|
|
||||||
<!-- Sidebar (desktop only) -->
|
<!-- Sidebar (desktop only) -->
|
||||||
<aside class="hidden lg:block">
|
<aside class="hidden lg:block">
|
||||||
@@ -71,7 +71,7 @@ const {
|
|||||||
|
|
||||||
<!-- Footer -->
|
<!-- Footer -->
|
||||||
<footer class="w-full border-t border-[var(--border-gold)] bg-[var(--bg-secondary)]/60 backdrop-blur-sm">
|
<footer class="w-full border-t border-[var(--border-gold)] bg-[var(--bg-secondary)]/60 backdrop-blur-sm">
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 flex items-center justify-between">
|
<div class="max-w-7xl xl:max-w-[1600px] 2xl:max-w-[1800px] mx-auto px-4 sm:px-6 lg:px-8 py-4 flex items-center justify-between">
|
||||||
<span class="text-sm text-[var(--text-secondary)]">
|
<span class="text-sm text-[var(--text-secondary)]">
|
||||||
{T.footer}
|
{T.footer}
|
||||||
</span>
|
</span>
|
||||||
|
|||||||
Reference in New Issue
Block a user