diff --git a/src/components/nav.js b/src/components/nav.js index 3f48f62..b43302f 100644 --- a/src/components/nav.js +++ b/src/components/nav.js @@ -13,6 +13,24 @@ let pages = [ ['supporte uns', '/support/', ''], ] +function PathCheck(path, link) { + if(path === link) { + return ' ' + navStyles.navItemActive + } + + if(link !== '/' && path !== '/') { + if(path.includes(link)){ + return ' ' + navStyles.navItemActive + } + + if(link.includes(path)){ + return ' ' + navStyles.navItemActive + } + } + + return '' +} + export default function Nav({ path }) { // nav items should always be active in the staticly generated html const isSSR = typeof window === 'undefined' @@ -44,7 +62,7 @@ export default function Nav({ path }) { {pages.map(([title, link, device]) => ( diff --git a/src/components/roomState.js b/src/components/roomState.js index 48dceb9..3f854e1 100644 --- a/src/components/roomState.js +++ b/src/components/roomState.js @@ -1,4 +1,5 @@ import React, { useEffect, useState } from 'react' +import { StaticImage } from 'gatsby-plugin-image' const roomStateData = { loading: { text: '...', color: 'white' }, @@ -7,6 +8,24 @@ const roomStateData = { error: { text: 'laut API kaputt', color: '#ee3333' }, } +function GetRightImage(openState) { + if(openState === 'loading') { + return + } + + if(openState === 'open'){ + return + } + + if(openState === 'closed'){ + return + } + + if(openState === 'error'){ + return + } +} + export default function RoomState() { const [openState, setOpenState] = useState('loading') @@ -25,12 +44,13 @@ export default function RoomState() { }, []) const isSSR = typeof window === 'undefined' + const useIMG = false return ( - {isSSR ? '' : roomStateData[openState].text} + {isSSR ? '' : useIMG ? GetRightImage(openState) : roomStateData[openState].text} ) } diff --git a/src/images/tuer_offen.png b/src/images/tuer_offen.png new file mode 100644 index 0000000..bc23ff2 Binary files /dev/null and b/src/images/tuer_offen.png differ diff --git a/src/images/tuer_zu.png b/src/images/tuer_zu.png new file mode 100644 index 0000000..94f28a0 Binary files /dev/null and b/src/images/tuer_zu.png differ diff --git a/src/images/warning.png b/src/images/warning.png new file mode 100644 index 0000000..d6ee587 Binary files /dev/null and b/src/images/warning.png differ diff --git a/src/styles/global.css b/src/styles/global.css index d03331f..7fbca3e 100644 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -22,6 +22,11 @@ body { a { color: #22bb22; + text-decoration: none; +} + +a:hover { + text-decoration: underline; } a:visited { diff --git a/src/templates/blogTemplate.js b/src/templates/blogTemplate.js index 362d007..f31bb19 100644 --- a/src/templates/blogTemplate.js +++ b/src/templates/blogTemplate.js @@ -5,10 +5,10 @@ import { MDXRenderer } from 'gatsby-plugin-mdx' import { MDXProvider } from '@mdx-js/react' import { Helmet } from 'react-helmet' -const MdLeakH1 = (props) =>

# {props.children}

-const MdLeakH2 = (props) =>

## {props.children}

-const MdLeakH3 = (props) =>

### {props.children}

-const MdLeakH4 = (props) =>
#### {props.children}
+const MdLeakH1 = (props) =>

{props.children}

+const MdLeakH2 = (props) =>

{props.children}

+const MdLeakH3 = (props) =>

{props.children}

+const MdLeakH4 = (props) =>
{props.children}
const components = { h1: MdLeakH1, diff --git a/src/templates/siteTemplate.js b/src/templates/siteTemplate.js index 5e93edc..e1a1b39 100644 --- a/src/templates/siteTemplate.js +++ b/src/templates/siteTemplate.js @@ -8,10 +8,10 @@ import { Helmet } from 'react-helmet' const ide = 'https://repos.ctdo.de/neri/ctdo-homepage/_edit/master/src/webpages/' -const MdLeakH1 = (props) =>

# {props.children}

-const MdLeakH2 = (props) =>

## {props.children}

-const MdLeakH3 = (props) =>

### {props.children}

-const MdLeakH4 = (props) =>
#### {props.children}
+const MdLeakH1 = (props) =>

{props.children}

+const MdLeakH2 = (props) =>

{props.children}

+const MdLeakH3 = (props) =>

{props.children}

+const MdLeakH4 = (props) =>
{props.children}
const components = { h1: MdLeakH1,