ExternalVendorCode/lollms-webui
1
0
Fork 0
mirror of https://github.com/ParisNeo/lollms-webui.git synced 2024-12-27 07:42:27 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

finally fixed codeblock issues

Browse Source
This commit is contained in:
AndzejsP 2023-06-09 12:40:47 +03:00
parent d767de86a2
commit 3fb9bb9a98
2 changed files with 16 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
web/src/components/MarkdownRenderer.vue
View File

@ -1,5 +1,5 @@
<template>
<div class=" break-all w-full">
<div class=" break-all ">
<div v-html="renderedMarkdown" class=""></div>
</div>
</template>
@ -32,36 +32,30 @@ const markdownIt = new MarkdownIt('commonmark', {
return (
'<div class="hljs language-html break-all whitespace-pre p-2 rounded-lg shadow-sm ">' +
'<div class="bg-bg-light-tone-panel dark:bg-bg-dark-tone-panel p-2 rounded-lg shadow-sm ">' +
languageCapital +
'<pre class="break-all whitespace-pre p-1 overflow-x-auto scrollbar-thin scrollbar-track-bg-light-tone scrollbar-thumb-bg-light-tone-panel hover:scrollbar-thumb-primary dark:scrollbar-track-bg-dark-tone dark:scrollbar-thumb-bg-dark-tone-panel dark:hover:scrollbar-thumb-primary active:scrollbar-thumb-secondary ">' +
'<pre class=" hljs p-1 rounded-md break-all grid grid-cols-1 ">' +
'<code>' +
'<code class="overflow-x-auto break-all scrollbar-thin scrollbar-track-bg-light-tone scrollbar-thumb-bg-light-tone-panel hover:scrollbar-thumb-primary dark:scrollbar-track-bg-dark-tone dark:scrollbar-thumb-bg-dark-tone-panel dark:hover:scrollbar-thumb-primary active:scrollbar-thumb-secondary ">' +
hljs.highlightAuto(str).value +
'</code></pre>' + '</div>'
);
} catch (__) { }
}
// return (
// '<pre class="hljs p-4 overflow-x-auto rounded-lg shadow-sm scrollbar-thin scrollbar-track-bg-light-tone scrollbar-thumb-bg-light-tone-panel hover:scrollbar-thumb-primary dark:scrollbar-track-bg-dark-tone dark:scrollbar-thumb-bg-dark-tone-panel dark:hover:scrollbar-thumb-primary active:scrollbar-thumb-secondary">' +
// '<code>' +
// markdownIt.utils.escapeHtml(str) +
// '</code></pre>'
// );
return (
'<div class="hljs language-html break-all whitespace-pre p-2 rounded-lg shadow-sm ">' +
'<div class="bg-bg-light-tone-panel dark:bg-bg-dark-tone-panel p-2 rounded-lg shadow-sm ">' +
languageCapital +
'<pre class="break-all whitespace-pre p-1 overflow-x-auto scrollbar-thin scrollbar-track-bg-light-tone scrollbar-thumb-bg-light-tone-panel hover:scrollbar-thumb-primary dark:scrollbar-track-bg-dark-tone dark:scrollbar-thumb-bg-dark-tone-panel dark:hover:scrollbar-thumb-primary active:scrollbar-thumb-secondary ">' +
'<pre class=" hljs p-1 rounded-md break-all grid grid-cols-1 ">' +
'<code>' +
'<code class="overflow-x-auto break-all scrollbar-thin scrollbar-track-bg-light-tone scrollbar-thumb-bg-light-tone-panel hover:scrollbar-thumb-primary dark:scrollbar-track-bg-dark-tone dark:scrollbar-thumb-bg-dark-tone-panel dark:hover:scrollbar-thumb-primary active:scrollbar-thumb-secondary ">' +
markdownIt.utils.escapeHtml(str) +
'</code></pre>' + '</div>'
);
}
}).use(emoji);
@ -116,4 +110,4 @@ export default {
};
</script>
<style></style>
<style type='text/css'></style>

10
web/src/components/Message.vue
View File

@ -1,14 +1,14 @@
<template>
<div
class="group rounded-lg m-2 shadow-lg hover:border-primary dark:hover:border-primary hover:border-solid hover:border-2 border-2 border-transparent even:bg-bg-light-discussion-odd dark:even:bg-bg-dark-discussion-odd flex-row p-4 pb-2">
<div class="flex flex-row flex-grow gap-2">
class="group rounded-lg m-2 shadow-lg hover:border-primary dark:hover:border-primary hover:border-solid hover:border-2 border-2 border-transparent even:bg-bg-light-discussion-odd dark:even:bg-bg-dark-discussion-odd flex flex-col flex-grow flex-wrap overflow-x-hidden p-4 pb-2">
<div class="flex flex-row gap-2 ">
<div class="flex-shrink-0 ">
<!-- AVATAR -->
<img :src="getImgUrl()" @error="defaultImg($event)" class="w-10 h-10 rounded-full object-fill text-red-700">
</div>
<div class="flex flex-col flex-grow ">
<div class="flex flex-col w-full flex-grow-0 ">
<div class="flex flex-row flex-grow items-start ">
<!-- SENDER NAME -->
<div class="flex ">
@ -19,7 +19,7 @@
</div>
<!-- MESSAGE CONTROLS -->
<div class="flex-row justify-end">
<div class="flex-row justify-end mx-2">
<div class="invisible group-hover:visible flex flex-row ">
<!-- MESSAGE CONTROLS -->
<!-- EDIT CONFIRMATION -->
@ -81,7 +81,7 @@
</div>
</div>
<div >
<div class="overflow-x-auto w-full " >
<!-- MESSAGE CONTENT -->
<MarkdownRenderer ref="mdRender" v-if="!editMsgMode" :markdown-text="message.content" >
</MarkdownRenderer>