mirror of
https://github.com/naturalcrit/homebrewery.git
synced 2026-01-09 22:22:41 +00:00
Finished the monster stat block, using hr's as element modifiers, kinda weird.
This commit is contained in:
@@ -12,8 +12,8 @@ var Phb = React.createClass({
|
||||
},
|
||||
|
||||
renderPages : function(){
|
||||
return _.map(this.props.text.split('\page'), (pageText, index) => {
|
||||
return <div className='phb' dangerouslySetInnerHTML={{__html:Markdown(this.props.text)}} key={index} />
|
||||
return _.map(this.props.text.split('\\page'), (pageText, index) => {
|
||||
return <div className='phb' dangerouslySetInnerHTML={{__html:Markdown(pageText)}} key={index} />
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
@@ -25,10 +25,12 @@
|
||||
font-family : ScalaSans;
|
||||
src : url('/assets/naturalCrit/homebrew/assets/Scaly Sans.otf');
|
||||
}
|
||||
/*
|
||||
@font-face {
|
||||
font-family : ScalaSansBold;
|
||||
src : url('/assets/naturalCrit/homebrew/assets/Scala Sans Bold.ttf');
|
||||
}
|
||||
*/
|
||||
@font-face {
|
||||
font-family : ScalaSansSmallCaps;
|
||||
src : url('/assets/naturalCrit/homebrew/assets/Scala Sans SmallCaps.ttf');
|
||||
@@ -54,21 +56,26 @@
|
||||
padding : 1.0cm 1.7cm;
|
||||
column-count : 2;
|
||||
column-fill : auto;
|
||||
column-gap : 1cm;
|
||||
column-width : 8cm;
|
||||
background-image : url('/assets/naturalCrit/homebrew/assets/PHB-background.png');
|
||||
-webkit-column-count : 2;
|
||||
-moz-column-count : 2;
|
||||
-webkit-column-width : 8cm;
|
||||
-moz-column-width : 8cm;
|
||||
column-gap : 1cm;
|
||||
-webkit-column-gap : 1cm;
|
||||
-webkit-column-gap : 1cm;
|
||||
text-rendering : optimizeLegibility;
|
||||
p,ul{
|
||||
|
||||
|
||||
p,ul,blockquote{
|
||||
-webkit-column-break-inside : avoid;
|
||||
-moz-column-break-inside : avoid;
|
||||
-o-column-break-inside : avoid;
|
||||
-ms-column-break-inside : avoid;
|
||||
column-break-inside : avoid;
|
||||
}
|
||||
|
||||
p,ul{
|
||||
strong{
|
||||
font-family : BookInsanityBold;
|
||||
em{
|
||||
@@ -97,6 +104,12 @@
|
||||
list-style-position : inside;
|
||||
list-style-type : disc;
|
||||
}
|
||||
|
||||
|
||||
hr+table{
|
||||
-webkit-column-span : all;
|
||||
column-span : all;
|
||||
}
|
||||
table{
|
||||
width : 100%;
|
||||
margin-bottom : 1em;
|
||||
@@ -117,38 +130,152 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
blockquote{
|
||||
background-color : @green;
|
||||
font-family : ScalaSans;
|
||||
box-sizing: border-box;
|
||||
padding : 5px 10px;
|
||||
border-top : 2px black solid;
|
||||
border-bottom : 2px black solid;
|
||||
box-shadow: 1px 4px 14px #888;
|
||||
margin-bottom: 1em;
|
||||
p{
|
||||
font-family : ScalaSans;
|
||||
font-size: 10pt;
|
||||
line-height: 1.1em;
|
||||
em{
|
||||
font-family : ScalaSans;
|
||||
font-style: italic;
|
||||
hr{
|
||||
visibility: hidden;
|
||||
//border : none;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
//Fancy List of things
|
||||
hr+ul{
|
||||
list-style-type: none;
|
||||
text-indent: -1em;
|
||||
padding-left: 1em;
|
||||
|
||||
//margin-top: -0.5em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
//Column Break
|
||||
pre{
|
||||
visibility: hidden;
|
||||
-webkit-column-break-after: always;
|
||||
}
|
||||
|
||||
//Monster Stat block
|
||||
hr+blockquote{
|
||||
position : relative;
|
||||
background-color: #FDF1DC;
|
||||
border : none;
|
||||
|
||||
h2{
|
||||
margin-bottom: 0px;
|
||||
&+p{
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
}
|
||||
h3{
|
||||
font-family: ScalaSans;
|
||||
font-weight: 400;
|
||||
border-bottom: 1px solid @header;
|
||||
}
|
||||
|
||||
ul{
|
||||
list-style-type: none;
|
||||
font-family: ScalaSans;
|
||||
color : @header;
|
||||
font-size: 10pt;
|
||||
text-indent: -1em;
|
||||
padding-left: 1em;
|
||||
strong{
|
||||
font-family: ScalaSans;
|
||||
font-weight: 800;
|
||||
em{
|
||||
font-weight: 800;
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
hr+table{
|
||||
-webkit-column-span : 1;
|
||||
column-span : 1;
|
||||
}
|
||||
table{
|
||||
color : @header;
|
||||
}
|
||||
|
||||
p+p{
|
||||
margin-top : 0em;
|
||||
text-indent : 0em;
|
||||
padding-bottom: 0.5em;
|
||||
}
|
||||
|
||||
|
||||
|
||||
//Maybe move this to be built in
|
||||
hr{
|
||||
visibility: visible;
|
||||
margin: 8px 0px;
|
||||
|
||||
border-color : transparent;
|
||||
position: relative;
|
||||
@height : 3px;
|
||||
&:after, &:before{
|
||||
content : "";
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: @height;
|
||||
left: 0px;
|
||||
}
|
||||
&:before{
|
||||
top : -@height;
|
||||
background: linear-gradient(to right top, @horizontalRule 40%, transparent 50%)
|
||||
}
|
||||
&:after{
|
||||
top: 0px;
|
||||
background: linear-gradient(to right bottom, @horizontalRule 40%, transparent 50%)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
//Borders
|
||||
&:after, &:before{
|
||||
content : "";
|
||||
position: absolute;
|
||||
background-color : #E69A28;
|
||||
border: 1px solid black;
|
||||
height : 4px;
|
||||
width : 100%;
|
||||
padding : 0px 3px;
|
||||
}
|
||||
&:before{
|
||||
top : 0px;
|
||||
left : -3px;
|
||||
}
|
||||
&:after{
|
||||
bottom : 0px;
|
||||
left : -3px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//Note
|
||||
blockquote{
|
||||
box-sizing : border-box;
|
||||
margin-bottom : 1em;
|
||||
padding : 5px 10px;
|
||||
background-color : @green;
|
||||
font-family : ScalaSans;
|
||||
border-top : 2px black solid;
|
||||
border-bottom : 2px black solid;
|
||||
box-shadow : 1px 4px 14px #888;
|
||||
p{
|
||||
font-family : ScalaSans;
|
||||
font-size : 10pt;
|
||||
line-height : 1.1em;
|
||||
em{
|
||||
font-family : ScalaSans;
|
||||
font-style : italic;
|
||||
}
|
||||
strong{
|
||||
font-weight : 800;
|
||||
font-family : ScalaSans;
|
||||
em{
|
||||
font-style : italic;
|
||||
font-weight : 800;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
pre{
|
||||
|
||||
}
|
||||
|
||||
h1,h2,h3,h4{
|
||||
margin-top : 0.2em;
|
||||
margin-bottom : 0.2em;
|
||||
@@ -166,7 +293,7 @@
|
||||
margin-top : 20px;
|
||||
margin-bottom : 10px;
|
||||
font-family : Solbera;
|
||||
font-size : 5em;
|
||||
font-size : 4.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -178,8 +305,8 @@
|
||||
border-bottom : 2px solid @headerUnderline;
|
||||
}
|
||||
h4{
|
||||
font-size : 12pt;
|
||||
margin-bottom: 0.00em;
|
||||
margin-bottom : 0.00em;
|
||||
font-size : 12pt;
|
||||
}
|
||||
h5{
|
||||
margin-bottom : 0.2em;
|
||||
|
||||
Reference in New Issue
Block a user