Skip to content

feat(examples): serve webp versions of thumbnails as default while ke… #253

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 6 commits into
base: dev_v3.5
Choose a base branch
from
Open

feat(examples): serve webp versions of thumbnails as default while ke… #253

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
f8be578
feat(examples): serve webp versions of thumbnails as default while ke…
jim-risen Jan 17, 2025
1d74c7b
Merge branch 'dev_v3.5' into images-optimization
jim-risen Jan 21, 2025
f03935a
Merge branch 'dev_v3.5' into images-optimization
jim-risen Jan 22, 2025
07dcb05
feat(examples): framework-specific URLs for images
jim-risen Jan 23, 2025
e30e94f
fix(example): missing line for previous commit
jim-risen Jan 23, 2025
6de2740
Merge branch 'dev_v3.5' into images-optimization
jim-risen Jan 23, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1,879 changes: 1,769 additions & 110 deletions Examples/package-lock.json
View file
Open in desktop

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions Examples/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,7 @@
"css-modules-typescript-loader": "^4.0.1",
"husky": "^8.0.0",
"ignore-loader": "^0.1.2",
"imagemin-webp-webpack-plugin": "^3.3.6",
"mini-css-extract-plugin": "^2.7.2",
"nodemon": "^2.0.20",
"nodemon-webpack-plugin": "^4.8.1",
Expand Down
15 changes: 4 additions & 11 deletions Examples/src/components/App.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -96,12 +96,9 @@ export default function App() {

React.useEffect(() => {
if (typeof window === "undefined") return;

setTheme(window.matchMedia("(prefers-color-scheme: dark)").matches
? ETheme.dark
: ETheme.light
);
}, []);

setTheme(window.matchMedia("(prefers-color-scheme: dark)").matches ? ETheme.dark : ETheme.light);
}, []);

