extern/bruno
1
0
Fork 1
mirror of https://github.com/usebruno/bruno.git synced 2024-12-23 07:09:01 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(#BRU-7) - scrollbar styling for linux and windows (#1589)

Browse Source
This commit is contained in:
lohit 2024-02-15 15:00:18 +05:30 committed by GitHub
parent 5fece08f4b
commit bd002ca316
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 35 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
packages/bruno-app/src/globalStyles.js
View File

@ -159,6 +159,33 @@ const GlobalStyle = createGlobalStyle`
}
}
// scrollbar styling
// the below media query target non-macos devices
// (macos scrollbar styling is the ideal style reference)
@media not all and (pointer: coarse) {
* {
scrollbar-width: thin;
scrollbar-color: ${(props) => props.theme.scrollbar.color};
}
*::-webkit-scrollbar {
width: 5px;
}
*::-webkit-scrollbar-track {
background: transparent;
border-radius: 5px;
}
*::-webkit-scrollbar-thumb {
background-color: ${(props) => props.theme.scrollbar.color};
border-radius: 14px;
border: 3px solid ${(props) => props.theme.scrollbar.color};
}
}
// codemirror
.CodeMirror {
.cm-variable-valid {

4
packages/bruno-app/src/themes/dark.js
View File

@ -238,6 +238,10 @@ const darkTheme = {
plainGrid: {
hoverBg: '#3D3D3D'
},
scrollbar: {
color: 'rgb(52 51 49)'
}
};

4
packages/bruno-app/src/themes/light.js
View File

@ -242,6 +242,10 @@ const lightTheme = {
plainGrid: {
hoverBg: '#f4f4f4'
},
scrollbar: {
color: 'rgb(152 151 149)'
}
};