From 6909a08c349a3ae3141b5d946f43ef7b283c95b1 Mon Sep 17 00:00:00 2001 From: Aarni Halinen Date: Fri, 7 May 2021 23:24:08 +0300 Subject: [PATCH 1/4] update breakpoints --- src/pages/_app.tsx | 7 ++++--- src/theme/breakpoints.ts | 8 ++++---- 2 files changed, 8 insertions(+), 7 deletions(-) diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index 039e3d3..e6e1f5f 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -5,6 +5,7 @@ import Head from "next/head"; import styled, { createGlobalStyle } from "styled-components"; import { ToastContainer } from "react-toastify"; import { colors } from "@theme/colors"; +import breakpoints from "@theme/breakpoints"; import LocaleStore from "../i18n"; import "react-mde/lib/styles/css/react-mde-all.css"; @@ -25,17 +26,17 @@ html { font-size: ${fontSize * 0.75}pt; line-height: ${lineHeight}; - @media screen and (min-width: 1200px) { + @media screen and (min-width: ${breakpoints.medium}) { /* 16px */ font-size: ${fontSize}pt; } - @media screen and (min-width: 1920px) { + @media screen and (min-width: ${breakpoints.large}) { /* 20px */ font-size: ${fontSize * 1.25}pt; } - @media screen and (min-width: 2560px) { + @media screen and (min-width: ${breakpoints.xlarge}) { /* 24px */ font-size: ${fontSize * 1.5}pt; } diff --git a/src/theme/breakpoints.ts b/src/theme/breakpoints.ts index d7b5829..416b4ad 100644 --- a/src/theme/breakpoints.ts +++ b/src/theme/breakpoints.ts @@ -1,10 +1,10 @@ type Keys = "mobile" | "medium" | "large" | "xlarge"; const breakpointsNumber: Record = { - mobile: 800, - medium: 1200, - large: 1920, - xlarge: 2560, + mobile: 801, + medium: 1201, + large: 1921, + xlarge: 2561, }; const breakpoints = Object.entries(breakpointsNumber).map(([k, v]) => [k, `${v}px`]).reduce((a, [k, v]) => ({ ...a, [k]: v }), {}); From 1fcd9f9dd1005d03c1d53ddcf9d2da90ffe66736 Mon Sep 17 00:00:00 2001 From: Aarni Halinen Date: Sat, 8 May 2021 00:29:26 +0300 Subject: [PATCH 2/4] add some links --- src/components/Footer/FooterContent.tsx | 2 + src/components/Navigation.tsx | 15 +- src/components/NavigationMobile.tsx | 22 +- src/views/HonoraryPage/HonoraryPageView.tsx | 1052 ++++++++++--------- 4 files changed, 542 insertions(+), 549 deletions(-) diff --git a/src/components/Footer/FooterContent.tsx b/src/components/Footer/FooterContent.tsx index 9ed71b4..5afc07a 100644 --- a/src/components/Footer/FooterContent.tsx +++ b/src/components/Footer/FooterContent.tsx @@ -86,6 +86,8 @@ const FooterContent: React.FC = () => ( Jäseneksi Palaute Dokumenttiarkisto + Kuvagalleria + Logot ja grafiikka diff --git a/src/components/Navigation.tsx b/src/components/Navigation.tsx index 9271506..770d717 100644 --- a/src/components/Navigation.tsx +++ b/src/components/Navigation.tsx @@ -6,20 +6,21 @@ import Icon, { IconType } from "./Icon"; import NavbarDropdownLink from "./NavbarDropdownLink"; import NavbarChildLink from "./NavbarChildLink"; -const renderNavigationDesktopItems = () => ( +export const renderNavigationItems = (mobile = false) => ( <> - + Toiminta Fuksi Kunnianosoitukset Dokumenttiarkisto + Kuvagalleria - - - + + + {/* Simo Höglund */} - + ); @@ -104,7 +105,7 @@ interface NavigationProps { } const Navigation: React.FC = ({ onMobileMenuOpen }) => { - const desktopItems = renderNavigationDesktopItems(); + const desktopItems = renderNavigationItems(); return (