1
0
mirror of https://github.com/stolksdorf/homebrewery.git synced 2026-01-02 05:09:15 +00:00

added an internal nested div on block elements

This commit is contained in:
Scott Tolksdorf
2017-02-26 20:18:44 -05:00
parent 0705e08381
commit 4c874149fb
4 changed files with 46 additions and 34 deletions

View File

@@ -105,7 +105,7 @@ const BrewEditor = React.createClass({
r.push(lineNumber);
}
if(line.indexOf('\\column') !== -1){
if(line.indexOf('\\column') === 0){
codeMirror.addLineClass(lineNumber, 'text', 'columnSplit');
r.push(lineNumber);
}

View File

@@ -13,11 +13,11 @@ renderer.paragraph = function(text){
if(text) r.push(Markdown(text, {renderer : renderer, sanitize: true}));
const block = matches[matchIndex];
if(block && block[0] == '{'){
r.push(`\n\n<div class="block ${block.substring(2).split(',').join(' ')}">`);
r.push(`\n\n<div class="block ${block.substring(2).split(',').join(' ')}"><div class="internal">`);
blockCount++;
}
if(block == '}}' && blockCount !== 0){
r.push('</div>\n\n');
r.push('</div></div>\n\n');
blockCount--;
}
matchIndex++;

View File

@@ -15,41 +15,48 @@
}
.note{
.useSansSerif();
margin-bottom : 1em;
padding : 5px 10px;
background-color : @green;
border-style : solid;
border-width : 11px;
border-image : @noteBorder 11;
border-image-outset : 9px 0px;
box-shadow : 1px 4px 14px #888;
h2,h3,h4{
.useSansSerif();
color : black;
}
p, ul{
font-size : 0.352cm;
line-height : 1.1em;
}
&.alt{
margin: 9px 0px;
.internal{
margin-bottom : 1em;
padding : 5px 10px;
background-color : @green;
border-style : solid;
border-width : 7px;
border-image : @descriptiveBorder 12 round;
border-image-outset : 4px;
border-width : 11px;
border-image : @noteBorder 11;
border-image-outset : 9px 0px;
box-shadow : 1px 4px 14px #888;
h2,h3,h4{
.useSansSerif();
color : black;
}
p, ul{
font-size : 0.352cm;
line-height : 1.1em;
}
&.alt{
border-style : solid;
border-width : 7px;
border-image : @descriptiveBorder 12 round;
border-image-outset : 4px;
}
}
}
.frame{
box-sizing : border-box;
margin-top : 30px;
margin-top : 26px;
margin-bottom : 37px;
background-color : white;
border : initial;
border-style : solid;
border-image-outset : 25px 17px;
border-image-repeat : round;
border-image-slice : 150 200 150 200;
border-image-source : @frameBorder;
border-image-width : 47px;
margin-left : 17px;
margin-right: 17px;
.internal{
box-sizing : border-box;
background-color : white;
border : initial;
border-style : solid;
border-image-outset : 25px 17px;
border-image-repeat : round;
border-image-slice : 150 200 150 200;
border-image-source : @frameBorder;
border-image-width : 47px;
}
}
.wide{
column-span : all;
@@ -59,15 +66,19 @@
.oneColumn{
column-count : 1;
column-gap : 1cm;
}
.twoColumn{
column-count : 2;
column-gap : 1cm;
}
.threeColumn{
column-count : 3;
column-gap : 1cm;
}
.fourColumn{
column-count : 4;
column-gap : 1cm;
}
.columnSplit{

View File

@@ -57,7 +57,8 @@
padding : 12px;
border: 1px solid #bfbfbf;
color : #333;
-webkit-column-break-inside : avoid;
column-break-inside : avoid;
}