Add highlight js
This commit is contained in:
parent
c367d5b613
commit
fa21c85a13
@ -118,7 +118,11 @@ class NoteView(staticFileResolver: StaticFileResolver) : View(staticFileResolver
|
||||
}
|
||||
}
|
||||
|
||||
fun renderedNote(jwtPayload: JwtPayload, note: PersistedNote) = renderPage(note.meta.title, jwtPayload = jwtPayload) {
|
||||
fun renderedNote(jwtPayload: JwtPayload, note: PersistedNote) = renderPage(
|
||||
note.meta.title,
|
||||
jwtPayload = jwtPayload,
|
||||
scripts = listOf("/highlight.10.1.2.js","/init-highlight.0.0.1.js")
|
||||
) {
|
||||
div("container mx-auto p-4") {
|
||||
div("flex items-center justify-between mb-4") {
|
||||
h1("text-3xl fond-bold underline") { +note.meta.title }
|
||||
|
||||
@ -14,6 +14,7 @@ abstract class View(private val staticFileResolver: StaticFileResolver) {
|
||||
title: String,
|
||||
description: String? = null,
|
||||
jwtPayload: JwtPayload?,
|
||||
scripts: List<String> = emptyList(),
|
||||
body: MAIN.() -> Unit = {},
|
||||
) = buildString {
|
||||
appendLine("<!DOCTYPE html>")
|
||||
@ -26,6 +27,9 @@ abstract class View(private val staticFileResolver: StaticFileResolver) {
|
||||
description?.let { meta(name = "description", content = it) }
|
||||
link(rel = "stylesheet", href = styles)
|
||||
link(rel = "shortcut icon", href = "/favicon.ico", type = "image/x-icon")
|
||||
scripts.forEach { src ->
|
||||
script(src = src) {}
|
||||
}
|
||||
}
|
||||
body("bg-gray-900 text-white") {
|
||||
navbar(jwtPayload)
|
||||
|
||||
39
app/src/main/resources/static/highlight.10.1.2.js
Normal file
39
app/src/main/resources/static/highlight.10.1.2.js
Normal file
File diff suppressed because one or more lines are too long
5
app/src/main/resources/static/init-highlight.0.0.1.js
Normal file
5
app/src/main/resources/static/init-highlight.0.0.1.js
Normal file
@ -0,0 +1,5 @@
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
document.querySelectorAll('#note pre code').forEach((b) => {
|
||||
hljs.highlightBlock(b);
|
||||
});
|
||||
});
|
||||
51
css/src/hljs.pcss
Normal file
51
css/src/hljs.pcss
Normal file
@ -0,0 +1,51 @@
|
||||
.hljs {
|
||||
@apply block p-2;
|
||||
}
|
||||
|
||||
.hljs, .hljs-subst {
|
||||
@apply text-white;
|
||||
}
|
||||
|
||||
.hljs-comment {
|
||||
@apply text-gray-300;
|
||||
}
|
||||
|
||||
.hljs-attribute, .hljs-doctag, .hljs-keyword, .hljs-meta-keyword, .hljs-name, .hljs-selector-tag {
|
||||
@apply font-bold;
|
||||
}
|
||||
|
||||
.hljs-deletion, .hljs-number, .hljs-quote, .hljs-selector-class, .hljs-selector-id, .hljs-string, .hljs-template-tag, .hljs-type {
|
||||
@apply text-red-500;
|
||||
}
|
||||
|
||||
.hljs-section, .hljs-title {
|
||||
@apply font-bold text-red-500;
|
||||
}
|
||||
|
||||
.hljs-link, .hljs-regexp, .hljs-selector-attr, .hljs-selector-pseudo, .hljs-symbol, .hljs-template-variable, .hljs-variable {
|
||||
@apply text-red-300;
|
||||
}
|
||||
|
||||
.hljs-literal {
|
||||
@apply text-green-300;
|
||||
}
|
||||
|
||||
.hljs-addition, .hljs-built_in, .hljs-bullet, .hljs-code {
|
||||
@apply text-green-300;
|
||||
}
|
||||
|
||||
.hljs-meta {
|
||||
@apply text-blue-500;
|
||||
}
|
||||
|
||||
.hljs-meta-string {
|
||||
@apply text-blue-300;
|
||||
}
|
||||
|
||||
.hljs-emphasis {
|
||||
@apply italic;
|
||||
}
|
||||
|
||||
.hljs-strong {
|
||||
@apply font-bold;
|
||||
}
|
||||
@ -10,6 +10,7 @@
|
||||
@import "./other.pcss";
|
||||
@import "./navbar.pcss";
|
||||
@import "./note-table.pcss";
|
||||
@import "./hljs.pcss";
|
||||
|
||||
/*noinspection CssUnknownTarget*/
|
||||
@import "tailwindcss/utilities";
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user