This repository has been archived by the owner on Nov 1, 2022. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
Main Page Begins #21
Open
haejinjo
wants to merge
12
commits into
master
Choose a base branch
from
main-page
base: master
Could not load branches
Branch not found: {{ refName }}
Loading
Could not load tags
Nothing to show
Loading
Are you sure you want to change the base?
Some commits from the old base branch may be removed from the timeline,
and old review comments may become outdated.
Open
Main Page Begins #21
Changes from all commits
Commits
Show all changes
12 commits
Select commit
Hold shift + click to select a range
c730594
Add main page
nathanmsmith b200400
Buttons prototype
prohaejin 56d145c
git town sync
prohaejin 2041887
update
prohaejin 7636958
three basic buttons (right) and an input bar (centered)
prohaejin b4baad3
all Div'd up with nowhere to go
prohaejin a41c444
First steps with css grid
prohaejin 26f7787
Mostly minor fixes /refactoring according to Nathan's code review
prohaejin 5d303cc
comments removed, semantic nav used
prohaejin ef55b3b
Merge branch 'master' into main-page
prohaejin 1755976
Fixed based on some code review suggestions
prohaejin 7ee77ca
material-ui now, still getting error with no exported member from Module
prohaejin File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
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
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
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 |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| import glamorous from 'glamorous'; | ||
|
|
||
| const CircleButton = glamorous.button({ | ||
| borderRadius: '50%', | ||
| backgroundColor: 'black', | ||
| width: '4vw', | ||
| height: '4vw', | ||
| padding: 3, | ||
| }); | ||
|
|
||
| export default CircleButton; |
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 |
|---|---|---|
| @@ -0,0 +1,30 @@ | ||
| *:focus { | ||
| outline: none !important; | ||
| } | ||
|
|
||
| #searchBar { | ||
| background-color: transparent; | ||
| height: 65px; | ||
| width: 100%; | ||
| font-size: 1.875rem; | ||
| font-weight: 300; | ||
| border-color: black; | ||
| border-width: 1px; | ||
| padding: 10px; | ||
| } | ||
|
|
||
| nav { | ||
| display: flex; | ||
| justify-content: flex-end; | ||
| font-size: 1.5em; | ||
| } | ||
|
|
||
| #titleText { | ||
| margin-right: auto; | ||
| } | ||
|
|
||
| .buttonGroup { | ||
| display: grid; | ||
| grid-template-columns: 4fr 4fr 4fr; | ||
| grid-column-gap: 0.5em; | ||
| } |
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,5 +1,46 @@ | ||
| import * as React from 'react'; | ||
| import glamorous from 'glamorous'; | ||
| import './Home.css'; | ||
| const { Div } = glamorous; | ||
| import PageCard from './PageCard'; | ||
| import CircleButton from './CircleButton'; | ||
| import Grid from 'material-ui/Grid'; | ||
|
|
||
| const Home = () => <h1>Home Page</h1>; | ||
| class Home extends React.Component { | ||
| render() { | ||
| return ( | ||
| <Div margin="5px auto" padding="20px" width="100%"> | ||
| <Grid container spacing={24}> | ||
| <Grid item> | ||
| <nav> | ||
| <h1 id="titleText"> panel.uclaradio.com: links </h1> | ||
| <Div className="buttonGroup"> | ||
| <CircleButton /> | ||
| <CircleButton /> | ||
| <CircleButton /> | ||
| </Div> | ||
| </nav> | ||
|
|
||
| <Div id="search" display="flex" justifyContent="center"> | ||
| <Div id="searchPadding" width={600} padding="30px"> | ||
| <input placeholder="Search" type="text" id="searchBar" /> | ||
| </Div> | ||
| </Div> | ||
| </Grid> | ||
|
|
||
| <Grid item sm={4}> | ||
| <PageCard /> | ||
| </Grid> | ||
| <Grid item sm={4}> | ||
| <PageCard /> | ||
| </Grid> | ||
| <Grid item sm={4}> | ||
| <PageCard /> | ||
| </Grid> | ||
| </Grid> | ||
| </Div> | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| export default Home; |
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 |
|---|---|---|
| @@ -0,0 +1,56 @@ | ||
| import * as React from 'react'; | ||
| import * as PropTypes from 'prop-types'; | ||
| import Card, { CardActions, CardContent, CardMedia } from 'material-ui/Card'; | ||
| import Button from 'material-ui/Button'; | ||
| import Typography from 'material-ui/Typography'; | ||
|
|
||
| // const PageCard = glamorous.div({ | ||
| // width: 380, | ||
| // height: 250, | ||
| // backgroundColor: 'rgba(255, 255, 255, 0.8)', | ||
| // maxWidth: 380, | ||
| // margin: '0 auto 30px', | ||
| // }); | ||
|
|
||
| const styles = { | ||
| card: { | ||
| maxWidth: 345, | ||
| }, | ||
|
|
||
| media: { | ||
| height: 0, | ||
| paddingTop: '56.25%', //16:9 | ||
| }, | ||
| }; | ||
|
|
||
| function PageCard(props: any) { | ||
| const { classes } = props; | ||
| return ( | ||
| <div> | ||
| <Card className={classes.card}> | ||
| <CardMedia className={classes.media} image="https://bzfd.it/2qMzcaE" /> | ||
| <CardContent> | ||
| <Typography gutterBottom variant="headline" component="h2"> | ||
| Tickets & Press Request Form | ||
| </Typography> | ||
|
|
||
| <Typography component="p"> | ||
| Want to go to a show for free? Fill this out. | ||
| </Typography> | ||
| </CardContent> | ||
|
|
||
| <CardActions> | ||
| <Button size="small" color="primary"> | ||
| I SAID GO!!! | ||
| </Button> | ||
| </CardActions> | ||
| </Card> | ||
| </div> | ||
| ); | ||
| } | ||
|
|
||
| PageCard.propTypes = { | ||
| classes: PropTypes.object.isRequired, | ||
| }; | ||
|
|
||
| export default PageCard; |
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 |
|---|---|---|
| @@ -0,0 +1,8 @@ | ||
| import ReactDOM from 'react-dom'; | ||
|
|
||
| import './index.css'; | ||
| import App from './App'; | ||
| import registerServiceWorker from './registerServiceWorker'; | ||
|
|
||
| ReactDOM.render(<App />, document.getElementById('root')); | ||
| registerServiceWorker(); |
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why are adding these attributes to the
htmlandbodytags?There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It's a fix I found online to prevent horizontal scrolling!