{"version":3,"sources":["webpack://tribal-cabane/./src/components/hero/hero.js","webpack://tribal-cabane/./src/components/hero/heroWrapper.js","webpack://tribal-cabane/./src/components/navbar/shortNav.js","webpack://tribal-cabane/./src/components/pages/grandAtelierWrapper.js","webpack://tribal-cabane/./src/pages/ateliers.js"],"names":["CenteredLogo","styled","down","p","hasShortMenu","hideOnLargeDown","title","subtitle","color","logoSmall","useStaticQuery","flat","className","imgStyle","filter","fixed","HeroContainer","Container","up","HeroWrapper","theme","colors","hero","grandAtelier","hasImage","fontSizes","white","BackgroundImage","Img","invert","black","sm","GrandAtelierWrapper","AtelierSelectorWrapper","AtelierSelectorAtelier","lighten","lg","AtelierDetailsWrapper","AtelierSelector","ateliers","selectedIndex","onClick","map","atelier","i","key","titre","fluid","vignette","childImageSharp","AtelierDetails","React","props","ref","description","images","data","useState","selectedAtelier","setSelectedAtelier","gallery","useRef","SEO","descirption","nodes","window","top","current","offsetParent","offsetTop","behavior","onAtelierClick"],"mappings":"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","file":"component---src-pages-ateliers-js-318aa3e01da99fd6ea92.js","sourcesContent":["import React from 'react'\r\nimport BackButton from '../utils/backButton'\r\nimport MobileNavbar from '../navbar/mobileNavbar'\r\nimport {\r\n HeroWrapper,\r\n HeroContainer,\r\n} from './heroWrapper'\r\nimport { useStaticQuery, graphql } from 'gatsby';\r\nimport styled from 'styled-components';\r\nimport Img from 'gatsby-image';\r\nimport ShortNav from '../navbar/shortNav';\r\nimport {down} from 'styled-breakpoints';\r\n\r\nconst CenteredLogo = styled.div`\r\n height: 100%;\r\n display: flex;\r\n .gatsby-image-wrapper{\r\n margin: auto;\r\n }\r\n`\r\n\r\nconst Row = styled.div`\r\n display:flex;\r\n padding: 10px 0;\r\n`\r\n\r\nconst Col = styled.div`\r\n width: 33%;\r\n .subtitle{\r\n padding-top: 15px;\r\n }\r\n ${down('md')}{\r\n width: 100%;\r\n }\r\n ${p => p.hasShortMenu && `\r\n display: flex;\r\n \r\n `}\r\n \r\n ${down('lg')}{\r\n ${p => p.hideOnLargeDown && `\r\n display: none;\r\n `}\r\n ${p => p.hasShortMenu && `\r\n width: 66%;\r\n justify-content: flex-end;\r\n `}\r\n }\r\n \r\n ${down('sm')}{\r\n ${p => p.hasShortMenu && `\r\n display:none;\r\n `}\r\n }\r\n \r\n`\r\n\r\n\r\n\r\nconst Hero = ({title, subtitle, color}) => {\r\n const {logoSmall} = useStaticQuery(graphql`\r\n query HeroData{\r\n logoSmall : imageSharp(fixed: {originalName: {eq: \"logo_x2.png\"}}) {\r\n fixed(width:160) {\r\n ...GatsbyImageSharpFixed\r\n }\r\n }\r\n }\r\n `)\r\n return(\r\n \r\n \r\n \r\n \r\n
\r\n

{title}

\r\n {subtitle &&

{subtitle}

}\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n \r\n \r\n\r\n \r\n}\r\nexport default Hero","import styled from 'styled-components'\r\nimport Container from '../utils/container'\r\nimport BackgroundImage from 'gatsby-background-image'\r\nimport { up, down, between } from 'styled-breakpoints'\r\nimport Img from 'gatsby-image'\r\n\r\n\r\nconst HeroContainer = styled(Container)`\r\n ${up('2xl')}{\r\n max-width: 1300px;\r\n }\r\n ${down('xl')}{\r\n max-width: 1200px;\r\n }\r\n ${down('lg')}{\r\n max-width: 960px;\r\n }\r\n \r\n \r\n`\r\nconst HeroWrapper = styled.section`\r\n background: ${p => p.theme.colors.hero};\r\n flex-direction: column;\r\n margin-bottom: -1px;\r\n li a{\r\n color: black;\r\n }\r\n .hero-logo{\r\n height: 0;\r\n padding: 5px 0;\r\n transform: translateY(-160px);\r\n ${down('md')}{\r\n display: none;\r\n }\r\n }\r\n .burger span{\r\n background: ${p => p.theme.colors.grandAtelier};\r\n \r\n }\r\n\r\n ${p => p.hasImage ? `\r\n .hero-container{\r\n padding: 10rem 0;\r\n text-shadow: -1px -1px 19px #000;\r\n }\r\n `:''}\r\n h1, h2 {\r\n ${down('md')}{\r\n margin-left: 20px;\r\n padding-left: 0!important;\r\n }\r\n ${p => p.color && `\r\n color: ${p.color};\r\n `}\r\n }\r\n \r\n h1{\r\n font-size: ${p => p.theme.fontSizes['heroTitle']};\r\n margin-bottom: 15px!important;\r\n margin-top: 10px!important;\r\n }\r\n h2{\r\n font-size: ${p => p.theme.fontSizes['heroSubtitle']};\r\n }\r\n .title h2{\r\n margin-top: 0;\r\n }\r\n`\r\nconst LogoHeroWrapper = styled(HeroWrapper)`\r\n background: ${p => p.theme.colors.white};\r\n \r\n`\r\n\r\n\r\nconst CoverImage = styled(BackgroundImage)`\r\n &::before,\r\n &::after{\r\n filter: brightness(.6);\r\n }\r\n`\r\n\r\nconst Logo = styled(Img)`\r\n margin-left: auto;\r\n margin-top: 5px;\r\n margin-bottom: 5px;\r\n\r\n img{\r\n bottom: 0;\r\n right: 0;\r\n margin: auto;\r\n }\r\n`\r\n\r\nexport { HeroWrapper, HeroContainer, CoverImage, Logo, LogoHeroWrapper}","import React from 'react'\r\nimport {useStaticQuery, graphql, Link} from 'gatsby'\r\nimport styled from 'styled-components'\r\nimport {invert} from 'polished'\r\n\r\nconst ShortNavWrapper = styled.div` \r\n display:flex;\r\n align-self: center;\r\n flex-direction: column;\r\n padding-top: 5px;\r\n \r\n h2 {\r\n font-size: 1.3rem;\r\n margin-top: 0;\r\n margin-bottom: 0.2em;\r\n }\r\n .flex{\r\n align-items: center;\r\n justify-content: flex-end;\r\n display: flex;\r\n li{\r\n list-style:none;\r\n font-size: 0.95em;\r\n }\r\n ul:nth-child(2){\r\n line-height: 30px;\r\n }\r\n }\r\n a{\r\n color: ${p => p.color ?? p.theme.colors.white};\r\n font-weight: bold;\r\n text-decoration: underline;\r\n transition: all .25s ease-in;\r\n padding: 0 10px;\r\n &:hover{\r\n background: ${p => p.color ?? p.theme.colors.white};\r\n color: ${p => p.color ? invert(p.color) : p.theme.colors.black};\r\n border-radius: 5px;\r\n\r\n }\r\n }\r\n @media screen and (min-width: 1200px) and (max-width: 1400px) {\r\n a { font-size: ${p => p.theme.fontSizes.sm}}\r\n }\r\n \r\n`\r\n\r\n const ShortNav = ({color}) => {\r\n const {bois, cabane, deco, sculpture} = useStaticQuery(graphql`\r\n query GetSlugs {\r\n bois: strapiCreations(type: {eq: \"Boisflotte\"}) {\r\n slug\r\n type\r\n }\r\n cabane: strapiCreations(type: {eq: \"Cabane\"}) {\r\n slug\r\n type\r\n }\r\n deco: strapiCreations(type: {eq: \"Decoration\"}) {\r\n slug\r\n type\r\n }\r\n sculpture: strapiCreations(type: {eq: \"Sculpture\"}) {\r\n slug\r\n type\r\n }\r\n }\r\n `);\r\n \r\n return(\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default ShortNav;","import React from 'react'\r\nimport styled from 'styled-components'\r\nimport {lighten} from 'polished'\r\nimport Img from 'gatsby-image'\r\nimport ImageGallery from '../gallery/imageGallery'\r\nimport Container from '../utils/container'\r\nimport {down} from 'styled-breakpoints'\r\n\r\nconst GrandAtelierWrapper = styled.div`\r\n background: ${p => p.theme.colors.grandAtelier};\r\n .galery-title{\r\n color: ${p => p.theme.colors.white};\r\n text-align: center;\r\n }\r\n`\r\nconst AtelierSelectorWrapper = styled.div`\r\n display: flex;\r\n justify-content: space-between;\r\n margin: 0 100px;\r\n overflow-x: auto;\r\n ${down('lg')}{\r\n margin: 0 25px;\r\n }\r\n ${down('sm')}{\r\n margin: 0;\r\n }\r\n \r\n`;\r\nconst AtelierSelectorAtelier = styled.div`\r\n width: 33%;\r\n background: #212527;\r\n padding: 10px;\r\n margin: 10px;\r\n box-shadow: 0 25px 50px -12px rgba(0,0,0,.25);\r\n border-radius: 5px;\r\n -webkit-transition: .3s ease-in;\r\n transition: .3s ease-in;\r\n \r\n &.selected, &:hover{\r\n box-shadow: 0 25px 50px -12px rgba(0,0,0,.25);\r\n background-color: ${p => lighten(.1, p.theme.colors.grandAtelier)};\r\n }\r\n h1{\r\n color: ${p => p.theme.colors.white};\r\n font-size: ${p => p.theme.fontSizes.lg};\r\n text-align: center;\r\n margin: 0px 0 10px 0;\r\n }\r\n >.gatsby-image-wrapper{\r\n max-height: 400px;\r\n }\r\n`;\r\n\r\nconst AtelierDetailsWrapper = styled(Container)`\r\n padding: 15px;\r\n margin: 50px auto;\r\n color: ${p => p.theme.colors.white};\r\n font-size: ${p => p.theme.fontSizes.lg};\r\n ${down('md')}{\r\n margin-left: 15px;\r\n margin-right: 15px;\r\n }\r\n ${down('sm')}{\r\n margin-left: 5px;\r\n margin-right: 5px;\r\n }\r\n`\r\nconst AtelierSelector = ({ateliers, selectedIndex, onClick}) => {\r\n \r\n return (\r\n \r\n {ateliers.map((atelier, i) => {\r\n return(\r\n onClick(i)}>\r\n

{atelier.titre}

\r\n \r\n \r\n )\r\n })}\r\n \r\n )\r\n}\r\n\r\nconst AtelierDetails = React.forwardRef((props, ref) => (\r\n <>\r\n \r\n

{props.atelier.description}

\r\n \r\n \r\n\r\n \r\n ));\r\n\r\n\r\nexport {GrandAtelierWrapper, AtelierSelectorWrapper, AtelierSelectorAtelier, AtelierSelector, AtelierDetails}","import React, {useState, useRef} from 'react'\r\nimport { useStaticQuery, graphql } from \"gatsby\"\r\nimport DefaultLayout from '../components/layouts/defaultLayout'\r\nimport SEO from '../components/utils/SEO'\r\nimport Footer from '../components/footer/footer'\r\nimport {\r\n GrandAtelierWrapper, \r\n AtelierSelector, \r\n AtelierDetails\r\n} from '../components/pages/grandAtelierWrapper'\r\nimport {window} from 'browser-monads'\r\nimport theme from '../theme/theme'\r\nimport Hero from '../components/hero/hero'\r\n\r\nconst LeGrandAtelier = () => {\r\n const data = useStaticQuery(graphql`\r\n query AtelierQuery {\r\n ateliers:allStrapiAteliers {\r\n nodes {\r\n images {\r\n localFile {\r\n childImageSharp {\r\n fluid {\r\n ...GatsbyImageSharpFluid_withWebp_tracedSVG\r\n presentationWidth\r\n presentationHeight\r\n }\r\n }\r\n }\r\n }\r\n vignette {\r\n childImageSharp {\r\n fluid {\r\n ...GatsbyImageSharpFluid_withWebp_tracedSVG\r\n presentationWidth\r\n presentationHeight\r\n }\r\n }\r\n }\r\n description\r\n titre\r\n }\r\n }\r\n \r\n }\r\n `)\r\n\r\n const [selectedAtelier, setSelectedAtelier] = useState(0);\r\n const gallery = useRef();\r\n\r\n const onAtelierClick = (i) => {\r\n setSelectedAtelier(i);\r\n window.scrollTo({\r\n top: gallery.current.offsetParent.offsetTop,\r\n behavior: 'smooth'\r\n })\r\n \r\n }\r\n\r\n return(\r\n \r\n \r\n \r\n \r\n onAtelierClick(i)}/>\r\n\r\n \r\n \r\n