Skip to content

Commit

Permalink
Added new widget: Code Highglihter.
Browse files Browse the repository at this point in the history
  • Loading branch information
petersirka committed May 21, 2024
1 parent 1e7752b commit 36d808f
Showing 1 changed file with 49 additions and 0 deletions.
49 changes: 49 additions & 0 deletions widgets/codehighlighter.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
<script total>
exports.id = 'codehighlighter';
exports.name = 'Code highlighter';
exports.author = 'Total.js';
exports.version = '1';
exports.preview = 'data:image/gif;base64,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';
exports.config = {};
exports.dependencies = ['https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/default.min.css', 'https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js'];

exports.render = function(opt, next) {

var ready = '';

if (!opt.codehighlighter) {
opt.codehighlighter = true;
ready = '<scr' + 'ipt>$(document).ready(function(){hljs.highlightAll()});</scr' + 'ipt>';
}

next(opt.html.replace(/<br(\s\/)?>/g, '\n') + ready, false, true);
};

</script>

<style>
.CLASS pre, .CLASS .hljs { background-color: rgba(0,0,0,0.05); margin: 0; padding: 10px; border-radius: var(--radius); text-align: left; }
.CLASS .hljs { background-color: transparent; }
.CLASS pre code { display: inline-block; margin: 0; padding: 0; position: relative; width: 100%; }
</style>

<settings>

<div class="padding">
<ui-component name="input" path="?.language" config="placeholder:auto"></ui-component>
<div class="help">Example: <code>js</code>, <code>html</code> or <code>auto</code></div>
</div>

<script>
exports.save = function(config, el) {
var pre = el.find('pre').rclass2('language-');
if (config.language && config.language !== 'auto')
pre.aclass('language-' + config.language);
};
</script>

</settings>

<body>
<pre><code class="CMS_edit CMS_multiline">Code highlighting</code></pre>
</body>

0 comments on commit 36d808f

Please sign in to comment.