style: use overlay scrollbar styling for tables to eliminate background width gap on the right
This commit is contained in:
@@ -104,6 +104,10 @@ html, body {
|
|||||||
background: rgba(148, 163, 184, 0.8);
|
background: rgba(148, 163, 184, 0.8);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.overflow-y-overlay {
|
||||||
|
overflow-y: overlay;
|
||||||
|
}
|
||||||
|
|
||||||
/* Custom Date/Time Inputs */
|
/* Custom Date/Time Inputs */
|
||||||
input[type="date"],
|
input[type="date"],
|
||||||
input[type="time"],
|
input[type="time"],
|
||||||
|
|||||||
+3
-12
@@ -889,9 +889,6 @@
|
|||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
.overflow-auto {
|
|
||||||
overflow: auto;
|
|
||||||
}
|
|
||||||
.overflow-hidden {
|
.overflow-hidden {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
@@ -1064,12 +1061,6 @@
|
|||||||
.border-slate-900 {
|
.border-slate-900 {
|
||||||
border-color: var(--color-slate-900);
|
border-color: var(--color-slate-900);
|
||||||
}
|
}
|
||||||
.border-slate-900\/50 {
|
|
||||||
border-color: color-mix(in srgb, oklch(20.8% 0.042 265.755) 50%, transparent);
|
|
||||||
@supports (color: color-mix(in lab, red, red)) {
|
|
||||||
border-color: color-mix(in oklab, var(--color-slate-900) 50%, transparent);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.border-slate-950 {
|
.border-slate-950 {
|
||||||
border-color: var(--color-slate-950);
|
border-color: var(--color-slate-950);
|
||||||
}
|
}
|
||||||
@@ -1085,9 +1076,6 @@
|
|||||||
.bg-\[\#1e293b\] {
|
.bg-\[\#1e293b\] {
|
||||||
background-color: #1e293b;
|
background-color: #1e293b;
|
||||||
}
|
}
|
||||||
.bg-\[\#1e293b\]\/20 {
|
|
||||||
background-color: color-mix(in oklab, #1e293b 20%, transparent);
|
|
||||||
}
|
|
||||||
.bg-\[\#1e293b\]\/30 {
|
.bg-\[\#1e293b\]\/30 {
|
||||||
background-color: color-mix(in oklab, #1e293b 30%, transparent);
|
background-color: color-mix(in oklab, #1e293b 30%, transparent);
|
||||||
}
|
}
|
||||||
@@ -2579,6 +2567,9 @@ html, body {
|
|||||||
::-webkit-scrollbar-thumb:hover {
|
::-webkit-scrollbar-thumb:hover {
|
||||||
background: rgba(148, 163, 184, 0.8);
|
background: rgba(148, 163, 184, 0.8);
|
||||||
}
|
}
|
||||||
|
.overflow-y-overlay {
|
||||||
|
overflow-y: overlay;
|
||||||
|
}
|
||||||
input[type="date"], input[type="time"], input[type="datetime-local"] {
|
input[type="date"], input[type="time"], input[type="datetime-local"] {
|
||||||
position: relative;
|
position: relative;
|
||||||
padding-left: 0.5rem !important;
|
padding-left: 0.5rem !important;
|
||||||
|
|||||||
@@ -392,7 +392,7 @@
|
|||||||
{% macro table_container_open(id, max_height="68vh") %}
|
{% macro table_container_open(id, max_height="68vh") %}
|
||||||
<!-- Table Container -->
|
<!-- Table Container -->
|
||||||
<div class="bg-[#1e293b]/40 backdrop-blur-xl border border-slate-900 rounded-3xl shadow-2xl mb-8 overflow-hidden">
|
<div class="bg-[#1e293b]/40 backdrop-blur-xl border border-slate-900 rounded-3xl shadow-2xl mb-8 overflow-hidden">
|
||||||
<div id="{{ id }}-container" class="overflow-auto scrollbar-thin rounded-[22px]" style="max-height: {{ max_height }};">
|
<div id="{{ id }}-container" class="overflow-x-auto overflow-y-overlay scrollbar-thin rounded-[22px]" style="max-height: {{ max_height }};">
|
||||||
{% endmacro %}
|
{% endmacro %}
|
||||||
|
|
||||||
{% macro table_container_close(id) %}
|
{% macro table_container_close(id) %}
|
||||||
|
|||||||
Reference in New Issue
Block a user