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:
@@ -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);
|
||||
}
|
||||
|
||||
@@ -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++;
|
||||
|
||||
@@ -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{
|
||||
|
||||
@@ -57,7 +57,8 @@
|
||||
padding : 12px;
|
||||
border: 1px solid #bfbfbf;
|
||||
color : #333;
|
||||
|
||||
-webkit-column-break-inside : avoid;
|
||||
column-break-inside : avoid;
|
||||
}
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user