blender/flamenco
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web: Style tweaks to Tabulator tables

Browse Source
This commit is contained in:
Pablo Vazquez 2022-05-04 18:47:50 +02:00
parent dad5da49be
commit 4f1b1be90b
2 changed files with 15 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
web/app/src/assets/base.css
View File

@ -13,7 +13,7 @@
--color-text-muted: #999;
--color-text-hint: #555;
--color-border: #222;
--color-border: #282828;
--border-width: 2px;
--border-radius: 4px;
@ -23,10 +23,8 @@
--font-size-base: 14px;
--font-size-sm: 12px;
--table-color-background-row: #333;
--table-color-background-row-hover: #3a3a3a;
--table-color-background-row-odd: #292929;
--table-color-background-row-odd-hover: #3a3a3a;
--table-color-background-row: #303030;
--table-color-background-row-odd: #2b2b2b;
--table-color-background-row-selected: var(--color-accent);
--table-color-background-row-selected: var(--color-accent);

24
web/app/src/assets/tabulator.css
View File

@ -58,12 +58,13 @@
}
.tabulator .tabulator-header .tabulator-col {
align-items: center;
box-sizing: border-box;
display: inline-block;
display: inline-flex;
overflow: hidden;
position: relative;
text-align: left;
vertical-align: bottom;
vertical-align: middle;
}
.tabulator .tabulator-header .tabulator-col.tabulator-moving {
@ -79,6 +80,11 @@
padding: var(--spacer-xs);
}
/* First column, usually containing a checkbox for selecting rows. */
.tabulator .tabulator-header .tabulator-col:first-child .tabulator-col-content {
padding: 0 .75rem;
}
.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-header-menu-button {
padding: 0 8px;
}
@ -170,7 +176,7 @@
.tabulator .tabulator-header .tabulator-col.tabulator-sortable:hover {
cursor: pointer;
background-color: #1a1a1a;
color: var(--color-text-highlight);
}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="none"] .tabulator-col-content .tabulator-col-sorter {
@ -483,14 +489,13 @@
.tabulator-row {
background-color: var(--table-color-background-row-odd);
border-radius: var(--border-radius);
box-sizing: border-box;
min-height: 22px;
position: relative;
transition: background-color var(--transition-speed-fast) ease-out;
transition: color var(--transition-speed-fast) ease-out;
}
.tabulator-row.tabulator-row:hover {
.tabulator-row:hover {
color: var(--color-text-highlight);
}
@ -498,22 +503,17 @@
background-color: var(--table-color-background-row);
}
.tabulator-row.tabulator-row-even:hover {
background-color: var(--table-color-background-row-hover);
}
.tabulator-row.tabulator-selectable:hover {
background-color: var(--table-color-background-row-odd-hover);
cursor: pointer;
}
.tabulator-row.tabulator-selected {
background-color: var(--color-accent-background);
border-radius: var(--border-radius);
color: var(--color-accent-text);
}
.tabulator-row.tabulator-selected:hover {
background-color: var(--color-accent);
color: white;
cursor: pointer;
}