0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-04 14:42:40 +00:00

Fix /page not working in legacy mode. (#1233)

* Fix brew styles overwriting each other.

* Word wrapping, start fixing spacing on Title letter

* Fix \page in legacy brews when not at line start
This commit is contained in:
Trevor Buckner
2021-02-08 13:58:24 -05:00
committed by GitHub
parent c642a35fb3
commit e5ccfa3a50
4 changed files with 53 additions and 27 deletions

View File

@@ -20,15 +20,17 @@ const BrewRenderer = createClass({
getDefaultProps : function() { getDefaultProps : function() {
return { return {
text : '', text : '',
renderer : '', renderer : 'legacy',
errors : [] errors : []
}; };
}, },
getInitialState : function() { getInitialState : function() {
const pages = this.props.text.split(/^\\page/gm); let pages;
let renderer = 'legacy'; if(this.props.renderer == 'legacy') {
if(this.props.renderer) pages = this.props.text.split('\\page');
renderer = this.props.renderer; } else {
pages = this.props.text.split(/^\\page/gm);
}
return { return {
viewablePageNumber : 0, viewablePageNumber : 0,
@@ -38,7 +40,6 @@ const BrewRenderer = createClass({
pages : pages, pages : pages,
usePPR : pages.length >= PPR_THRESHOLD, usePPR : pages.length >= PPR_THRESHOLD,
visibility : 'hidden', visibility : 'hidden',
renderer : renderer,
initialContent : `<!DOCTYPE html><html><head> initialContent : `<!DOCTYPE html><html><head>
<link href="//use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet" /> <link href="//use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet" />
<link href="//fonts.googleapis.com/css?family=Open+Sans:400,300,600,700" rel="stylesheet" type="text/css" /> <link href="//fonts.googleapis.com/css?family=Open+Sans:400,300,600,700" rel="stylesheet" type="text/css" />
@@ -54,12 +55,19 @@ const BrewRenderer = createClass({
window.removeEventListener('resize', this.updateSize); window.removeEventListener('resize', this.updateSize);
}, },
componentWillReceiveProps : function(nextProps) { componentDidUpdate : function(prevProps) {
const pages = nextProps.text.split(/^\\page/gm); if(prevProps.text !== this.props.text) {
this.setState({ let pages;
pages : pages, if(this.props.renderer == 'legacy') {
usePPR : pages.length >= PPR_THRESHOLD pages = this.props.text.split('\\page');
}); } else {
pages = this.props.text.split(/^\\page/gm);
}
this.setState({
pages : pages,
usePPR : pages.length >= PPR_THRESHOLD
});
}
}, },
updateSize : function() { updateSize : function() {
@@ -114,7 +122,7 @@ const BrewRenderer = createClass({
}, },
renderPage : function(pageText, index){ renderPage : function(pageText, index){
if(this.state.renderer == 'legacy') if(this.props.renderer == 'legacy')
return <div className='phb' id={`p${index + 1}`} dangerouslySetInnerHTML={{ __html: MarkdownLegacy.render(pageText) }} key={index} />; return <div className='phb' id={`p${index + 1}`} dangerouslySetInnerHTML={{ __html: MarkdownLegacy.render(pageText) }} key={index} />;
else else
return <div className='phb3' id={`p${index + 1}`} dangerouslySetInnerHTML={{ __html: Markdown.render(pageText) }} key={index} />; return <div className='phb3' id={`p${index + 1}`} dangerouslySetInnerHTML={{ __html: Markdown.render(pageText) }} key={index} />;

View File

@@ -24,7 +24,7 @@ const Editor = createClass({
metadata : {}, metadata : {},
onMetadataChange : ()=>{}, onMetadataChange : ()=>{},
showMetaButton : true, showMetaButton : true,
renderer : '' renderer : 'legacy'
}; };
}, },
getInitialState : function() { getInitialState : function() {
@@ -93,13 +93,21 @@ const Editor = createClass({
codeMirror.removeLineClass(lineNumber, 'background'); codeMirror.removeLineClass(lineNumber, 'background');
codeMirror.removeLineClass(lineNumber, 'text'); codeMirror.removeLineClass(lineNumber, 'text');
if(line.startsWith('\\page')){ // Legacy Codemirror styling
codeMirror.addLineClass(lineNumber, 'background', 'pageLine'); if(this.props.renderer == 'legacy') {
r.push(lineNumber); if(line.includes('\\page')){
codeMirror.addLineClass(lineNumber, 'background', 'pageLine');
r.push(lineNumber);
}
} }
// New Codemirror styling for V3 renderer // New Codemirror styling for V3 renderer
if(this.props.renderer == 'V3') { if(this.props.renderer == 'V3') {
if(line.startsWith('\\page')){
codeMirror.addLineClass(lineNumber, 'background', 'pageLine');
r.push(lineNumber);
}
if(line.startsWith('\\column')){ if(line.startsWith('\\column')){
codeMirror.addLineClass(lineNumber, 'text', 'columnSplit'); codeMirror.addLineClass(lineNumber, 'text', 'columnSplit');
r.push(lineNumber); r.push(lineNumber);

View File

@@ -1,6 +1,6 @@
@import (less) './client/homebrew/phbStyle/phb.fonts.css'; @import (less) './client/homebrew/phbStyle/phb.fonts.css';
@import (less) './client/homebrew/phbStyle/phb.assets.less'; @import (less) './client/homebrew/phbStyle/phb.assets.less';
@import (less) './client/homebrew/phbStyle/phb.depricated.less';
//Colors //Colors
@background : #EEE5CE; @background : #EEE5CE;
@noteGreen : #e0e5c1; @noteGreen : #e0e5c1;
@@ -17,12 +17,11 @@ body {
} }
.useSansSerif(){ .useSansSerif(){
font-family : ScalySans; font-family : ScalySans;
font-size : 10pt;
em{ em{
font-family : ScalySans;
font-style : italic; font-style : italic;
} }
strong{ strong{
font-family : ScalySans;
font-weight : 800; font-weight : 800;
letter-spacing : -0.02em; letter-spacing : -0.02em;
} }
@@ -48,8 +47,7 @@ body {
overflow : hidden; overflow : hidden;
height : 279.4mm; height : 279.4mm;
width : 215.9mm; width : 215.9mm;
padding : 1.0cm 1.7cm; padding : 1.0cm 1.7cm, 1.5cm;
padding-bottom : 1.5cm;
background-color : @background; background-color : @background;
background-image : @backgroundImage; background-image : @backgroundImage;
font-family : BookSanity; font-family : BookSanity;
@@ -61,6 +59,7 @@ body {
// * BASE // * BASE
// *****************************/ // *****************************/
p{ p{
overflow-wrap : break-word;
padding-bottom : 0.8em; padding-bottom : 0.8em;
line-height : 1.3em; line-height : 1.3em;
&+p{ &+p{
@@ -123,9 +122,20 @@ body {
&+p::first-letter{ &+p::first-letter{
float : left; float : left;
font-family : Solberry; font-family : Solberry;
font-size : 10em;
color : #222;
line-height : 0.8em; line-height : 0.8em;
font-size: 3.1cm;
padding-top: 4px;
padding-bottom: 4px;
margin-top: -6px;
margin-left: -6px;
background-image: linear-gradient(-45deg, #322814, #998250, #322814);
background-clip: text;
-webkit-background-clip: text;
color: rgba(0, 0, 0, 0);
}
&+p::first-line{
font-size : .385cm;
font-variant : small-caps;
} }
} }
h2{ h2{

View File

@@ -61,9 +61,9 @@ const CodeEditor = createClass({
} }
}, },
componentWillReceiveProps : function(nextProps){ componentDidUpdate : function(prevProps) {
if(this.codeMirror && nextProps.value !== undefined && this.codeMirror.getValue() != nextProps.value) { if(this.codeMirror && this.props.value !== undefined && this.codeMirror.getValue() != this.props.value) {
this.codeMirror.setValue(nextProps.value); this.codeMirror.setValue(this.props.value);
} }
}, },