noNameWEB/redmine-theme-tonalmine
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: density token and root font size for size modes (T1-T4)

Browse Source 
Compact, Normal and Large scale the text (13/14/16px) and the control
heights (32/40/48px) via data-size on <html>. Normal is unchanged.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
surtic86
2026-10-15 09:16:40 +02:00
co-authored by Claude Opus 5.5
parent dc927062a3
commit 9a04f94118
5 changed files with 46 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tonalmine/stylesheets/mobile.css
+7 -7
View File
@@ -12,7 +12,7 @@
border: 0;
color: var(--md-sys-color-on-surface);
font: var(--md-sys-typescale-title-large);
line-height: 50px;
line-height: calc(50px + var(--nm-density));
}
html #project-jump.drdn { padding-inline-start: 8px; }
/* Header icons: Material Symbols masks instead of core's scaled "^" and "≡" text glyphs */
@@ -29,8 +29,8 @@
mask: url(../images/arrow-drop-down.svg) center / 24px no-repeat;
}
html #header a.mobile-toggle-button {
inline-size: 48px;
block-size: 48px;
inline-size: calc(48px + var(--nm-density));
block-size: calc(48px + var(--nm-density));
margin-block-start: 8px;
margin-inline-end: 8px;
border-radius: var(--md-sys-shape-corner-full);
@@ -107,19 +107,19 @@
font: var(--md-sys-typescale-label-large);
}
html .flyout-menu__sidebar p > :is(select, input:not([type="submit"], [type="checkbox"], [type="radio"])) { inline-size: 100%; box-sizing: border-box; }
html .flyout-menu__sidebar li:has(> input[type="checkbox"]) { display: flex; align-items: center; gap: 12px; min-block-size: 40px; border: 0; }
html .flyout-menu__sidebar li:has(> input[type="checkbox"]) { display: flex; align-items: center; gap: 12px; min-block-size: calc(40px + var(--nm-density)); border: 0; }
html .flyout-menu .flyout-menu__sidebar li:has(> input[type="checkbox"]) a { block-size: auto; padding: 0; line-height: inherit; }
html .flyout-menu h4 { color: var(--md-sys-color-on-surface); }
html .flyout-menu a { color: var(--md-sys-color-on-surface-variant); }
html .flyout-menu ul li a, html .flyout-menu ul li:first-child a {
block-size: 48px;
block-size: calc(48px + var(--nm-density));
line-height: 48px;
margin-inline-start: 0;
padding-inline: 16px;
border: 0;
border-radius: var(--md-sys-shape-corner-full);
font: var(--md-sys-typescale-label-large);
line-height: 48px;
line-height: calc(48px + var(--nm-density));
}
html .flyout-menu ul li a:hover { background-image: var(--nm-state-hover); }
html .flyout-menu ul li a.selected {
@@ -129,7 +129,7 @@
html .flyout-menu #watchers ul li, html .flyout-menu ul.queries li, html .flyout-menu__avatar { border-block-start: 0; }
html .flyout-menu .icon svg, html .flyout-menu .icon-only svg { color: inherit; stroke: currentColor; }
html .flyout-menu__search input[type='text'] {
block-size: 48px;
block-size: calc(48px + var(--nm-density));
border-radius: var(--md-sys-shape-corner-full);
background-color: var(--md-sys-color-surface-container-highest);
color: var(--md-sys-color-on-surface);