diff --git a/package.json b/package.json index afac16e..f0f38d1 100644 --- a/package.json +++ b/package.json @@ -19,6 +19,7 @@ "react-rnd": "^10.1.7", "react-scripts": "3.2.0", "react-starfield-animation": "^1.0.1", + "react-timezone": "^2.4.0", "styled-components": "^5.0.0-beta.9", "webfontloader": "^1.6.28" }, diff --git a/src/components/MetaFest.js b/src/components/MetaFest.js index 313bb99..dd9715a 100644 --- a/src/components/MetaFest.js +++ b/src/components/MetaFest.js @@ -4456,177 +4456,7 @@ function SvgImagemap (props) { fill='url(#imagemap_svg__pattern9)' d='M366.791 576.149h41.734v73.004h-41.734z' /> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - { const ButtonContainer = styled.div` position: absolute; + z-index: 5; background-color: ${props => props.theme.background}; - // opacity: 0.7; + opacity: 0.9; width: 100vw; height: 100vh; display: grid; justify-self: center; - justify-content: end; + place-content: center; ` const CloseButton = styled.button` background: unset; @@ -141,16 +169,35 @@ const ShowSection = () => {
{isHidden ? null : ( - {isHidden ? null : } + {isHidden ? null : } + {isHidden ? null : } - {isHidden ? '' : 'Close this message'} + {isHidden ? '' : 'Click Me'} )}
) } -const Element = () => ( + +const DesktopElement = () => ( + +

+ To enter METAFEST, you will have to +
+ + donate to our Gitcoin grant + +

+

just joking ... here you go

+ +) + +const MobileElement = () => (

This website is optimized for desktop.{' '} @@ -163,7 +210,9 @@ const Element = () => ( ) const Space = () => { - const { currentFloatingSpaces } = useContext(FloatingSpaceContext) + const { currentFloatingSpaces, addFloatingSpace } = useContext( + FloatingSpaceContext + ) const space = currentFloatingSpaces @@ -194,33 +243,52 @@ const Space = () => { return ( - + + - MetaFest addFloatingSpace('Calendar')} /> - + + + addFloatingSpace('Apply')} /> diff --git a/src/components/integrations/CalendarInstance.js b/src/components/integrations/CalendarInstance.js index cb19c12..b03df22 100644 --- a/src/components/integrations/CalendarInstance.js +++ b/src/components/integrations/CalendarInstance.js @@ -1,12 +1,56 @@ -import React from 'react' +import React, { useState } from 'react' +import TimezonePicker from 'react-timezone' +import styled from '@emotion/styled' + +const InstanceContainer = styled.div` + grid-template-rows: 1fr auto; + li { + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, + Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; + background-color: #aaaaaa; + color: '#310C4FDD'; + } +` function CalendarInstance () { + const [timezone, changeTimezone] = useState('Europe/London') return ( -