From 50cbdfc33d3d60324e8136ca471763dd8cc7a9d6 Mon Sep 17 00:00:00 2001 From: mitjapotocin Date: Thu, 26 Oct 2023 18:33:01 +0200 Subject: [PATCH 1/8] Smaller search button --- components/Navbar/Navbar.styled.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/components/Navbar/Navbar.styled.tsx b/components/Navbar/Navbar.styled.tsx index f5ddf8281..5e6bc134c 100644 --- a/components/Navbar/Navbar.styled.tsx +++ b/components/Navbar/Navbar.styled.tsx @@ -93,7 +93,7 @@ export const MenuList = styled.ul` export const SearchWrapper = styled.form` position: relative; - width: 160px; + width: 142px; display: flex; flex-wrap: wrap; align-items: center; @@ -142,6 +142,7 @@ export const SearchButton = styled.button` border: 1px solid #474747; border-radius: 0px 5px 5px 0px; background-color: ${({ theme }) => theme.gray}; + @media ${device.M} { margin-left: 0; } From 60b3923d151097ebf214b518206733129c0fadc0 Mon Sep 17 00:00:00 2001 From: mitjapotocin Date: Thu, 26 Oct 2023 18:38:43 +0200 Subject: [PATCH 2/8] Left align title --- components/UiKit/MainLayout.tsx | 16 ++++++++++++---- pages/home/[slug].tsx | 4 ++-- public/home/[slug]/orange_users/index.md | 3 ++- 3 files changed, 16 insertions(+), 7 deletions(-) diff --git a/components/UiKit/MainLayout.tsx b/components/UiKit/MainLayout.tsx index b9f1f551d..2c1c54de7 100644 --- a/components/UiKit/MainLayout.tsx +++ b/components/UiKit/MainLayout.tsx @@ -1,13 +1,19 @@ import { NextSeo } from "next-seo"; import { OpenGraph } from "next-seo/lib/types"; import React from "react"; -import styled from "styled-components"; +import styled, { css } from "styled-components"; import Adapt from "./Adapt"; import { Heading1 } from "./Typography"; -const H1 = styled(Heading1)` +const H1 = styled(Heading1)<{ $leftAlign?: boolean }>` margin-bottom: 50px !important; text-align: center; + + ${(props) => + props.$leftAlign && + css` + text-align: left; + `} `; const MainLayout = ({ @@ -17,6 +23,7 @@ const MainLayout = ({ openGraph, $width650, $width714, + titleLeft, }: { children: React.ReactNode | React.ReactNode[]; title?: string; @@ -24,6 +31,7 @@ const MainLayout = ({ openGraph?: OpenGraph; $width650?: boolean; $width714?: boolean; + titleLeft?: boolean; }) => { const seo = React.useMemo( () => ( @@ -35,7 +43,7 @@ const MainLayout = ({ }} /> ), - [openGraph, title] + [openGraph, title], ); if (justSEO) { @@ -50,7 +58,7 @@ const MainLayout = ({ <> {seo} - {title &&

{title}

} + {title &&

{title}

} {children} diff --git a/pages/home/[slug].tsx b/pages/home/[slug].tsx index c112c9e28..c40feb155 100644 --- a/pages/home/[slug].tsx +++ b/pages/home/[slug].tsx @@ -55,7 +55,7 @@ export async function getStaticProps({ remarkPlugins: [remarkGfm, remarkUnwrapImages], // Add remarkGfm to support MD tables rehypePlugins: [getImageData], // Adds webp src, width and height to images }, - } + }, ); return { @@ -74,7 +74,7 @@ export default function BlogPost({ mdxSource: any; }) { return ( - + ); diff --git a/public/home/[slug]/orange_users/index.md b/public/home/[slug]/orange_users/index.md index d95901b62..b9184fe3e 100644 --- a/public/home/[slug]/orange_users/index.md +++ b/public/home/[slug]/orange_users/index.md @@ -3,7 +3,7 @@ title: "Orange users" weight: 40 --- -# Education in Data Science +## Education in Data Science Orange is the perfect tool for hands-on training. Teachers enjoy the clear program design and the visual explorations of data and models. Students benefit from the flexibility of the tool and the power to invent new combinations of data mining methods. The educational strength of Orange comes from the combination of visual programming and interactive visualizations. We have also designed some educational widgets that have been explicitly created to support teaching. @@ -22,6 +22,7 @@ Not everything is a line. We can use linear regression on augmented data input w
## Regularization + If overfitting leads to the explosion of the values of the coefficients, it could easily be prevented by requesting the optimization to keep these low. That is exactly the idea behind regularization. In the workflow below, Polynomial Regression was given a regularized model. No more overfitting! It is also great to explore how the strength of regularization smooths the resulting model and reduces the values of coefficients.
From b3e61e01027afe497e1b17e4845a7335e02969f7 Mon Sep 17 00:00:00 2001 From: mitjapotocin Date: Thu, 26 Oct 2023 18:59:05 +0200 Subject: [PATCH 3/8] Make tags clickable --- components/Blog/Blog.styled.tsx | 4 ++++ components/Blog/BlogList.tsx | 12 +++++++++--- components/Blog/FeaturedBlog.tsx | 4 +++- components/Blog/Tags.tsx | 9 ++++++++- components/TagsList/Tag.tsx | 1 + components/TagsList/useTags.tsx | 20 +++++++++++++------- pages/blog/index.tsx | 20 ++++++++++++++++---- pages/examples/index.tsx | 19 ++++++++++++------- 8 files changed, 66 insertions(+), 23 deletions(-) diff --git a/components/Blog/Blog.styled.tsx b/components/Blog/Blog.styled.tsx index baee36ed2..4dfdc84b7 100644 --- a/components/Blog/Blog.styled.tsx +++ b/components/Blog/Blog.styled.tsx @@ -57,6 +57,10 @@ export const BlogTag = styled.p<{ $big?: boolean }>` margin-bottom: 6px; text-transform: capitalize; + span { + cursor: pointer; + } + ${({ $big }) => $big && css` diff --git a/components/Blog/BlogList.tsx b/components/Blog/BlogList.tsx index d7bceab14..8b7619dc2 100644 --- a/components/Blog/BlogList.tsx +++ b/components/Blog/BlogList.tsx @@ -6,7 +6,13 @@ import BlogTags from "./Tags"; import * as Styled from "./Blog.styled"; import formateDate from "@utils/formatDate"; -export default function BlogList({ blogs }: { blogs: BlogMetadata[] }) { +export default function BlogList({ + blogs, + onTagClick, +}: { + blogs: BlogMetadata[]; + onTagClick: (tag: string) => void; +}) { return ( {blogs.map( @@ -25,7 +31,7 @@ export default function BlogList({ blogs }: { blogs: BlogMetadata[] }) { )} - + {title} @@ -34,7 +40,7 @@ export default function BlogList({ blogs }: { blogs: BlogMetadata[] }) { {author}, {formateDate(date)} - ) + ), )} ); diff --git a/components/Blog/FeaturedBlog.tsx b/components/Blog/FeaturedBlog.tsx index 4d4b70277..9fa4a155d 100644 --- a/components/Blog/FeaturedBlog.tsx +++ b/components/Blog/FeaturedBlog.tsx @@ -9,9 +9,11 @@ import formateDate from "@utils/formatDate"; export default function FeaturedBlog({ blog, show, + onTagClick, }: { blog: BlogMetadata; show: boolean; + onTagClick: (tag: string) => void; }) { const { title, url, date, thumbImage, shortExcerpt, author, tags } = blog; @@ -34,7 +36,7 @@ export default function FeaturedBlog({ - + {title} diff --git a/components/Blog/Tags.tsx b/components/Blog/Tags.tsx index 3f1c825d2..ae2c2a3e7 100644 --- a/components/Blog/Tags.tsx +++ b/components/Blog/Tags.tsx @@ -3,14 +3,21 @@ import * as Styled from "./Blog.styled"; export default function BlogTags({ tags, big, + onTagClick, }: { tags: string[]; big?: boolean; + onTagClick?: (tag: string) => void; }) { return ( {tags.map((tag: string, index: number) => ( - + { + onTagClick?.(tag); + }} + key={tag} + > {tag} {index !== tags.length - 1 && ", "} diff --git a/components/TagsList/Tag.tsx b/components/TagsList/Tag.tsx index 2129924b8..34c29a569 100644 --- a/components/TagsList/Tag.tsx +++ b/components/TagsList/Tag.tsx @@ -8,6 +8,7 @@ const Tag = styled.button<{ $active?: boolean }>` border: 1px solid ${({ theme }) => theme.purple}; color: ${({ theme }) => theme.purple}; cursor: pointer; + text-transform: capitalize; ${({ $active, theme }) => $active && diff --git a/components/TagsList/useTags.tsx b/components/TagsList/useTags.tsx index a15f0af41..b1f1183cc 100644 --- a/components/TagsList/useTags.tsx +++ b/components/TagsList/useTags.tsx @@ -1,7 +1,7 @@ import { useRouter } from "next/router"; import React from "react"; -export default function useTags(data: T[], tagProp: string) { +export default function useTags(data: T[], tagProp: string, tags: string[]) { const router = useRouter(); const selectedTag = React.useMemo(() => { @@ -28,7 +28,7 @@ export default function useTags(data: T[], tagProp: string) { }, }, undefined, - { shallow: true } + { shallow: true }, ); return; @@ -42,25 +42,31 @@ export default function useTags(data: T[], tagProp: string) { }, }, undefined, - { shallow: true } + { shallow: true }, ); }, - [router, selectedTag] + [router, selectedTag], ); const filteredData = React.useMemo( () => selectedTag - ? data.filter((example: any) => - (example[tagProp] as string)?.includes(selectedTag) + ? data.filter( + (example: any) => + (example[tagProp] as string)?.includes(selectedTag), ) : data, - [data, selectedTag, tagProp] + [data, selectedTag, tagProp], ); + const allTags = React.useMemo(() => { + return [...new Set([...tags, ...(selectedTag ? [selectedTag] : [])])]; + }, [selectedTag, tags]); + return { filteredData, selectedTag, onTagClick, + allTags, }; } diff --git a/pages/blog/index.tsx b/pages/blog/index.tsx index 93522eecc..38bd40986 100644 --- a/pages/blog/index.tsx +++ b/pages/blog/index.tsx @@ -39,7 +39,11 @@ export default function Blog({ blogs: BlogMetadata[]; tags: string[]; }) { - const { filteredData, selectedTag, onTagClick } = useTags(blogs, "tags"); + const { filteredData, selectedTag, allTags, onTagClick } = useTags( + blogs, + "tags", + tags, + ); const { itemsOnPage: blogsOnPage, @@ -55,9 +59,17 @@ export default function Blog({ return ( - - - + + + ); diff --git a/pages/examples/index.tsx b/pages/examples/index.tsx index 8a3bec020..a175c637e 100644 --- a/pages/examples/index.tsx +++ b/pages/examples/index.tsx @@ -52,7 +52,7 @@ export async function getStaticProps() { ...(frontmatter as IExample), images: frontmatter.images?.map((image: string) => - getOptimizedImageAttributes(path.join(path.sep, dirInPublic, image)) + getOptimizedImageAttributes(path.join(path.sep, dirInPublic, image)), ) || [], content: mdxSource, }); @@ -75,14 +75,15 @@ export default function Examples({ examples: IExample[]; tags: string[]; }) { - const { filteredData, selectedTag, onTagClick } = useTags( + const { filteredData, selectedTag, allTags, onTagClick } = useTags( examples, - "workflows" + "workflows", + tags, ); const { itemsOnPage, setPage, page, noOfPages, setItems } = usePagination( examples, - 5 + 5, ); React.useEffect(() => { @@ -91,13 +92,17 @@ export default function Examples({ return ( - + {itemsOnPage.map( ({ title, images, content, workflows: workflowTags, download }) => ( - +

{title}

@@ -119,7 +124,7 @@ export default function Examples({ ))} - ) + ), )} From 32462aac098f68a85908391a95067503babdcd20 Mon Sep 17 00:00:00 2001 From: mitjapotocin Date: Thu, 26 Oct 2023 19:03:54 +0200 Subject: [PATCH 4/8] Text on download page --- pages/download/index.tsx | 17 +++++++---------- 1 file changed, 7 insertions(+), 10 deletions(-) diff --git a/pages/download/index.tsx b/pages/download/index.tsx index d5b2b151e..838ae4ef8 100644 --- a/pages/download/index.tsx +++ b/pages/download/index.tsx @@ -56,11 +56,8 @@ const StDownloadWrapper = styled.div` } `; -const StSmall = styled.p<{ $mt?: boolean }>` - font-size: 16px; - color: ${({ theme }) => theme.blackLight2}; - - ${(props) => props.$mt && "margin-top: 28px;"} +const StDisclaimer = styled.p` + margin-top: 28px; b { font-weight: 600; @@ -143,7 +140,7 @@ export default function Download() { text={`Orange3-${config.version}-Miniconda-x86_64.exe (64 bit)`} /> - Can be used without administrative priviledges. +

Can be used without administrative priviledges.

Portable Orange

@@ -152,10 +149,10 @@ export default function Download() { text={`Orange3-${config.version}.zip`} /> - +

No installation needed. Just extract the archive and open the shortcut in the extracted folder. - +

@@ -174,13 +171,13 @@ export default function Download() { text={`Orange3-${config.version}-Python3.8.8.dmg`} /> - + Not sure which installer to select? Click the Apple logo in the top-left corner of your screen, select About This Mac, and check the Chip or Processor field. If you see Apple, select the Orange for Apple Silicon installer. If you see Intel, select the Orange for Intel. - +
From cac9d089ee4d7404171d379bbab649aa6e5513b3 Mon Sep 17 00:00:00 2001 From: mitjapotocin Date: Thu, 26 Oct 2023 19:06:52 +0200 Subject: [PATCH 5/8] Remove box shadow --- components/Home/UsersSection.tsx | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/components/Home/UsersSection.tsx b/components/Home/UsersSection.tsx index bd8fc7a71..2d346e9f2 100644 --- a/components/Home/UsersSection.tsx +++ b/components/Home/UsersSection.tsx @@ -87,8 +87,7 @@ const SliderWrapper = styled.div` const Slide = styled.div` background: #ffffff; - border: 1px solid #d9d9d9; - box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.06); + border: 1px solid ${(props) => props.theme.borderColor}; border-radius: 6px; padding: 60px; @@ -207,7 +206,7 @@ export default function UsersSection({
- ) + ), )} {loaded && instanceRef.current && ( @@ -235,7 +234,7 @@ export default function UsersSection({ {[ ...Array( - instanceRef.current.track.details.slides.length + instanceRef.current.track.details.slides.length, ).keys(), ].map((idx) => { return ( From 1d610a021ea691ae55e19b23530a3a4e125f2a8b Mon Sep 17 00:00:00 2001 From: mitjapotocin Date: Thu, 26 Oct 2023 19:10:32 +0200 Subject: [PATCH 6/8] Blog title margin --- components/Blog/BlogList.tsx | 2 +- components/UiKit/Typography.tsx | 7 ++++++- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/components/Blog/BlogList.tsx b/components/Blog/BlogList.tsx index 8b7619dc2..4cf1584d4 100644 --- a/components/Blog/BlogList.tsx +++ b/components/Blog/BlogList.tsx @@ -32,7 +32,7 @@ export default function BlogList({ )} - + {title} {shortExcerpt} diff --git a/components/UiKit/Typography.tsx b/components/UiKit/Typography.tsx index 69eee4dc4..f8f82e3c6 100644 --- a/components/UiKit/Typography.tsx +++ b/components/UiKit/Typography.tsx @@ -21,13 +21,18 @@ export const Heading1 = styled.h1` ${LinkInsideH}; `; -export const Heading2 = styled.h2` +export const Heading2 = styled.h2<{ $mb6?: boolean }>` font-size: 22px; line-height: 1.18; font-weight: 600; margin-bottom: 16px; color: ${({ theme }) => theme.blackLight1}; + ${(props) => + props.$mb6 && + css` + margin-bottom: 6px; + `} ${LinkInsideH}; `; From f2e49ab3ed52e0ec90e0a5615c363c7b4824f3f9 Mon Sep 17 00:00:00 2001 From: mitjapotocin Date: Thu, 26 Oct 2023 19:36:32 +0200 Subject: [PATCH 7/8] Add dvopicje --- public/workshops/why_atend.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/public/workshops/why_atend.md b/public/workshops/why_atend.md index 925a0dae7..fd394f972 100644 --- a/public/workshops/why_atend.md +++ b/public/workshops/why_atend.md @@ -16,7 +16,7 @@ image: "Intro-to-Data-Mining.jpg" - Classification and predictive modeling. - Analysis of survey data, data from marketing, and voting data. -### Included +### Included: - One-day 5-hour hands-on course on key approaches of data science - Lecture notes (~40 pages) with extra explanations, illustrations and examples From 4fbde4641ffff7b335712af94d603c08c07d79ec Mon Sep 17 00:00:00 2001 From: mitjapotocin Date: Thu, 26 Oct 2023 19:50:02 +0200 Subject: [PATCH 8/8] 404 page --- components/UiKit/MainLayout.tsx | 2 +- pages/404.tsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/components/UiKit/MainLayout.tsx b/components/UiKit/MainLayout.tsx index 2c1c54de7..441a477c6 100644 --- a/components/UiKit/MainLayout.tsx +++ b/components/UiKit/MainLayout.tsx @@ -25,7 +25,7 @@ const MainLayout = ({ $width714, titleLeft, }: { - children: React.ReactNode | React.ReactNode[]; + children?: React.ReactNode | React.ReactNode[]; title?: string; justSEO?: boolean; openGraph?: OpenGraph; diff --git a/pages/404.tsx b/pages/404.tsx index 1140d14f5..dd8ed93f6 100644 --- a/pages/404.tsx +++ b/pages/404.tsx @@ -1,6 +1,6 @@ -import { useRouter } from "next/router"; +import MainLayout from "@components/UiKit/MainLayout"; import React from "react"; export default function Custom404() { - return

404 - Page Not Found

; + return ; }