diff --git a/custom-stylesheet/info.json b/custom-stylesheet/info.json index d30cda5..f5f093a 100644 --- a/custom-stylesheet/info.json +++ b/custom-stylesheet/info.json @@ -1,5 +1,5 @@ { - "name": "Custom user interface styles", + "name": "Custom user interface styling", "identifier": "custom-stylesheet", "script": "custom-stylesheet.qml", "authors": ["@pbek"], diff --git a/preview-styling/info.json b/preview-styling/info.json new file mode 100644 index 0000000..416a3ac --- /dev/null +++ b/preview-styling/info.json @@ -0,0 +1,9 @@ +{ + "name": "Custom note preview styling", + "identifier": "preview-styling", + "script": "preview-styling.qml", + "authors": ["@pbek"], + "version": "0.0.1", + "minAppVersion": "17.05.7", + "description" : "With this script you can add custom stylesheets to the note preview. Please refer to the Supported HTML Subset documentation for a list of all supported css styles. " +} diff --git a/preview-styling/preview-styling.qml b/preview-styling/preview-styling.qml new file mode 100644 index 0000000..628a134 --- /dev/null +++ b/preview-styling/preview-styling.qml @@ -0,0 +1,36 @@ +import QtQml 2.0 + +/** + * This is an example for custom styling of html in the note preview + */ +QtObject { + property string customStylesheet; + + // register your settings variables so the user can set them in the script settings + property variant settingsVariables: [ + { + "identifier": "customStylesheet", + "name": "Custom stylesheet", + "description": "Please enter your custom stylesheet:", + "type": "text", + "default": "h2 {margin-left: 20px;}\nh3 {margin-left: 40px;}\nh4 {margin-left: 60px;}", + }, + ]; + + /** + * This function is called when the markdown html of a note is generated + * + * It allows you to modify this html + * This is for example called before by the note preview + * + * @param {NoteApi} note - the note object + * @param {string} html - the html that is about to being rendered + * @return {string} the modfied html or an empty string if nothing should be modified + */ + function noteToMarkdownHtmlHook(note, html) { + // see http://doc.qt.io/qt-5/richtext-html-subset.html for a list of + // supported css styles + html = html.replace("", customStylesheet + ""); + return html; + } +}