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

Added page specific styles, adjusted typography slightly

Browse Source
This commit is contained in:
Dominic Masters
2018-05-11 20:47:30 +10:00
parent 403ec39df3
commit abfc903c3f
5 changed files with 35 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
public/page/Page.jsx
View File

@ -30,8 +30,12 @@ export default class Page extends React.Component {
} }
render() { render() {
let clazzes = "c-page";
if(this.props.className) clazzes += " " + this.props.className;
return ( return (
<div className="c-page"> <div className={clazzes}>
{ this.props.children } { this.props.children }
</div> </div>
); );

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

@ -30,10 +30,10 @@ import { Title, Subtitle } from './../../typography/Typography';
export default function() { export default function() {
return ( return (
<Page style="home-page"> <Page style="home-page" className="p-home-page">
<VideoSection full> <VideoSection full mp4={require('./../../videos/about/programming/programming.mp4')} >
<PageBoundary> <PageBoundary>
<FloatingContentBox position="middle right" size="medium" className="u-text-center"> <FloatingContentBox position="middle right" size="medium" className="u-text-center p-home-page__video-content">
<Title>My Cool Page</Title> <Title>My Cool Page</Title>
<Subtitle>Lorem ipsum dolor</Subtitle> <Subtitle>Lorem ipsum dolor</Subtitle>
<Button>Hello</Button> <Button>Hello</Button>

3
public/styles/index.scss
View File

@ -68,6 +68,9 @@
@import './components/_section.scss'; @import './components/_section.scss';
@import './components/_video-section.scss'; @import './components/_video-section.scss';
//Pages
@import './pages/_home-page.scss';
//Utilities //Utilities
@import './utilities/text-align.scss'; @import './utilities/text-align.scss';

14
public/styles/objects/title.scss
View File

@ -5,15 +5,15 @@
* Version: * Version:
* 1.0.0 - 2018/05/11 * 1.0.0 - 2018/05/11
*/ */
.o-title { $o-title--size: 3em;
font-size: 3em; $o-subtitle--size: 1.25em;
margin-bottom: 0.25em;
+ .o-subtitle { .o-title {
margin-top: 0em; font-size: $o-title--size;
} margin: 0.25em 0;
} }
.o-subtitle { .o-subtitle {
font-size: 1.2em; font-size: $o-subtitle--size;
margin: 0 0 0.5em 0;
} }

17
public/styles/pages/_home-page.scss Normal file
View File

@ -0,0 +1,17 @@
/*
* Home Page
* Styles that are homepage specific.
*
* Dependencies:
*
*
* Version:
* 1.0.0 - 2018/05/11
*/
.p-home-page {
&__video-content {
background: white;
}
}