xTr1m/RolemasterDB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enhance tables canvas reading states

Browse Source
This commit is contained in:
Frank Tovar
2026-03-21 15:08:39 +01:00
parent 7a5568f77c
commit ae582367d6
7 changed files with 327 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
src/RolemasterDb.App/wwwroot/app.css
View File

@@ -1382,10 +1382,21 @@ pre,
margin-top: 0.85rem;
}
.tables-context-tab-row {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
align-items: center;
}
.tables-context-mode-tabs {
width: fit-content;
}
.tables-context-density-tabs {
width: fit-content;
}
.tables-context-fields {
display: flex;
flex-wrap: wrap;
@@ -1452,6 +1463,9 @@ pre,
font-size: 1.5rem;
border-top: 1px solid rgba(127, 96, 55, 0.2);
border-left: 1px solid rgba(127, 96, 55, 0.2);
isolation: isolate;
--tables-group-header-top: 0;
--tables-column-header-top: 3.2rem;
}
.critical-table-grid-header-cell {
@@ -1474,14 +1488,56 @@ pre,
font-size: 2rem;
}
.critical-table-grid-group-header {
position: sticky;
top: var(--tables-group-header-top);
z-index: 3;
}
.critical-table-grid-column-header {
position: sticky;
top: var(--tables-column-header-top);
z-index: 3;
}
.critical-table-grid.is-dense {
font-size: 1.2rem;
--tables-column-header-top: 2.6rem;
}
.critical-table-grid.is-dense .critical-table-grid-header-cell {
padding: 0.25rem;
}
.critical-table-grid.is-dense .critical-table-cell {
padding: 0.35rem;
}
.critical-table-grid-corner,
.critical-table-grid-roll-band-header {
background: rgba(255, 247, 230, 0.52);
}
.critical-table-grid-corner {
position: sticky;
top: var(--tables-group-header-top);
left: 0;
z-index: 5;
}
.critical-table-grid-roll-band-header {
position: sticky;
top: var(--tables-column-header-top);
left: 0;
z-index: 5;
}
.critical-table-grid-roll-band {
background: rgba(255, 247, 230, 0.52);
font-size: 1.5rem;
position: sticky;
left: 0;
z-index: 2;
}
.critical-table-cell {
@@ -1492,6 +1548,8 @@ pre,
border-right: 1px solid rgba(127, 96, 55, 0.2);
border-bottom: 1px solid rgba(127, 96, 55, 0.2);
box-sizing: border-box;
cursor: pointer;
transition: box-shadow 0.16s ease, background-color 0.16s ease, transform 0.16s ease;
}
.critical-table-cell.is-curated {
@@ -1506,6 +1564,40 @@ pre,
rgba(255, 255, 255, 0.85);
}
.critical-table-cell.is-active-row,
.critical-table-grid-roll-band.is-active-row {
background:
linear-gradient(180deg, rgba(13, 148, 136, 0.12), rgba(13, 148, 136, 0.04)),
rgba(255, 255, 255, 0.9);
}
.critical-table-grid-column-header.is-active-column,
.critical-table-cell.is-active-column {
box-shadow: inset 0 0 0 999px rgba(13, 148, 136, 0.06);
}
.critical-table-grid-group-header.is-active-group,
.critical-table-grid-column-header.is-active-group,
.critical-table-cell.is-active-group {
box-shadow: inset 0 0 0 999px rgba(188, 117, 43, 0.05);
}
.critical-table-cell.is-selected-cell {
box-shadow: inset 0 0 0 2px rgba(13, 148, 136, 0.62);
background:
linear-gradient(135deg, rgba(13, 148, 136, 0.16), transparent 38%),
rgba(255, 255, 255, 0.96);
}
.critical-table-cell.is-roll-target::after,
.critical-table-grid-roll-band.is-roll-target::after {
content: "";
position: absolute;
inset: 0;
border: 2px dashed rgba(13, 148, 136, 0.35);
pointer-events: none;
}
.critical-table-cell-shell {
display: flex;
flex-direction: column;
@@ -2256,6 +2348,11 @@ pre,
min-width: 0;
}
.tables-context-tab-row {
flex-direction: column;
align-items: stretch;
}
.critical-editor-header,
.critical-editor-footer {
flex-direction: column;