Infra-Mirrors/BookStack
1
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2024-10-01 01:36:00 -04:00
Code Issues Packages Projects Releases Wiki Activity

Added WYSIWYG editor callouts

Browse Source
This commit is contained in:
Dan Brown 2016-06-19 19:02:53 +01:00
parent d582e76fed
commit bcd9c2044e
3 changed files with 60 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
resources/assets/js/pages/page-form.js
View File

@ -1,7 +1,8 @@
var mceOptions = module.exports = { var mceOptions = module.exports = {
selector: '#html-editor', selector: '#html-editor',
content_css: [ content_css: [
'/css/styles.css' '/css/styles.css',
'/libs/material-design-iconic-font/css/material-design-iconic-font.min.css'
], ],
body_class: 'page-content', body_class: 'page-content',
relative_urls: false, relative_urls: false,
@ -19,11 +20,18 @@ var mceOptions = module.exports = {
{title: "Header 1", format: "h1"}, {title: "Header 1", format: "h1"},
{title: "Header 2", format: "h2"}, {title: "Header 2", format: "h2"},
{title: "Header 3", format: "h3"}, {title: "Header 3", format: "h3"},
{title: "Paragraph", format: "p"}, {title: "Paragraph", format: "p", exact: true, classes: ''},
{title: "Blockquote", format: "blockquote"}, {title: "Blockquote", format: "blockquote"},
{title: "Code Block", icon: "code", format: "pre"}, {title: "Code Block", icon: "code", format: "pre"},
{title: "Inline Code", icon: "code", inline: "code"} {title: "Inline Code", icon: "code", inline: "code"},
{title: "Callouts", items: [
{title: "Success", block: 'p', exact: true, attributes : {'class' : 'callout success'}},
{title: "Info", block: 'p', exact: true, attributes : {'class' : 'callout info'}},
{title: "Warning", block: 'p', exact: true, attributes : {'class' : 'callout warning'}},
{title: "Danger", block: 'p', exact: true, attributes : {'class' : 'callout danger'}}
]}
], ],
style_formats_merge: false,
formats: { formats: {
alignleft: {selector: 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', classes: 'align-left'}, alignleft: {selector: 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', classes: 'align-left'},
aligncenter: {selector: 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', classes: 'align-center'}, aligncenter: {selector: 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', classes: 'align-center'},

48
resources/assets/sass/_blocks.scss
View File

@ -125,3 +125,51 @@
margin-right: $-xl; margin-right: $-xl;
} }
} }
/**
* Callouts
*/
.callout {
border-left: 3px solid #BBB;
background-color: #EEE;
padding: $-s;
&:before {
font-family: 'Material-Design-Iconic-Font';
padding-right: $-s;
display: inline-block;
}
&.success {
border-left-color: $positive;
background-color: lighten($positive, 45%);
color: darken($positive, 16%);
}
&.success:before {
content: '\f269';
}
&.danger {
border-left-color: $negative;
background-color: lighten($negative, 34%);
color: darken($negative, 20%);
}
&.danger:before {
content: '\f1f2';
}
&.info {
border-left-color: $info;
background-color: lighten($info, 50%);
color: darken($info, 16%);
}
&.info:before {
content: '\f1f8';
}
&.warning {
border-left-color: $warning;
background-color: lighten($warning, 36%);
color: darken($warning, 16%);
}
&.warning:before {
content: '\f1f1';
}
}

1
resources/assets/sass/_variables.scss
View File

@ -38,6 +38,7 @@ $primary-dark: #0288D1;
$secondary: #e27b41; $secondary: #e27b41;
$positive: #52A256; $positive: #52A256;
$negative: #E84F4F; $negative: #E84F4F;
$info: $primary;
$warning: $secondary; $warning: $secondary;
$primary-faded: rgba(21, 101, 192, 0.15); $primary-faded: rgba(21, 101, 192, 0.15);