Skip to content

Commit

Permalink
[cw|#63] fix accidental code reformatting.
Browse files Browse the repository at this point in the history
  • Loading branch information
connorwalsh committed Mar 15, 2019
1 parent 7959e34 commit 3468678
Show file tree
Hide file tree
Showing 4 changed files with 209 additions and 49 deletions.
142 changes: 135 additions & 7 deletions client/src/components/poets/index.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
margin-bottom: 1em;
}


.poet-row {
display: flex;
flex-direction: column;
Expand Down Expand Up @@ -88,7 +89,9 @@
}

.poet-body {

display: flex;
flex-direction: column;
align-items: center;
}

.poet-body-menu {
Expand Down Expand Up @@ -119,20 +122,46 @@
padding-top: 2em;
}

.poet-body-code {
text-align: left;
}

.poet-overview {
display: flex;
flex-direction: column;
align-items: flex-start;
align-items: center;
color: #19ecff;
text-shadow: 2px 2px #ffb2e4;
font-size: 2.5em;
margin-top: 2em;
}

.poet-overview-stats-container {
display: flex;
position: relative;
width: 60%;
justify-content: space-between;
align-items: center;
border: 4px solid #ffa9d8;
box-shadow: 4px 4px #e396d3;
margin-bottom: 2em;
}

.poet-overview-stats-header-container {
display: flex;
align-items: center;
align-self: stretch;
background-color: #ffa9d8;
}

.poet-overview-stats-header {
writing-mode: vertical-rl;
transform: rotate(180deg);
white-space: nowrap;
font-weight: 400;
color: #49fffd;
font-size: 1em;
text-shadow: 4px 4px #fe87bc;
padding: 1em 0.3em 1em 0.3em;
}


.poet-overview-details {
text-align: left;
font-size: 0.7em;
Expand All @@ -158,15 +187,73 @@
text-shadow: 3px 3px #affbff;
}


.poet-overview-description-container {
display: flex;
position: relative;
width: 80%;
justify-content: space-between;
align-items: center;
border: 4px solid #ffa9d8;
box-shadow: 4px 4px #e396d3;
margin-bottom: 2em;
}

.poet-overview-description-header-container {
display: flex;
align-items: center;
align-self: stretch;
background-color: #ffa9d8;
}

.poet-overview-description-header {
writing-mode: vertical-rl;
transform: rotate(180deg);
white-space: nowrap;
font-weight: 400;
color: #49fffd;
font-size: 1em;
text-shadow: 4px 4px #fe87bc;
padding: 1em 0.3em 1em 0.3em;
}

.poet-overview-description {
margin-top: 1em;
width: 100%;
padding-bottom: 2em;
border-bottom: 1px dotted #19ecff;
text-align: justify;
word-break: break-all;
}

.poet-overview-sample-poem-container {
display: flex;
position: relative;
width: 80%;
justify-content: space-between;
align-items: center;
border: 4px solid #ffa9d8;
box-shadow: 4px 4px #e396d3;
}

.poet-overview-sample-poem-header-container {
display: flex;
align-items: center;
align-self: stretch;
background-color: #ffa9d8;
}

.poet-overview-sample-poem-header {
writing-mode: vertical-rl;
transform: rotate(180deg);
white-space: nowrap;
font-weight: 400;
color: #49fffd;
font-size: 1em;
text-shadow: 4px 4px #fe87bc;
padding: 1em 0.3em 1em 0.3em;
}


.poet-overview-generate-poem {
/* flex-grow: 1; */
display: flex;
Expand Down Expand Up @@ -195,6 +282,47 @@
color: #ffffff;
}

.poet-code-container {
display: flex;
flex-direction: column;
position: relative;
width: 80%;
justify-content: flex-start;
align-items: center;
border: 4px solid #ffa9d8;
box-shadow: 4px 4px #e396d3;
margin-bottom: 2em;
margin-top: 4em;
}

.poet-code-header-container {
display: flex;
justify-content: center;
align-items: center;
align-self: stretch;
background-color: #ffa9d8;
}

.poet-code-header {
white-space: nowrap;
font-weight: 400;
color: #49fffd;
font-size: 3em;
text-shadow: 4px 4px #fe87bc;
padding: 0.3em 0.3em 0.3em 0.3em;
}

.poet-body-code-container {
overflow-x: scroll;
width: 100%;
}

.poet-body-code {
text-align: left;
/* font-size: 1em; */
}


/* ----------- MOBILE MEDIA QUERIES ----------- */

