-
Notifications
You must be signed in to change notification settings - Fork 95
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
49ead75
commit 06fdb1e
Showing
1 changed file
with
31 additions
and
58 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,72 +1,45 @@ | ||
| import React, { Component } from 'react'; | ||
| import FirstSection from './FirstSection'; | ||
| import SecondSection from './SecondSection'; | ||
| import HowToHelpSection from './HowToHelpSection'; | ||
| import MovementSection from './MovementSection'; | ||
| import ProjectsSection from './ProjectsSection'; | ||
| import EventsSection from './EventsSection'; | ||
| import './styles.scss'; | ||
| import React, { Component } from 'react' | ||
| import FirstSection from './FirstSection' | ||
| import SecondSection from './SecondSection' | ||
| import HowToHelpSection from './HowToHelpSection' | ||
| import MovementSection from './MovementSection' | ||
| import ProjectsSection from './ProjectsSection' | ||
| import EventsSection from './EventsSection' | ||
| import './styles.scss' | ||
|
|
||
| class Home extends Component { | ||
| componentDidMount() { | ||
| window.__setDocumentTitle('Home'); | ||
| componentDidMount () { | ||
| window.__setDocumentTitle('Home') | ||
| } | ||
|
|
||
| render() { | ||
| let url; | ||
| let opacity; | ||
| render () { | ||
| let url | ||
| let opacity | ||
| if (window.__mapType === 'gatherings') { | ||
| url = '/images/Public-happiness-movement-new-banner-01.jpg'; | ||
| url = '/images/Public-happiness-movement-new-banner-01.jpg' | ||
| // opacity = 0.5 | ||
| } else { | ||
| url = '/images/focallocal-bgOG.jpg'; | ||
| url = '/images/focallocal-bgOG.jpg' | ||
| } | ||
| let backgroundImage = { | ||
| backgroundImage: `url(${url})`, | ||
| opacity, | ||
| backgroundAttachment: 'fixed', | ||
| backgroundPosition: 'center top', | ||
| backgroundSize: 'cover', | ||
| }; | ||
| let imgStyle = { width: '100%' }; | ||
|
|
||
| let largeScreenStyle = ` | ||
| @media (min-width: 768px) { | ||
| .home { | ||
| position: relative; | ||
| overflow: hidden; | ||
| } | ||
| .background-image { | ||
| position: fixed; | ||
| top: 4em; /* Push the background image down by 4em */ | ||
| left: 0; | ||
| width: 100%; | ||
| height: 100%; | ||
| background-size: cover; | ||
| z-index: -1; | ||
| } | ||
| .home-content { | ||
| position: relative; | ||
| padding-top: 30vh; | ||
| text-align: center; | ||
| z-index: 1; | ||
| } | ||
| } | ||
| `; | ||
|
|
||
| let backgroundImage = { backgroundImage: 'url(' + url + ')', opacity } | ||
| let imgStyle = { width: '100%' } | ||
| return ( | ||
| <main className="home"> | ||
| <style>{largeScreenStyle}</style> | ||
| <div className="background-image" style={backgroundImage}></div> | ||
| <div className="home-content"> | ||
| <MovementSection /> | ||
| <ProjectsSection /> | ||
| <EventsSection /> | ||
| {/* Add the other content sections here */} | ||
| <main className='home'> | ||
| {/* <div id='hero-bg' style={backgroundImage} /> */} | ||
| <div> | ||
| <img src={url} style={imgStyle} /> | ||
| </div> | ||
| <MovementSection /> | ||
| <ProjectsSection /> | ||
| <EventsSection /> | ||
| {/* | ||
| <FirstSection /> | ||
| <HowToHelpSection /> | ||
| <SecondSection button/> | ||
| */} | ||
| </main> | ||
| ); | ||
| ) | ||
| } | ||
| } | ||
|
|
||
| export default Home; | ||
| export default Home |