refactor: establish standalone application boundary
This commit is contained in:
leefer
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,380 @@
|
||||
/* Canonical CSS owner: feedback. Historical layers consolidated 2026-08-02. */
|
||||
|
||||
@keyframes row-enter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
||||
transform: translateY(4px);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
|
||||
transform: translateY(0px);
|
||||
}
|
||||
}
|
||||
|
||||
.loading-message p {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
@keyframes breathe-core {
|
||||
0%,
|
||||
100% {
|
||||
transform: scale(0.86);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.empty-line {
|
||||
opacity: 0.45;
|
||||
}
|
||||
|
||||
@keyframes line-arrive {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
||||
transform: scaleX(0.45);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
|
||||
transform: scaleX(1);
|
||||
}
|
||||
}
|
||||
|
||||
.loading-overlay {
|
||||
position: fixed;
|
||||
|
||||
inset: 0px;
|
||||
|
||||
z-index: 50;
|
||||
|
||||
display: grid;
|
||||
|
||||
place-items: center;
|
||||
|
||||
background: rgba(244, 246, 248, 0.65);
|
||||
|
||||
backdrop-filter: blur(2px);
|
||||
|
||||
animation: overlay-enter var(--motion-fast) ease both;
|
||||
}
|
||||
|
||||
.loading-overlay[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@keyframes loading-box-enter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
||||
transform: translateY(5px) scale(0.985);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
|
||||
transform: translateY(0px) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.spinner {
|
||||
width: 22px;
|
||||
|
||||
height: 22px;
|
||||
|
||||
border-width: 3px;
|
||||
|
||||
border-style: solid;
|
||||
|
||||
border-right-color: rgb(217, 228, 233);
|
||||
|
||||
border-bottom-color: rgb(217, 228, 233);
|
||||
|
||||
border-left-color: rgb(217, 228, 233);
|
||||
|
||||
border-image: none;
|
||||
|
||||
border-top-color: var(--blue);
|
||||
|
||||
border-radius: 50%;
|
||||
|
||||
animation: 700ms linear 0s infinite normal none running spin;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
#toast.toast {
|
||||
position: fixed;
|
||||
|
||||
inset: auto 18px 48px auto;
|
||||
|
||||
z-index: 60;
|
||||
|
||||
width: max-content;
|
||||
|
||||
height: auto;
|
||||
|
||||
max-width: min(420px, -36px + 100vw);
|
||||
|
||||
padding: 11px 14px;
|
||||
|
||||
border-radius: 4px;
|
||||
|
||||
background: rgb(33, 49, 60);
|
||||
|
||||
color: rgb(255, 255, 255);
|
||||
|
||||
box-shadow: var(--shadow);
|
||||
|
||||
opacity: 1;
|
||||
|
||||
pointer-events: none;
|
||||
|
||||
transform: none;
|
||||
|
||||
animation: toast-enter var(--motion-medium) var(--ease-out) both;
|
||||
}
|
||||
|
||||
#toast.toast[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@keyframes toast-enter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
||||
transform: translateY(8px);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
|
||||
transform: translateY(0px);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 720px) {
|
||||
@keyframes command-menu-enter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
||||
transform: translateY(-5px) scale(0.98);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
|
||||
transform: translateY(0px) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
#toast.toast {
|
||||
inset: auto 10px 76px auto;
|
||||
|
||||
width: max-content;
|
||||
|
||||
height: auto;
|
||||
|
||||
max-width: calc(-20px + 100vw);
|
||||
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
.loading-box {
|
||||
min-width: 220px;
|
||||
|
||||
align-items: center;
|
||||
|
||||
gap: 12px;
|
||||
|
||||
border: 1px solid var(--line);
|
||||
|
||||
border-radius: 6px;
|
||||
|
||||
background: var(--surface);
|
||||
|
||||
box-shadow: var(--shadow);
|
||||
|
||||
animation: loading-box-enter var(--motion-medium) var(--ease-out) both;
|
||||
|
||||
width: min(320px, -32px + 100vw);
|
||||
|
||||
min-height: 92px;
|
||||
|
||||
display: grid;
|
||||
|
||||
grid-template-columns: 30px minmax(0px, 1fr);
|
||||
|
||||
grid-template-rows: auto auto;
|
||||
|
||||
justify-content: stretch;
|
||||
|
||||
padding: 18px 20px;
|
||||
}
|
||||
|
||||
.loading-copy {
|
||||
min-width: 0px;
|
||||
}
|
||||
|
||||
.loading-copy strong {
|
||||
display: block;
|
||||
|
||||
font-size: 14px;
|
||||
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
.loading-copy small {
|
||||
display: block;
|
||||
|
||||
margin-top: 4px;
|
||||
|
||||
color: var(--text-secondary);
|
||||
|
||||
font-size: 11px;
|
||||
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
.loading-progress {
|
||||
grid-column: 1 / -1;
|
||||
|
||||
height: 3px;
|
||||
|
||||
margin-top: 13px;
|
||||
|
||||
overflow: hidden;
|
||||
|
||||
border-radius: 2px;
|
||||
|
||||
background: rgb(229, 234, 238);
|
||||
}
|
||||
|
||||
.loading-progress i {
|
||||
width: 44%;
|
||||
|
||||
height: 100%;
|
||||
|
||||
display: block;
|
||||
|
||||
background: var(--action);
|
||||
|
||||
animation: 1.25s ease-in-out 0s infinite normal none running loading-progress;
|
||||
}
|
||||
|
||||
.loading-overlay[data-context="screener"] .loading-box {
|
||||
width: min(430px, -32px + 100vw);
|
||||
|
||||
min-height: 138px;
|
||||
|
||||
padding: 24px 26px;
|
||||
|
||||
border-color: rgb(200, 214, 228);
|
||||
|
||||
box-shadow: rgba(24, 34, 45, 0.18) 0px 20px 50px;
|
||||
}
|
||||
|
||||
.loading-overlay[data-context="screener"] .spinner {
|
||||
width: 28px;
|
||||
|
||||
height: 28px;
|
||||
}
|
||||
|
||||
.loading-overlay[data-context="screener"] .loading-copy strong {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.loading-overlay[data-context="screener"] .loading-copy small {
|
||||
margin-top: 7px;
|
||||
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
@keyframes loading-progress {
|
||||
0% {
|
||||
transform: translateX(-110%);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: translateX(250%);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes account-menu-in {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
||||
transform: translateY(-5px) scale(0.98);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
|
||||
transform: translateY(0px) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes assistant-caret {
|
||||
50% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes xb-view-enter {
|
||||
0% {
|
||||
opacity: 0.35;
|
||||
|
||||
transform: translateY(3px);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
|
||||
min-height: 170px;
|
||||
|
||||
display: grid;
|
||||
|
||||
place-items: center;
|
||||
|
||||
padding: 24px;
|
||||
|
||||
color: var(--text-tertiary);
|
||||
|
||||
font-size: 11.5px;
|
||||
}
|
||||
|
||||
@keyframes stage18-dialog-enter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
||||
transform: translateY(7px) scale(0.992);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
|
||||
transform: translateY(0px) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
:root[data-theme="dark"] :is(.sub, .muted, .dtag, .table-muted, small, .empty-state) {
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
@@ -0,0 +1,226 @@
|
||||
/* Canonical CSS owner: navigation. Historical layers consolidated 2026-08-02. */
|
||||
.segment:last-child {
|
||||
border-right: 0px;
|
||||
}
|
||||
|
||||
@media (max-width: 860px) {
|
||||
.toolbar-controls {
|
||||
width: 100%;
|
||||
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 520px) {
|
||||
.segmented {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.segment {
|
||||
min-width: 0px;
|
||||
|
||||
flex: 1 1 0%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 720px) {
|
||||
.toolbar-controls {
|
||||
width: 100%;
|
||||
|
||||
align-items: stretch;
|
||||
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.segmented {
|
||||
min-height: 42px;
|
||||
}
|
||||
|
||||
.segment {
|
||||
min-height: 40px;
|
||||
|
||||
padding: 0px 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.toolbar-controls {
|
||||
display: flex;
|
||||
|
||||
margin-left: auto;
|
||||
|
||||
gap: 7px;
|
||||
}
|
||||
|
||||
.segmented {
|
||||
height: 34px;
|
||||
|
||||
display: flex;
|
||||
|
||||
overflow: hidden;
|
||||
|
||||
min-height: 36px;
|
||||
|
||||
padding: 2px;
|
||||
|
||||
border: 0px;
|
||||
|
||||
border-radius: 7px;
|
||||
|
||||
background: rgb(236, 239, 244);
|
||||
}
|
||||
|
||||
.segment {
|
||||
background: var(--surface);
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
white-space: nowrap;
|
||||
|
||||
min-height: 28px;
|
||||
|
||||
padding: 0px 10px;
|
||||
|
||||
border: 0px;
|
||||
|
||||
border-radius: 5px;
|
||||
|
||||
color: var(--text-secondary);
|
||||
|
||||
font-size: 11.5px;
|
||||
}
|
||||
|
||||
.segment.active {
|
||||
background: var(--surface-raised);
|
||||
|
||||
color: var(--text-primary);
|
||||
|
||||
box-shadow: rgba(16, 24, 40, 0.09) 0px 1px 2px;
|
||||
}
|
||||
|
||||
.redesigned-page-head .toolbar-controls {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.redesigned-page-head .segmented {
|
||||
min-height: 28px;
|
||||
|
||||
display: inline-flex;
|
||||
|
||||
gap: 2px;
|
||||
|
||||
padding: 2px;
|
||||
|
||||
border: 0px;
|
||||
|
||||
border-radius: 8px;
|
||||
|
||||
background: rgb(243, 244, 246);
|
||||
}
|
||||
|
||||
.redesigned-page-head .segment {
|
||||
min-height: 24px;
|
||||
|
||||
padding: 4px 12px;
|
||||
|
||||
border: 0px;
|
||||
|
||||
border-radius: 6px;
|
||||
|
||||
background: transparent;
|
||||
|
||||
color: var(--r2-sub);
|
||||
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.redesigned-page-head .segment.active {
|
||||
background: rgb(255, 255, 255);
|
||||
|
||||
color: var(--r2-ink);
|
||||
|
||||
font-weight: 600;
|
||||
|
||||
box-shadow: rgba(0, 0, 0, 0.08) 0px 1px 2px;
|
||||
}
|
||||
|
||||
@media (max-width: 720px), (max-width: 1023px) and (max-height: 600px) {
|
||||
.redesigned-page-head .toolbar-controls {
|
||||
width: 100%;
|
||||
|
||||
margin-left: 0px;
|
||||
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: flex;
|
||||
|
||||
align-items: center;
|
||||
|
||||
gap: 2px;
|
||||
|
||||
border-bottom: 1px solid var(--line-soft);
|
||||
|
||||
padding: 0px 14px;
|
||||
}
|
||||
|
||||
.tabs .tab {
|
||||
padding: 10px 14px;
|
||||
|
||||
font-size: 13px;
|
||||
|
||||
color: var(--sub);
|
||||
|
||||
border-bottom: 2px solid transparent;
|
||||
|
||||
margin-bottom: -1px;
|
||||
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.tabs .tab .n {
|
||||
font-size: 11px;
|
||||
|
||||
color: var(--faint);
|
||||
|
||||
margin-left: 3px;
|
||||
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.tabs .tab.active {
|
||||
color: var(--blue);
|
||||
|
||||
border-bottom-color: var(--blue);
|
||||
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.tabs .tab.active .n {
|
||||
color: var(--blue);
|
||||
}
|
||||
|
||||
.seg {
|
||||
display: inline-flex;
|
||||
|
||||
background: rgb(243, 244, 246);
|
||||
|
||||
border-radius: 8px;
|
||||
|
||||
padding: 2px;
|
||||
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
@media (min-width: 521px) {
|
||||
.segment {
|
||||
min-width: 52px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 721px) {
|
||||
.toolbar-controls {
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,426 @@
|
||||
/* Canonical CSS owner: tables. Historical layers consolidated 2026-08-02. */
|
||||
.data-table th[data-sort] {
|
||||
cursor: pointer;
|
||||
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.data-table th[data-sort]:hover {
|
||||
background: rgb(227, 237, 242);
|
||||
|
||||
color: var(--blue-dark);
|
||||
}
|
||||
|
||||
.data-table th.sort-asc::after {
|
||||
content: " ↑";
|
||||
|
||||
color: var(--blue);
|
||||
}
|
||||
|
||||
.data-table th.sort-desc::after {
|
||||
content: " ↓";
|
||||
|
||||
color: var(--blue);
|
||||
}
|
||||
|
||||
.data-table tbody tr td {
|
||||
transition: background-color var(--motion-fast) ease, color var(--motion-fast) ease;
|
||||
}
|
||||
|
||||
.data-table tbody tr.row-enter {
|
||||
animation-delay: var(--row-delay, 0ms);
|
||||
}
|
||||
|
||||
.data-table tbody tr.row-pending {
|
||||
opacity: 0;
|
||||
|
||||
transform: translateY(4px);
|
||||
}
|
||||
|
||||
.data-table .number {
|
||||
text-align: right;
|
||||
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
.data-table .row-number {
|
||||
width: 38px;
|
||||
|
||||
color: var(--text-muted);
|
||||
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.table-action {
|
||||
padding: 3px 7px;
|
||||
|
||||
border: 0px;
|
||||
|
||||
background: transparent;
|
||||
|
||||
color: var(--blue);
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.table-muted {
|
||||
color: var(--text-muted);
|
||||
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.data-table:not(#limitTable) th[data-auto-sort] {
|
||||
cursor: pointer;
|
||||
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.data-table:not(#limitTable) th[data-auto-sort]:hover {
|
||||
background: rgb(227, 237, 242);
|
||||
|
||||
color: var(--action-hover);
|
||||
}
|
||||
|
||||
.data-table th[data-auto-sort].sort-asc::after {
|
||||
content: " ↑";
|
||||
|
||||
color: var(--action);
|
||||
}
|
||||
|
||||
.data-table th[data-auto-sort].sort-desc::after {
|
||||
content: " ↓";
|
||||
|
||||
color: var(--action);
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.data-table tbody tr.row-pending {
|
||||
opacity: 1;
|
||||
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 860px) {
|
||||
.table-frame {
|
||||
max-height: 520px;
|
||||
|
||||
border-right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.data-table td {
|
||||
background: var(--surface);
|
||||
|
||||
text-align: left;
|
||||
|
||||
height: 42px;
|
||||
|
||||
padding: 8px 11px;
|
||||
|
||||
border-right: 0px;
|
||||
|
||||
border-bottom: 1px solid rgb(232, 237, 241);
|
||||
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.data-table th {
|
||||
text-align: left;
|
||||
|
||||
position: sticky;
|
||||
|
||||
top: 0px;
|
||||
|
||||
z-index: 2;
|
||||
|
||||
padding: 8px 11px;
|
||||
|
||||
border-right: 0px;
|
||||
|
||||
border-bottom: 1px solid rgb(232, 237, 241);
|
||||
|
||||
line-height: 1.4;
|
||||
|
||||
height: 38px;
|
||||
|
||||
background: rgb(244, 247, 249);
|
||||
|
||||
color: rgb(82, 98, 115);
|
||||
|
||||
font-size: 11.5px;
|
||||
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.data-table tbody tr.selected td {
|
||||
background: rgb(237, 245, 255);
|
||||
}
|
||||
|
||||
@media (max-width: 720px) {
|
||||
.data-table {
|
||||
font-size: 12.5px;
|
||||
}
|
||||
|
||||
.data-table td {
|
||||
height: 44px;
|
||||
|
||||
padding: 8px 10px;
|
||||
}
|
||||
|
||||
.data-table th {
|
||||
height: 44px;
|
||||
|
||||
padding: 8px 10px;
|
||||
|
||||
font-size: 11.5px;
|
||||
}
|
||||
|
||||
.main-grid > .table-frame {
|
||||
min-height: 460px;
|
||||
|
||||
border-right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.data-table {
|
||||
border-spacing: 0px;
|
||||
|
||||
white-space: nowrap;
|
||||
|
||||
color: rgb(38, 51, 64);
|
||||
|
||||
width: 100%;
|
||||
|
||||
border-collapse: collapse;
|
||||
|
||||
font-size: 12.5px;
|
||||
}
|
||||
|
||||
.data-table tbody tr:last-child td {
|
||||
border-bottom: 0px;
|
||||
}
|
||||
|
||||
.data-table tbody tr {
|
||||
cursor: pointer;
|
||||
|
||||
transition: background var(--duration-fast);
|
||||
}
|
||||
|
||||
.data-table tbody tr:hover td {
|
||||
background: rgb(248, 250, 255);
|
||||
}
|
||||
|
||||
.data-table .stock-name {
|
||||
color: var(--text-primary);
|
||||
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.main-grid > .table-frame {
|
||||
border-right: 1px solid var(--border);
|
||||
|
||||
border-radius: var(--card-radius);
|
||||
}
|
||||
|
||||
.table-frame {
|
||||
position: relative;
|
||||
|
||||
min-width: 0px;
|
||||
|
||||
max-height: calc(-285px + 100vh);
|
||||
|
||||
border: 1px solid var(--card-border);
|
||||
|
||||
background: var(--card-bg);
|
||||
|
||||
box-shadow: var(--card-shadow);
|
||||
|
||||
overflow: hidden;
|
||||
|
||||
border-radius: var(--card-radius);
|
||||
}
|
||||
|
||||
.data-table thead th {
|
||||
padding: 0px 11px;
|
||||
|
||||
border-bottom: 1px solid var(--border);
|
||||
|
||||
background: var(--surface-subtle);
|
||||
|
||||
color: var(--text-secondary);
|
||||
|
||||
font-weight: 650;
|
||||
|
||||
white-space: nowrap;
|
||||
|
||||
height: 36px;
|
||||
|
||||
font-size: 11.5px;
|
||||
}
|
||||
|
||||
.data-table tbody td {
|
||||
padding: 6px 11px;
|
||||
|
||||
border-bottom: 1px solid rgb(237, 240, 244);
|
||||
|
||||
color: var(--xb-gray-700);
|
||||
|
||||
height: 41px;
|
||||
}
|
||||
|
||||
.main-grid .data-table thead th {
|
||||
height: 34px;
|
||||
|
||||
padding: 6px 10px;
|
||||
}
|
||||
|
||||
.main-grid .data-table tbody td {
|
||||
height: 40px;
|
||||
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
:is(#limitTable, #brokenTable, #downTable, #yesterdayTable) tbody tr {
|
||||
transition: background-color 150ms;
|
||||
}
|
||||
|
||||
.tbl-wrap {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.tbl thead th {
|
||||
position: sticky;
|
||||
|
||||
top: 0px;
|
||||
|
||||
background: rgb(248, 250, 252);
|
||||
|
||||
color: var(--sub);
|
||||
|
||||
font-weight: 600;
|
||||
|
||||
font-size: 12px;
|
||||
|
||||
text-align: left;
|
||||
|
||||
padding: 8px 12px;
|
||||
|
||||
border-bottom: 1px solid var(--line);
|
||||
|
||||
white-space: nowrap;
|
||||
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.tbl thead th.sortable {
|
||||
cursor: pointer;
|
||||
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.tbl thead th.sortable:hover {
|
||||
color: var(--blue);
|
||||
}
|
||||
|
||||
.tbl thead th .arr {
|
||||
font-size: 9px;
|
||||
|
||||
color: var(--faint);
|
||||
|
||||
margin-left: 3px;
|
||||
}
|
||||
|
||||
.tbl thead th.sorted .arr {
|
||||
color: var(--blue);
|
||||
}
|
||||
|
||||
.tbl tbody td {
|
||||
padding: 9px 12px;
|
||||
|
||||
border-bottom: 1px solid var(--line-soft);
|
||||
|
||||
white-space: nowrap;
|
||||
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.tbl tbody tr:hover {
|
||||
background: rgb(248, 250, 255);
|
||||
}
|
||||
|
||||
.tbl.compact tbody td {
|
||||
padding: 5px 12px;
|
||||
}
|
||||
|
||||
.tbl thead th.num {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.tbl-tools {
|
||||
display: flex;
|
||||
|
||||
align-items: center;
|
||||
|
||||
gap: 10px;
|
||||
|
||||
padding: 9px 14px;
|
||||
|
||||
border-bottom: 1px solid var(--line-soft);
|
||||
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.tbl-tools .right {
|
||||
margin-left: auto;
|
||||
|
||||
display: flex;
|
||||
|
||||
align-items: center;
|
||||
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
:is(#limitTable, #brokenTable, #downTable, #yesterdayTable) th {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
:is(#limitTable, #brokenTable, #downTable, #yesterdayTable) th.row-number {
|
||||
width: var(--col-rank);
|
||||
}
|
||||
|
||||
:is(#limitTable, #brokenTable, #downTable, #yesterdayTable) th:nth-child(2) {
|
||||
width: var(--col-stock);
|
||||
}
|
||||
|
||||
:is(#limitTable, #brokenTable, #downTable, #yesterdayTable) th.number {
|
||||
width: var(--col-number);
|
||||
}
|
||||
|
||||
:is(#limitTable, #brokenTable, #downTable, #yesterdayTable) thead th.num {
|
||||
text-align: right;
|
||||
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
:root[data-theme="dark"] :is(table, .data-table, .tbl) {
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
:root[data-theme="dark"] :is(table thead th, .data-table thead th, .tbl thead th) {
|
||||
border-color: var(--border);
|
||||
|
||||
background: var(--surface-muted);
|
||||
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
:root[data-theme="dark"] :is(table tbody td, .data-table tbody td, .tbl tbody td) {
|
||||
border-color: var(--line-soft);
|
||||
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
:root[data-theme="dark"] :is(table tbody tr:hover td, .data-table tbody tr:hover td, .tbl tbody tr:hover td) {
|
||||
background: var(--action-soft);
|
||||
}
|
||||
Reference in New Issue
Block a user