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

fix: style calendar/Gantt hover cards and plain tooltips for Material 3

Browse Source 
- Theme div.tooltip span.tip as an M3 rich tooltip (surface-container,
  elevation, rounded corners, body-medium text).
- Raise .ui-tooltip specificity so jQuery UI's .ui-widget-content rule
  no longer overrides the inverse-surface colors.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Andreas Reinhold / reini
2026-10-05 11:35:04 +02:00
co-authored by Claude Opus 5.5
parent 0e9ce26a1a
commit a79c9404d5
2 changed files with 21 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tonalmine/stylesheets/components.css
+20 -1
View File
@@ -345,16 +345,35 @@ table.progress td.done { background: color-mix(in srgb, var(--md-sys-color-prima
table.progress td.todo { background: var(--md-sys-color-secondary-container); }
/***** Tooltips (plain) *****/
.ui-tooltip {
/* jQuery UI also adds .ui-widget.ui-widget-content, which would win over a bare .ui-tooltip. */
.ui-tooltip.ui-widget.ui-widget-content {
background: var(--md-sys-color-inverse-surface);
color: var(--md-sys-color-inverse-on-surface);
border: 0;
border-radius: var(--md-sys-shape-corner-extra-small);
box-shadow: none;
font: var(--md-sys-typescale-body-small);
letter-spacing: var(--md-sys-typescale-body-small-tracking);
padding-block: 4px;
padding-inline: 8px;
}
/***** Tooltips (rich): calendar and Gantt issue hover cards *****/
div.tooltip:hover span.tip {
inline-size: 300px;
background-color: var(--md-sys-color-surface-container);
color: var(--md-sys-color-on-surface-variant);
border: 0;
border-radius: var(--md-sys-shape-corner-medium);
box-shadow: var(--md-sys-elevation-level2);
padding-block: 12px;
padding-inline: 16px;
font: var(--md-sys-typescale-body-medium);
letter-spacing: var(--md-sys-typescale-body-medium-tracking);
}
div.tooltip span.tip strong { color: var(--md-sys-color-on-surface); font-weight: 500; }
div.tooltip span.tip .avatar { vertical-align: middle; }
/***** jQuery UI: dialogs, date picker, menus *****/
.ui-widget, .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: var(--md-ref-typeface-plain); }
.ui-widget.ui-widget-content, .ui-widget-content {