diff --git a/src/components/PageSection2.tsx b/src/components/PageSection2.tsx index b44550c..cae3d03 100644 --- a/src/components/PageSection2.tsx +++ b/src/components/PageSection2.tsx @@ -7,7 +7,7 @@ const Section = styled.section` flex-flow: row wrap; justify-content: space-between; position: relative; - padding: 2rem 1rem 2rem; + padding: ${(p) => p.fullSize ? "0" : "2rem 1rem 2rem"}; &.sectionBg-darkBlue { color: ${colors.white}; diff --git a/src/views/FrontPage/FrontPageHero.tsx b/src/views/FrontPage/FrontPageHero.tsx index 8bdd425..09c303b 100644 --- a/src/views/FrontPage/FrontPageHero.tsx +++ b/src/views/FrontPage/FrontPageHero.tsx @@ -5,9 +5,12 @@ import { colors } from "@theme/colors"; import Anchor from "@components/Anchor"; const HeroSection = styled(PageSection)` - padding: 0 1rem; min-height: 70vh; + section, aside { + padding: 0 1rem; + } + @media screen and (max-width: 800px) { flex-direction: column; @@ -23,28 +26,33 @@ const HeroSection = styled(PageSection)` } `; -const MainSection = styled.section` +const MainSections = styled.div` flex: 8; +`; - & > div { - margin: 15vh auto 0; - max-width: 600px; - text-align: center; - line-height: 1.5rem; +const PrimarySection = styled.section` + margin: 15vh auto 0; + max-width: 600px; + text-align: center; + line-height: 1.5rem; - h1 { - line-height: 40px; - @media screen and (max-width: 500px) { - font-size: 2rem; - } - } - - p { - max-width: 400px; - margin: 1em auto; - font-weight: 100; + h1 { + line-height: 40px; + @media screen and (max-width: 500px) { + font-size: 2rem; } } + + p { + max-width: 400px; + margin: 1em auto; + font-weight: 100; + } +`; + +const SecondarySection = styled.section` + background-color: blue; + /* height: 100%; */ `; const Buttons = styled.div` @@ -121,8 +129,8 @@ const AsideItem = styled.article` const FrontPageHero: React.FC = () => ( - -
+ +

Aalto-yliopiston Sähköinsinöörikilta

on elektroniikan ja sähkötekniikan opiskelijoiden järjestö. Kilta @@ -141,8 +149,10 @@ const FrontPageHero: React.FC = () => ( -

-
+ + + +