mirror of
https://github.com/pybricks/pybricks-code.git
synced 2026-09-12 09:36:27 +00:00
move scrollbar styling to @pybricks/ide-docs
This makes the scrollbar flashing less noticeable, but there is still a bit of a flash in dark mode due to the fact that we are still injecting the class in the load event in that case.
This commit is contained in:
+1
-1
@@ -11,7 +11,7 @@
|
||||
"@blueprintjs/core": "^3.38.1",
|
||||
"@craco/craco": "^6.0.0",
|
||||
"@pybricks/firmware": "4.5.0",
|
||||
"@pybricks/ide-docs": "1.0.0",
|
||||
"@pybricks/ide-docs": "1.1.0",
|
||||
"@pybricks/mpy-cross-v5": "^2.0.0",
|
||||
"@shopify/react-i18n": "^5.2.1",
|
||||
"@testing-library/dom": "^7.29.2",
|
||||
|
||||
@@ -145,53 +145,6 @@ function App(): JSX.Element {
|
||||
}
|
||||
});
|
||||
|
||||
const style = document.createElement('style');
|
||||
|
||||
// TODO: how to get these programmatically from values set in variables.scss?
|
||||
const iconColor = '#5c7080';
|
||||
const iconColorHover = '#182026';
|
||||
const appBackgroundColor = '#e8e8e8';
|
||||
const darkIconColor = '#a7b6c2';
|
||||
const darkIconColorHover = '#f5f8fa';
|
||||
const darkAppBackgroundColor = '#293742';
|
||||
|
||||
// This is scrollbar style coped from index.scss.
|
||||
style.innerText = `
|
||||
::-webkit-scrollbar {
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
.${Classes.DARK} ::-webkit-scrollbar-track {
|
||||
background: ${darkAppBackgroundColor};
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: ${appBackgroundColor};
|
||||
}
|
||||
|
||||
.${Classes.DARK} ::-webkit-scrollbar-thumb {
|
||||
border-color: ${darkAppBackgroundColor};
|
||||
background: ${darkIconColor};
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
border-width: 3px;
|
||||
border-style: solid;
|
||||
border-radius: 8px;
|
||||
border-color: ${appBackgroundColor};
|
||||
background: ${iconColor};
|
||||
}
|
||||
|
||||
.${Classes.DARK} ::-webkit-scrollbar-thumb:hover {
|
||||
background: ${darkIconColorHover};
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: ${iconColorHover};
|
||||
}
|
||||
`;
|
||||
contentWindow.document.head.appendChild(style);
|
||||
|
||||
if (document.body.classList.contains(Classes.DARK)) {
|
||||
contentWindow.document.documentElement.classList.add(
|
||||
Classes.DARK,
|
||||
|
||||
@@ -1462,10 +1462,10 @@
|
||||
dependencies:
|
||||
jszip "^3.5.0"
|
||||
|
||||
"@pybricks/ide-docs@1.0.0":
|
||||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/@pybricks/ide-docs/-/ide-docs-1.0.0.tgz#e93ff78c65730bbdd26b9deaf3110799d46de8e6"
|
||||
integrity sha512-pe52fHG3S2QIx7RLX8+a+5oQo5A/svR2bxJWWImwZ2unAbPYmZ2G/25zgtYb9JF4Fec2f9mLT2zRiGqUjiCjiw==
|
||||
"@pybricks/ide-docs@1.1.0":
|
||||
version "1.1.0"
|
||||
resolved "https://registry.yarnpkg.com/@pybricks/ide-docs/-/ide-docs-1.1.0.tgz#15c46def964ad8e92805bc3746a1d418d145e5c4"
|
||||
integrity sha512-NwEPoAnMSvNShtzXSSuf+zOf3COPzXb0DQiD7RV6p3edCPvcgZn53JZvZscXdyudAruOMHZciw/jW8X4dJee2g==
|
||||
|
||||
"@pybricks/mpy-cross-v5@^2.0.0":
|
||||
version "2.0.0"
|
||||
|
||||
Reference in New Issue
Block a user