mirror of
https://github.com/pacnpal/Roo-Code.git
synced 2025-12-21 04:41:16 -05:00
128 lines
3.2 KiB
CSS
128 lines
3.2 KiB
CSS
textarea:focus {
|
|
outline: 1.5px solid var(--vscode-focusBorder, #007fd4);
|
|
}
|
|
|
|
vscode-button::part(control):focus {
|
|
outline: none;
|
|
}
|
|
|
|
/*
|
|
Use vscode native scrollbar styles
|
|
https://github.com/gitkraken/vscode-gitlens/blob/b1d71d4844523e8b2ef16f9e007068e91f46fd88/src/webviews/apps/home/home.scss
|
|
*/
|
|
|
|
html {
|
|
height: 100%;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
}
|
|
|
|
body.scrollable,
|
|
.scrollable,
|
|
body.code-block-scrollable,
|
|
.code-block-scrollable {
|
|
border-color: transparent;
|
|
transition: border-color 0.7s linear;
|
|
}
|
|
|
|
body:hover.scrollable,
|
|
body:hover .scrollable,
|
|
body:focus-within.scrollable,
|
|
body:focus-within .scrollable,
|
|
body:hover.code-block-scrollable,
|
|
body:hover .code-block-scrollable,
|
|
body:focus-within.code-block-scrollable,
|
|
body:focus-within .code-block-scrollable {
|
|
border-color: var(--vscode-scrollbarSlider-background);
|
|
transition: none;
|
|
}
|
|
|
|
.scrollable::-webkit-scrollbar-corner {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
.scrollable::-webkit-scrollbar-thumb {
|
|
background-color: transparent;
|
|
border-color: inherit;
|
|
border-right-style: inset;
|
|
border-right-width: calc(100vw + 100vh);
|
|
border-radius: unset !important;
|
|
}
|
|
|
|
.scrollable::-webkit-scrollbar-thumb:hover {
|
|
border-color: var(--vscode-scrollbarSlider-hoverBackground);
|
|
}
|
|
|
|
.scrollable::-webkit-scrollbar-thumb:active {
|
|
border-color: var(--vscode-scrollbarSlider-activeBackground);
|
|
}
|
|
|
|
/*
|
|
Fix VSCode ignoring webkit scrollbar modifiers
|
|
https://github.com/microsoft/vscode/issues/213045
|
|
*/
|
|
@supports selector(::-webkit-scrollbar) {
|
|
html {
|
|
scrollbar-color: unset;
|
|
}
|
|
}
|
|
|
|
/*
|
|
The above scrollbar styling uses some transparent background color magic to accomplish its animation. However this doesn't play nicely with SyntaxHighlighter, so we need to set a background color for the code blocks' horizontal scrollbar. This actually has the unintended consequence of always showing the scrollbar which I prefer since it makes it more obvious that there is more content to scroll to.
|
|
*/
|
|
|
|
.code-block-scrollable::-webkit-scrollbar-track {
|
|
background: transparent;
|
|
}
|
|
|
|
.code-block-scrollable::-webkit-scrollbar-thumb {
|
|
background-color: var(--vscode-scrollbarSlider-background);
|
|
border-radius: 5px;
|
|
border: 2px solid transparent;
|
|
background-clip: content-box;
|
|
}
|
|
|
|
.code-block-scrollable::-webkit-scrollbar-thumb:hover {
|
|
background-color: var(--vscode-scrollbarSlider-hoverBackground);
|
|
}
|
|
|
|
.code-block-scrollable::-webkit-scrollbar-thumb:active {
|
|
background-color: var(--vscode-scrollbarSlider-activeBackground);
|
|
}
|
|
|
|
.code-block-scrollable::-webkit-scrollbar-corner {
|
|
background-color: transparent;
|
|
}
|
|
|
|
/*
|
|
Dropdown label
|
|
https://github.com/microsoft/vscode-webview-ui-toolkit/tree/main/src/dropdown#with-label
|
|
*/
|
|
.dropdown-container {
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
flex-flow: column nowrap;
|
|
align-items: flex-start;
|
|
justify-content: flex-start;
|
|
}
|
|
.dropdown-container label {
|
|
display: block;
|
|
color: var(--vscode-foreground);
|
|
cursor: pointer;
|
|
font-size: var(--vscode-font-size);
|
|
line-height: normal;
|
|
margin-bottom: 2px;
|
|
}
|
|
|
|
/* Fix scrollbar in dropdown */
|
|
|
|
vscode-dropdown::part(listbox) {
|
|
border-color: var(--vscode-scrollbarSlider-background);
|
|
transition: none;
|
|
scrollbar-color: var(--vscode-scrollbarSlider-background) transparent;
|
|
}
|