83 lines
3.4 KiB
HTML
83 lines
3.4 KiB
HTML
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/monaco-editor@0.34.1/min/vs/editor/editor.main.css">
|
|
<script src="https://cdn.jsdelivr.net/npm/monaco-editor@0.34.1/min/vs/loader.js"></script>
|
|
|
|
|
|
<script>
|
|
|
|
require.config({ paths: { 'vs': 'https://cdn.jsdelivr.net/npm/monaco-editor@0.34.1/min/vs' } });
|
|
require(['vs/editor/editor.main'], function () {
|
|
|
|
monaco.editor.defineTheme('myCustomTheme', {
|
|
base: 'vs',
|
|
inherit: true,
|
|
rules: [
|
|
{ token: 'tag', foreground: '4CAF50', fontStyle: 'bold' }, // Màu cam cho thẻ HTML
|
|
{ token: 'attribute.name', foreground: 'e00000' }, // Màu xanh lá cho thuộc tính
|
|
{ token: 'attribute.value', foreground: 'e00000' }, // Màu vàng cho giá trị thuộc tính
|
|
{ token: 'string', foreground: 'e00000' }, // Màu xanh dương cho chuỗi
|
|
{ token: 'comment', foreground: '#4CAF50', fontStyle: 'italic' },
|
|
],
|
|
colors: {
|
|
'editor.foreground': '#000000',
|
|
'editorGutter.background': '#f6f6f6',
|
|
'editor.lineNumber.foreground': '#000000',
|
|
}
|
|
})
|
|
|
|
monaco.editor.create(document.getElementById('tpl_editor'), {
|
|
value: `<section class= "section-breakcrumb routing py-12 line-clamp" >
|
|
<div class="global-breadcrumb container">
|
|
<ol itemscope="" itemtype="http://schema.org/BreadcrumbList" class="list-style-none
|
|
d- flex">
|
|
<li class="routing-link" itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
|
|
<a href="/" itemprop="item" class="nopad-l">
|
|
<span itemprop="name">Trang chủ</span>
|
|
</a>
|
|
<meta itemprop="position" content="1">
|
|
</li>
|
|
|
|
<li class="routing-link" itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
|
|
<a href="{{ path.url }}" itemprop="item" class="nopad-l">
|
|
<span itemprop="name"> {{ path.name }} </span>
|
|
</a>
|
|
<meta itemprop="position" content="{{ counter }}" />
|
|
</li>
|
|
</ol>
|
|
|
|
|
|
<ol itemscope="" itemtype="http://schema.org/BreadcrumbList" class="list-style-none d-flex">
|
|
<li class="routing-link" itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
|
|
<a href="/" itemprop="item" class="nopad-l">
|
|
<span itemprop="name">Trang chủ</span>
|
|
</a>
|
|
<meta itemprop="position" content="1">
|
|
</li>
|
|
|
|
`,
|
|
language: 'html',
|
|
theme: 'myCustomTheme',
|
|
automaticLayout: true,
|
|
minimap: { enabled: false },
|
|
autoClosingBrackets: true,
|
|
autoClosingQuotes: true,
|
|
autoIndent: true,
|
|
wordWrap: 'on',
|
|
});
|
|
});
|
|
|
|
|
|
|
|
function open_template_list(id) {
|
|
var $template = $('#template_list_' + id)
|
|
if ($template.prop('open')) {
|
|
$('#template_list_' + id).prop('open', false);
|
|
} else {
|
|
$('#template_list_' + id).prop('open', true);
|
|
}
|
|
}
|
|
|
|
|
|
function show_older_version() {
|
|
$('#older_version').toggle()
|
|
}
|
|
</script> |