💄 style(ui): enhance table scroll card scrollbar visibility and appearance
- Make Y-axis scrollbar visible for .table-scroll-card .semi-card-body - Reduce scrollbar width from 6px to 4px for a more subtle appearance - Decrease scrollbar opacity from 0.3 to 0.2 for lighter color - Adjust hover opacity from 0.5 to 0.35 for consistent lighter theme - Remove previous scrollbar hiding styles to improve user experience This change improves the usability of table scroll cards by providing visual feedback for scrollable content while maintaining a clean, unobtrusive design aesthetic.
This commit is contained in:
@@ -694,13 +694,23 @@ html.dark .with-pastel-balls::before {
|
||||
.table-scroll-card .semi-card-body {
|
||||
flex: 1 1 auto;
|
||||
overflow-y: auto;
|
||||
|
||||
-ms-overflow-style: none;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.table-scroll-card .semi-card-body::-webkit-scrollbar {
|
||||
display: none;
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
.table-scroll-card .semi-card-body::-webkit-scrollbar-thumb {
|
||||
background: rgba(var(--semi-grey-2), 0.3);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.table-scroll-card .semi-card-body::-webkit-scrollbar-thumb:hover {
|
||||
background: rgba(var(--semi-grey-2), 0.5);
|
||||
}
|
||||
|
||||
.table-scroll-card .semi-card-body::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
|
||||
Reference in New Issue
Block a user