Yusaki/MiroFish
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add custom scrollbar styles for left and right panels in Step4Report component

Browse source 
- Introduced custom scrollbar styles for both left and right panels to enhance the visual appearance and user experience.
- Adjusted scrollbar width, track background, and thumb colors for improved aesthetics and usability.
This commit is contained in:
666ghj 2025-12-14 03:43:40 +08:00
parent 1db72dcd6b
commit be90a46cb4
1 changed files with 34 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
frontend/src/components/Step4Report.vue
View file

@ -1196,6 +1196,23 @@ watch(() => props.reportId, (newId) => {
flex-direction: column;
}
.left-panel::-webkit-scrollbar {
width: 4px;
}
.left-panel::-webkit-scrollbar-track {
background: transparent;
}
.left-panel::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.15);
border-radius: 2px;
}
.left-panel::-webkit-scrollbar-thumb:hover {
background: rgba(0, 0, 0, 0.25);
}
.outline-overview {
padding: 20px;
border-bottom: 1px solid #F3F4F6;
@ -1567,6 +1584,23 @@ watch(() => props.reportId, (newId) => {
flex-direction: column;
}
.right-panel::-webkit-scrollbar {
width: 4px;
}
.right-panel::-webkit-scrollbar-track {
background: transparent;
}
.right-panel::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.12);
border-radius: 2px;
}
.right-panel::-webkit-scrollbar-thumb:hover {
background: rgba(0, 0, 0, 0.2);
}
/* Workflow Timeline */
.workflow-timeline {
padding: 20px;