admin/mtg_commander_life_tracker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feat: Decks page.

Browse Source
This commit is contained in:
Teddy Middleton-Smith
2026-02-16 19:30:31 +00:00
parent 1cd9b7c976
commit 5661632540
75 changed files with 11850 additions and 536 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
static/css/layouts/table-main.css
View File

@@ -4,38 +4,39 @@
margin-top: 1vh;
}
table.table-main {
.table-main {
overflow-x: auto;
padding: 1vh 1vw;
max-width: 88vw; /* min(calc(1vh * 80), calc(1vw * 90)); */
padding: 0; /*1vh 1vw;*/
max-width: 80vw; /* min(calc(1vh * 80), calc(1vw * 90)); */
width: min-content;
align-items: normal;
justify-content: normal;
margin: 0 auto;
}
table.table-main * {
.table-main * {
padding: 0.25vh 0.5vh;
}
table.table-main thead {
.table-main thead {
max-height: 4vh;
overflow-y: visible;
background-color: var(--colour-text-background);
background-color: var(--background-color);
}
table.table-main tbody {
.table-main tbody {
max-height: 75vh;
overflow-y: auto;
min-width: fit-content;
max-width: fit-content;
overflow-x: visible;
}
table.table-main tbody.is_collapsed {
.table-main tbody.is_collapsed {
display: block;
}
table.table-main:has(tbody > div) tbody {
.table-main:has(tbody > div) tbody {
}
table.table-main tbody > div {
.table-main tbody > div {
margin-left: auto;
margin-right: auto;
text-align: center;
@@ -50,72 +51,72 @@ table.table-main tbody > div {
width: 100%; /* min(calc(90vh), calc(70vw)); */
}
table.table-main select,
table.table-main input:not([type="checkbox"]),
table.table-main textarea,
table.table-main div {
.table-main select,
.table-main input:not([type="checkbox"]),
.table-main textarea,
.table-main div {
box-sizing: border-box;
width: 100%;
max-width: 100%;
height: 100%;
border: 1px solid var(--colour-accent);
border: 1px solid var(--border-color);
border-radius: 0.5vh;
text-align: center;
background-color: var(--colour-text-background);
background-color: var(--background-color);
font-size: 16px;
}
table.table-main thead tr th,
table.table-main tbody tr td {
.table-main thead tr th,
.table-main tbody tr td {
max-width: 20vh;
min-width: 20vh;
padding: 0 0.5vh;
}
table.table-main tbody tr td {
.table-main tbody tr td {
height: 3vh;
/* padding-top: 0.5vh; */
}
table.table-main thead tr th.notes,
table.table-main tbody tr td.notes {
.table-main thead tr th.notes,
.table-main tbody tr td.notes {
max-width: fit-content;
}
table.table-main tbody tr td:has(.dirty) {
background-color: var(--colour-primary);
.table-main tbody tr td:has(.dirty) {
background-color: var(--primary-color);
}
table.table-main tbody tr td:has(.dirty) table tr:not(:has(.dirty)) {
.table-main tbody tr td:has(.dirty) table tr:not(:has(.dirty)) {
background-color: var(--colour-text-background);
}
table.table-main tbody tr:not(:last-of-type) td {
.table-main tbody tr:not(:last-of-type) td {
padding-bottom: 0.25vh;
}
table.table-main tbody tr td.ddl-preview div {
.table-main tbody tr td.ddl-preview div {
cursor: pointer;
}
table.table-main tbody tr td.ddl-preview div,
table.table-main tbody tr td.ddl-preview select {
.table-main tbody tr td.ddl-preview div,
.table-main tbody tr td.ddl-preview select {
padding-left: 2vh;
padding-right: 2vh;
}
table.table-main thead tr th.active,
table.table-main tbody tr td.active {
.table-main thead tr th.active,
.table-main tbody tr td.active {
max-width: 6vh;
min-width: 6vh;
}
table.table-main thead tr th.active svg.active.add {
fill: var(--colour-primary);
background-color: var(--colour-accent);
border: 2px solid var(--colour-accent);
.table-main thead tr th.active svg.active.add {
fill: var(--primary-color);
background-color: var(--background-color);
border: 2px solid var(--border-color);
padding: 0;
border-radius: 1vh;
}
table.table-main tbody tr td.active svg.active.add {
fill: var(--colour-primary);
.table-main tbody tr td.active svg.active.add {
fill: var(--primary-color);
}
table.table-main tbody tr td.active svg.active.delete {
fill: var(--colour-error);
.table-main tbody tr td.active svg.active.delete {
fill: var(--tcg-accent-red);
}
table.table-main tbody tr td.display_order,
table.table-main thead tr th.display_order {
.table-main tbody tr td.display_order,
.table-main thead tr th.display_order {
max-width: 5vh;
min-width: 5vh;
}
@@ -141,13 +142,13 @@ table.table-main thead tr th.display_order {
.company-name {
font-size: 1.2rem;
}
table.table-main {
.table-main {
max-height: 61vh;
}
table.table-main thead {
.table-main thead {
font-size: 0.8rem;
}
table.table-main tbody {
.table-main tbody {
max-height: 53vh;
}
}