@media screen and (max-width: 800px) {
Expand Down
102 changes: 65 additions & 37 deletions client/src/components/poets/poet.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -130,40 +130,64 @@ export class PoetOverview extends Component {

return (
<div className='poet-overview'>
<table className='poet-overview-details'>
<tr>
<td className='poet-overview-detail'>birthday </td>
<td className='poet-overview-detail-value'>
{formatDate(poet.birthDate)}
</td>
</tr>
<tr>
<td className='poet-overview-detail'>published works </td>
<td className='poet-overview-detail-value'>
{'-'}
</td>
</tr>
<tr>
<td className='poet-overview-detail'>volumes curated </td>
<td className='poet-overview-detail-value'>
{'-'}
</td>
</tr>
</table>

<span className='poet-overview-description'>
{poet.description}
</span>
<div style={{display: 'flex', justifyContent: 'center', width: '100%'}}>
<div className='poet-overview-generate-poem-button'
onClick={() => writePoem(poet.id)}
>
generate a poem
<div className='poet-overview-stats-container'>
<div className='poet-overview-stats-header-container'>
<div className='poet-overview-stats-header'>STATS</div>
</div>

<table className='poet-overview-stats-table'>
<tr>
<td className='poet-overview-detail'>born </td>
<td className='poet-overview-detail-value'>
{formatDate(poet.birthDate)}
</td>
</tr>
<tr>
<td className='poet-overview-detail'>retired </td>
<td className='poet-overview-detail-value'>
{formatDate(poet.deathDate)}
</td>
</tr>
<tr>
<td className='poet-overview-detail'>published works </td>
<td className='poet-overview-detail-value'>
{'-'}
</td>
</tr>
<tr>
<td className='poet-overview-detail'>volumes curated </td>
<td className='poet-overview-detail-value'>
{'-'}
</td>
</tr>
</table>
</div>

<div className='poet-overview-description-container'>
<div className='poet-overview-description-header-container'>
<div className='poet-overview-description-header'>description</div>
</div>
<span className='poet-overview-description'>
{poet.description}
</span>
</div>
{
isEmpty(generatedPoem) ? null : <Poem poem={generatedPoem}/>
}

<div className='poet-overview-sample-poem-container'>
<div className='poet-overview-sample-poem-header-container'>
<div className='poet-overview-sample-poem-header'>writing sample</div>
</div>
<div style={{display: 'flex', flexDirection: 'column', alignItems: 'center', width: '100%'}}>
<div className='poet-overview-generate-poem-button'
onClick={() => writePoem(poet.id)}
>
generate a poem
</div>
{
isEmpty(generatedPoem) ? null : <Poem poem={generatedPoem}/>
}
</div>
</div>

</div>
)
}
Expand All @@ -176,11 +200,15 @@ export class PoetCode extends Component {
} = this.props

return (
<div className='poet-code'>
<div className='poet-overview-header'>code</div>
<Highlight className="python poet-body-code">
{code.code}
</Highlight>
<div className='poet-code-container'>
<div className='poet-code-header-container'>
<div className='poet-code-header'>code</div>
</div>
<div className='poet-body-code-container'>
<Highlight className="python poet-body-code">
{code.code}
</Highlight>
</div>
</div>
)
}
Expand Down
10 changes: 5 additions & 5 deletions client/src/components/tutorial/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ export const Tutorial = props => {
const pageStyle = {
display: 'flex',
flexDirection: 'column',
width: '100%',
width: '60%',
margin: '2em 25% 5em 25%',
}
const headerStyle = {
Expand Down Expand Up @@ -150,8 +150,8 @@ is 3asy and fun!`}/>
</li>
<li style={{marginBottom: '0.7em'}}>
<span style={codeStyle}>--study POEM</span> read a given poem, POEM, and <em>optionally</em> use
it to modify how your program writes poetry. this task should not print any output to stdout. yet again, json
ouput <span style={{...codeStyle, fontSize:'0.6em', backgroundColor: '#ffffff'}}>{String.raw`{"success": <true|false>}`}</span>
it to modify how your program writes poetry. yet again, this should print json
ouput to stdout <span style={{...codeStyle, fontSize:'0.6em', backgroundColor: '#ffffff'}}>{String.raw`{"success": <true|false>}`}</span>
</li>
</ul>
</div>
Expand Down Expand Up @@ -227,7 +227,7 @@ def learn_how_to_write_better(a_poem):
<br/><br/>
this looks pretty good, but there is something missing. we need to be able to
call the right function when our python file is run with each command-line argument.
so when we use the <span style={codeStyle}>--write</span> command-line argument, we
e.g. when we use the <span style={codeStyle}>--write</span> command-line argument, we
must run our <span style={codeStyle}>write_poem()</span> function. and so on.
<br/><br/>
luckily there is a builtin python module called <span style={codeStyle}>argparse</span> for
Expand Down Expand Up @@ -294,7 +294,7 @@ elif args.critique:
critique_poem(args.critique)
elif args.study:
# awoo! the --study POEM arguments were given
study_poem(args.study)
learn_how_to_write_better(args.study)
`
}
</Highlight>
Expand Down
4 changes: 4 additions & 0 deletions client/src/types/date.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,9 @@

export const formatDate = dateString => {
if (dateString === '0001-01-01T00:00:00Z') {
return `-`
}

const date = new Date(dateString)

return `${date.getMonth()}.${date.getDate()}.${date.getFullYear()}`
Expand Down

0 comments on commit 3468678

Please sign in to comment.