mirror of
https://github.com/naturalcrit/homebrewery.git
synced 2026-01-20 03:12:44 +00:00
Adjust styling for unusual browser widths
This commit is contained in:
@@ -47,16 +47,26 @@ const MetadataNav = createClass({
|
|||||||
if(!this.state.showMetaWindow) return null;
|
if(!this.state.showMetaWindow) return null;
|
||||||
|
|
||||||
return <div className='dropdown'>
|
return <div className='dropdown'>
|
||||||
|
<div className='row'>
|
||||||
<h4>Description</h4>
|
<h4>Description</h4>
|
||||||
<p>{this.props.brew.description || 'No description.'}</p>
|
<p>{this.props.brew.description || 'No description.'}</p>
|
||||||
|
</div>
|
||||||
|
<div className='row'>
|
||||||
<h4>Authors</h4>
|
<h4>Authors</h4>
|
||||||
<p>{this.getAuthors()}</p>
|
<p>{this.getAuthors()}</p>
|
||||||
|
</div>
|
||||||
|
<div className='row'>
|
||||||
<h4>Tags</h4>
|
<h4>Tags</h4>
|
||||||
<p>{this.getTags()}</p>
|
<p>{this.getTags()}</p>
|
||||||
|
</div>
|
||||||
|
<div className='row'>
|
||||||
<h4>Systems</h4>
|
<h4>Systems</h4>
|
||||||
<p>{this.getSystems()}</p>
|
<p>{this.getSystems()}</p>
|
||||||
|
</div>
|
||||||
|
<div className='row'>
|
||||||
<h4>Last Updated</h4>
|
<h4>Last Updated</h4>
|
||||||
<p>{Moment(this.props.brew.updatedAt).fromNow()}</p>
|
<p>{Moment(this.props.brew.updatedAt).fromNow()}</p>
|
||||||
|
</div>
|
||||||
</div>;
|
</div>;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
@@ -187,6 +187,10 @@
|
|||||||
align-content: baseline;
|
align-content: baseline;
|
||||||
padding: 10px 10px 0px;
|
padding: 10px 10px 0px;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
|
.row{
|
||||||
|
display : flex;
|
||||||
|
flex-flow : row wrap;
|
||||||
|
width : 100%;
|
||||||
h4{
|
h4{
|
||||||
display : block;
|
display : block;
|
||||||
box-sizing : border-box;
|
box-sizing : border-box;
|
||||||
@@ -195,6 +199,7 @@
|
|||||||
text-align : center;
|
text-align : center;
|
||||||
border-top : 1px solid #888;
|
border-top : 1px solid #888;
|
||||||
flex-basis : 20%;
|
flex-basis : 20%;
|
||||||
|
flex-grow : 1;
|
||||||
}
|
}
|
||||||
p{
|
p{
|
||||||
font-family : 'Open Sans', sans-serif;
|
font-family : 'Open Sans', sans-serif;
|
||||||
@@ -203,10 +208,12 @@
|
|||||||
text-transform : initial;
|
text-transform : initial;
|
||||||
padding : 5px 0;
|
padding : 5px 0;
|
||||||
flex-basis : 80%;
|
flex-basis : 80%;
|
||||||
|
flex-grow : 1;
|
||||||
border-top : 1px solid #888;
|
border-top : 1px solid #888;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
.warning.navItem{
|
.warning.navItem{
|
||||||
position : relative;
|
position : relative;
|
||||||
background-color : @orange;
|
background-color : @orange;
|
||||||
|
|||||||
Reference in New Issue
Block a user