React.useEffect(() => {
if (window.location.hostname.includes("scichart.com")) {
Expand Down Expand Up @@ -148,11 +145,7 @@ export default function App() {
</Drawer>
)}
<div className={classes.MainAppContent}>
<SciChartNavbar
toggleDrawer={toggleDrawer}
theme={theme}
setTheme={setTheme}
/>
<SciChartNavbar toggleDrawer={toggleDrawer} theme={theme} setTheme={setTheme} />

{isHomePage && <AppRouter currentExample={currentExample} seeAlso={[]} />}

Expand Down
2 changes: 1 addition & 1 deletion Examples/src/components/AppDetailsRouters/AppDetailsRouter.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -237,7 +237,7 @@ $drawerWidthDesktop: min(350px, 25vw);
}

.btnDocs {
background: var(--light-blue)
background: var(--light-blue);
}

.btn:hover {
Expand Down
31 changes: 22 additions & 9 deletions Examples/src/components/AppDetailsRouters/AppDetailsRouter.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -184,7 +184,7 @@ const AppDetailsRouter: FC<TProps> = (props) => {
</ul>
);
};

const isMaxWidth = pageLayout === EPageLayout.MaxWidth || !isSideBySidePossible;

return (
Expand Down Expand Up @@ -261,16 +261,29 @@ const AppDetailsRouter: FC<TProps> = (props) => {
)}

{currentExample?.markdownContent ? (
// <MarkdownContent
// selectedFramework={selectedFramework}
// currentExample={currentExample}
// <MarkdownContent
// selectedFramework={selectedFramework}
// currentExample={currentExample}
// />
<p>
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Labore fuga voluptate quos quia ratione quaerat maxime eos iure accusantium earum a corrupti eaque, voluptatum quis consequuntur rerum optio ipsam similique dignissimos totam saepe beatae aspernatur quas. Dolores itaque praesentium doloribus maiores hic tempora alias inventore explicabo architecto quod? Ut saepe officiis possimus, doloribus soluta impedit totam velit consequatur amet nesciunt quod! Beatae fugiat, repellendus magni tempore qui ipsam laudantium eos doloribus esse recusandae consectetur reiciendis vero suscipit? Nemo, consequuntur minima?
<br/>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolor tempora, at minus reiciendis, laborum libero perferendis dicta sint rem quasi repudiandae nam quod? Deserunt fuga qui ab, fugit vitae, pariatur eligendi modi molestias impedit quaerat delectus rerum. Voluptatibus ducimus odio neque amet eaque, repellendus est reprehenderit maiores tempora officiis aperiam!
<br/>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Consectetur dolore atque rerum voluptates. Omnis laboriosam error aliquam, explicabo id fugiat ipsum a asperiores tempore illum illo voluptate ut ex impedit!
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Labore fuga voluptate quos
quia ratione quaerat maxime eos iure accusantium earum a corrupti eaque, voluptatum quis
consequuntur rerum optio ipsam similique dignissimos totam saepe beatae aspernatur quas.
Dolores itaque praesentium doloribus maiores hic tempora alias inventore explicabo
architecto quod? Ut saepe officiis possimus, doloribus soluta impedit totam velit
consequatur amet nesciunt quod! Beatae fugiat, repellendus magni tempore qui ipsam
laudantium eos doloribus esse recusandae consectetur reiciendis vero suscipit? Nemo,
consequuntur minima?
<br />
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolor tempora, at minus
reiciendis, laborum libero perferendis dicta sint rem quasi repudiandae nam quod?
Deserunt fuga qui ab, fugit vitae, pariatur eligendi modi molestias impedit quaerat
delectus rerum. Voluptatibus ducimus odio neque amet eaque, repellendus est
reprehenderit maiores tempora officiis aperiam!
<br />
Lorem ipsum dolor sit amet consectetur adipisicing elit. Consectetur dolore atque rerum
voluptates. Omnis laboriosam error aliquam, explicabo id fugiat ipsum a asperiores
tempore illum illo voluptate ut ex impedit!
</p>
) : null}
</div>
Expand Down
24 changes: 13 additions & 11 deletions Examples/src/components/Breadcrumbs/ExampleBreadcrumbs.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,12 +36,14 @@ export const ExampleBreadcrumbs = () => {
// Home menu item handling
link = `/${selectedFramework}`;
title = "Home Page Gallery";
labelContent = <HomeIcon
sx={{
// align in center
verticalAlign: "middle",
}}
/>;
labelContent = (
<HomeIcon
sx={{
// align in center
verticalAlign: "middle",
}}
/>
);
menuItems = [];
} else {
// inner menu category handling
Expand All @@ -60,7 +62,7 @@ export const ExampleBreadcrumbs = () => {
overflow: "hidden",
textOverflow: { xs: "ellipsis", md: "unset", lg: "unset" },
textTransform: "unset",
color: 'var(--light-blue)',
color: "var(--light-blue)",

"&:hover": { textDecoration: "underline" },
}}
Expand Down Expand Up @@ -103,15 +105,15 @@ export const ExampleBreadcrumbs = () => {
e.preventDefault();
// Handle same-page navigation
if (window.location.pathname === `/${selectedFramework}`) {
const hash = link.split('#')[1];
const hash = link.split("#")[1];
const element = document.getElementById(hash);
if (element) {
element.scrollIntoView({
behavior: 'smooth',
block: 'start'
behavior: "smooth",
block: "start",
});
}
window.history.replaceState(null, '', link);
window.history.replaceState(null, "", link);
} else {
window.location.href = link;
}
Expand Down
4 changes: 2 additions & 2 deletions Examples/src/components/Breadcrumbs/GenericBreadcrumbs.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -161,8 +161,8 @@ export function BreadcrumbsWithMenu(props: {
>
<Paper
sx={{
backgroundColor: 'var(--bg)',
color: 'var(--text)'
backgroundColor: "var(--bg)",
color: "var(--text)",
}}
>
<ClickAwayListener onClickAway={handleClose}>
Expand Down
Loading