YourWishes/domsPlace
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Adjusted styles a bit more, fixed a scroll overflow bug

Browse Source
This commit is contained in:
Dominic Masters
2018-05-12 20:57:09 +10:00
parent bc54923f64
commit 556a903afa
5 changed files with 13 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/page/PageBoundary.jsx
View File

@ -25,7 +25,7 @@ import React from 'react';
export default function(props) { export default function(props) {
return ( return (
<div className="c-page__boundary"> <div className={"c-page__boundary" + (props.full ? " is-full" : "") }>
{ props.children } { props.children }
</div> </div>
); );

0
public/page/contact/ContactPage.jsx Normal file
View File

23
public/page/home/Homepage.jsx
View File

@ -32,25 +32,14 @@ import { Title, Subtitle } from './../../typography/Typography';
export default function() { export default function() {
return ( return (
<Page style="home-page" className="p-home-page"> <Page style="home-page" className="p-home-page">
<ImageSection <Section full>
full <PageBoundary full>
src={ require('./../../images/test/img_red.png') } <FloatingContentBox position="middle right" size="small" className="u-text-center ">
sources={[ <Title>Development & Design</Title>
{ src: require('./../../images/test/320x320.png'), size: 320 }, <Subtitle>I'm not good at either.</Subtitle>
{ src: require('./../../images/test/320x320x2.png'), size: 320, scale: 2 },
{ src: require('./../../images/test/640x640.png'), size: 640 },
{ src: require('./../../images/test/1280x1280.png'), size: 640, scale: 2 },
{ src: require('./../../images/test/1280x1280.png'), size: 1280 }
]}
>
<PageBoundary fill>
<FloatingContentBox position="middle right" size="small" className="u-text-center p-home-page__video-content">
<Title>My Cool Page</Title>
<Subtitle>Lorem ipsum dolor</Subtitle>
<Button>Hello</Button>
</FloatingContentBox> </FloatingContentBox>
</PageBoundary> </PageBoundary>
</ImageSection> </Section>
<Section full> <Section full>
Lorem Lorem

5
public/styles/components/_page.scss
View File

@ -14,5 +14,10 @@
&__boundary { &__boundary {
max-width: $s-screen-boundary; max-width: $s-screen-boundary;
margin: 0 auto; margin: 0 auto;
&.is-full {
position: relative;
height: 100%;
}
} }
} }

2
public/styles/objects/_app.scss
View File

@ -8,7 +8,7 @@
* 1.0.0 - 2018/05/03 * 1.0.0 - 2018/05/03
*/ */
.o-app { .o-app {
display: inline-block;//Fixes collapsing margins on children. //display: inline-block;//Fixes collapsing margins on children.
min-height: 100vh; min-height: 100vh;
width: 100%; width: 100%;