mirror of
https://github.com/oobabooga/text-generation-webui.git
synced 2024-11-29 19:09:32 +01:00
Merge pull request #266 from HideLord/main
Adding markdown support and slight refactoring.
This commit is contained in:
oobabooga
GitHub
commit
4146ac4ff1
22
css/chat.css
Normal file
22
css/chat.css
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
.h-\[40vh\], .wrap.svelte-byatnx.svelte-byatnx.svelte-byatnx {
|
||||||
|
height: 66.67vh
|
||||||
|
}
|
||||||
|
.gradio-container {
|
||||||
|
max-width: 800px !important;
|
||||||
|
margin-left: auto !important;
|
||||||
|
margin-right: auto !important;
|
||||||
|
}
|
||||||
|
.w-screen {
|
||||||
|
width: unset
|
||||||
|
}
|
||||||
|
div.svelte-362y77>*, div.svelte-362y77>.form>* {
|
||||||
|
flex-wrap: nowrap
|
||||||
|
}
|
||||||
|
/* fixes the API documentation in chat mode */
|
||||||
|
.api-docs.svelte-1iguv9h.svelte-1iguv9h.svelte-1iguv9h {
|
||||||
|
display: grid;
|
||||||
|
}
|
||||||
|
.pending.svelte-1ed2p3z {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
103
css/html_4chan_style.css
Normal file
103
css/html_4chan_style.css
Normal file
@ -0,0 +1,103 @@
|
|||||||
|
#parent #container {
|
||||||
|
background-color: #eef2ff;
|
||||||
|
padding: 17px;
|
||||||
|
}
|
||||||
|
#parent #container .reply {
|
||||||
|
background-color: rgb(214, 218, 240);
|
||||||
|
border-bottom-color: rgb(183, 197, 217);
|
||||||
|
border-bottom-style: solid;
|
||||||
|
border-bottom-width: 1px;
|
||||||
|
border-image-outset: 0;
|
||||||
|
border-image-repeat: stretch;
|
||||||
|
border-image-slice: 100%;
|
||||||
|
border-image-source: none;
|
||||||
|
border-image-width: 1;
|
||||||
|
border-left-color: rgb(0, 0, 0);
|
||||||
|
border-left-style: none;
|
||||||
|
border-left-width: 0px;
|
||||||
|
border-right-color: rgb(183, 197, 217);
|
||||||
|
border-right-style: solid;
|
||||||
|
border-right-width: 1px;
|
||||||
|
border-top-color: rgb(0, 0, 0);
|
||||||
|
border-top-style: none;
|
||||||
|
border-top-width: 0px;
|
||||||
|
color: rgb(0, 0, 0);
|
||||||
|
display: table;
|
||||||
|
font-family: arial, helvetica, sans-serif;
|
||||||
|
font-size: 13.3333px;
|
||||||
|
margin-bottom: 4px;
|
||||||
|
margin-left: 0px;
|
||||||
|
margin-right: 0px;
|
||||||
|
margin-top: 4px;
|
||||||
|
overflow-x: hidden;
|
||||||
|
overflow-y: hidden;
|
||||||
|
padding-bottom: 4px;
|
||||||
|
padding-left: 2px;
|
||||||
|
padding-right: 2px;
|
||||||
|
padding-top: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#parent #container .number {
|
||||||
|
color: rgb(0, 0, 0);
|
||||||
|
font-family: arial, helvetica, sans-serif;
|
||||||
|
font-size: 13.3333px;
|
||||||
|
width: 342.65px;
|
||||||
|
margin-right: 7px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#parent #container .op {
|
||||||
|
color: rgb(0, 0, 0);
|
||||||
|
font-family: arial, helvetica, sans-serif;
|
||||||
|
font-size: 13.3333px;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
margin-left: 0px;
|
||||||
|
margin-right: 0px;
|
||||||
|
margin-top: 4px;
|
||||||
|
overflow-x: hidden;
|
||||||
|
overflow-y: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
#parent #container .op blockquote {
|
||||||
|
margin-left: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#parent #container .name {
|
||||||
|
color: rgb(17, 119, 67);
|
||||||
|
font-family: arial, helvetica, sans-serif;
|
||||||
|
font-size: 13.3333px;
|
||||||
|
font-weight: 700;
|
||||||
|
margin-left: 7px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#parent #container .quote {
|
||||||
|
color: rgb(221, 0, 0);
|
||||||
|
font-family: arial, helvetica, sans-serif;
|
||||||
|
font-size: 13.3333px;
|
||||||
|
text-decoration-color: rgb(221, 0, 0);
|
||||||
|
text-decoration-line: underline;
|
||||||
|
text-decoration-style: solid;
|
||||||
|
text-decoration-thickness: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
#parent #container .greentext {
|
||||||
|
color: rgb(120, 153, 34);
|
||||||
|
font-family: arial, helvetica, sans-serif;
|
||||||
|
font-size: 13.3333px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#parent #container blockquote {
|
||||||
|
margin: 0px !important;
|
||||||
|
margin-block-start: 1em;
|
||||||
|
margin-block-end: 1em;
|
||||||
|
margin-inline-start: 40px;
|
||||||
|
margin-inline-end: 40px;
|
||||||
|
margin-top: 13.33px !important;
|
||||||
|
margin-bottom: 13.33px !important;
|
||||||
|
margin-left: 40px !important;
|
||||||
|
margin-right: 40px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#parent #container .message {
|
||||||
|
color: black;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
73
css/html_chat_style.css
Normal file
73
css/html_chat_style.css
Normal file
@ -0,0 +1,73 @@
|
|||||||
|
.chat {
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
max-width: 800px;
|
||||||
|
height: 66.67vh;
|
||||||
|
overflow-y: auto;
|
||||||
|
padding-right: 20px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column-reverse;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 60px 1fr;
|
||||||
|
padding-bottom: 25px;
|
||||||
|
font-size: 15px;
|
||||||
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
|
line-height: 1.428571429;
|
||||||
|
}
|
||||||
|
|
||||||
|
.circle-you {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
background-color: rgb(238, 78, 59);
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.circle-bot {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
background-color: rgb(59, 78, 244);
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.circle-bot img,
|
||||||
|
.circle-you img {
|
||||||
|
border-radius: 50%;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text {}
|
||||||
|
|
||||||
|
.text p {
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.username {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message-body {}
|
||||||
|
|
||||||
|
.message-body img {
|
||||||
|
max-width: 300px;
|
||||||
|
max-height: 300px;
|
||||||
|
border-radius: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message-body p {
|
||||||
|
margin-bottom: 0 !important;
|
||||||
|
font-size: 15px !important;
|
||||||
|
line-height: 1.428571429 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark .message-body p em {
|
||||||
|
color: rgb(138, 138, 138) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message-body p em {
|
||||||
|
color: rgb(110, 110, 110) !important;
|
||||||
|
}
|
||||||
14
css/html_readable_style.css
Normal file
14
css/html_readable_style.css
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
.container {
|
||||||
|
max-width: 600px;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
background-color: rgb(31, 41, 55);
|
||||||
|
padding:3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container p {
|
||||||
|
font-size: 16px !important;
|
||||||
|
color: white !important;
|
||||||
|
margin-bottom: 22px;
|
||||||
|
line-height: 1.4 !important;
|
||||||
|
}
|
||||||
39
css/main.css
Normal file
39
css/main.css
Normal file
@ -0,0 +1,39 @@
|
|||||||
|
.tabs.svelte-710i53 {
|
||||||
|
margin-top: 0
|
||||||
|
}
|
||||||
|
.py-6 {
|
||||||
|
padding-top: 2.5rem
|
||||||
|
}
|
||||||
|
.dark #refresh-button {
|
||||||
|
background-color: #ffffff1f;
|
||||||
|
}
|
||||||
|
#refresh-button {
|
||||||
|
flex: none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
min-width: 50px;
|
||||||
|
border: none;
|
||||||
|
box-shadow: none;
|
||||||
|
border-radius: 10px;
|
||||||
|
background-color: #0000000d;
|
||||||
|
}
|
||||||
|
#download-label, #upload-label {
|
||||||
|
min-height: 0
|
||||||
|
}
|
||||||
|
#accordion {
|
||||||
|
}
|
||||||
|
.dark svg {
|
||||||
|
fill: white;
|
||||||
|
}
|
||||||
|
svg {
|
||||||
|
display: unset !important;
|
||||||
|
vertical-align: middle !important;
|
||||||
|
margin: 5px;
|
||||||
|
}
|
||||||
|
ol li p, ul li p {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
#main, #settings, #extensions, #chat-settings {
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
3
css/main.js
Normal file
3
css/main.js
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
document.getElementById("main").parentNode.childNodes[0].style = "border: none; background-color: #8080802b; margin-bottom: 40px"
|
||||||
|
document.getElementById("main").parentNode.style = "padding: 0; margin: 0"
|
||||||
|
document.getElementById("main").parentNode.parentNode.parentNode.style = "padding: 0"
|
||||||
@ -8,27 +8,16 @@ import os
|
|||||||
import re
|
import re
|
||||||
from pathlib import Path
|
from pathlib import Path
|
||||||
|
|
||||||
|
import markdown
|
||||||
from PIL import Image
|
from PIL import Image
|
||||||
|
|
||||||
# This is to store the paths to the thumbnails of the profile pictures
|
# This is to store the paths to the thumbnails of the profile pictures
|
||||||
image_cache = {}
|
image_cache = {}
|
||||||
|
|
||||||
def generate_basic_html(s):
|
def generate_basic_html(s):
|
||||||
css = """
|
with open(Path(__file__).resolve().parent / '../css/html_readable_style.css', 'r') as f:
|
||||||
.container {
|
css = f.read()
|
||||||
max-width: 600px;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
background-color: rgb(31, 41, 55);
|
|
||||||
padding:3em;
|
|
||||||
}
|
|
||||||
.container p {
|
|
||||||
font-size: 16px !important;
|
|
||||||
color: white !important;
|
|
||||||
margin-bottom: 22px;
|
|
||||||
line-height: 1.4 !important;
|
|
||||||
}
|
|
||||||
"""
|
|
||||||
s = '\n'.join([f'<p>{line}</p>' for line in s.split('\n')])
|
s = '\n'.join([f'<p>{line}</p>' for line in s.split('\n')])
|
||||||
s = f'<style>{css}</style><div class="container">{s}</div>'
|
s = f'<style>{css}</style><div class="container">{s}</div>'
|
||||||
return s
|
return s
|
||||||
@ -48,112 +37,8 @@ def process_post(post, c):
|
|||||||
return src
|
return src
|
||||||
|
|
||||||
def generate_4chan_html(f):
|
def generate_4chan_html(f):
|
||||||
css = """
|
with open(Path(__file__).resolve().parent / '../css/html_4chan_style.css', 'r') as f:
|
||||||
|
css = f.read()
|
||||||
#parent #container {
|
|
||||||
background-color: #eef2ff;
|
|
||||||
padding: 17px;
|
|
||||||
}
|
|
||||||
#parent #container .reply {
|
|
||||||
background-color: rgb(214, 218, 240);
|
|
||||||
border-bottom-color: rgb(183, 197, 217);
|
|
||||||
border-bottom-style: solid;
|
|
||||||
border-bottom-width: 1px;
|
|
||||||
border-image-outset: 0;
|
|
||||||
border-image-repeat: stretch;
|
|
||||||
border-image-slice: 100%;
|
|
||||||
border-image-source: none;
|
|
||||||
border-image-width: 1;
|
|
||||||
border-left-color: rgb(0, 0, 0);
|
|
||||||
border-left-style: none;
|
|
||||||
border-left-width: 0px;
|
|
||||||
border-right-color: rgb(183, 197, 217);
|
|
||||||
border-right-style: solid;
|
|
||||||
border-right-width: 1px;
|
|
||||||
border-top-color: rgb(0, 0, 0);
|
|
||||||
border-top-style: none;
|
|
||||||
border-top-width: 0px;
|
|
||||||
color: rgb(0, 0, 0);
|
|
||||||
display: table;
|
|
||||||
font-family: arial, helvetica, sans-serif;
|
|
||||||
font-size: 13.3333px;
|
|
||||||
margin-bottom: 4px;
|
|
||||||
margin-left: 0px;
|
|
||||||
margin-right: 0px;
|
|
||||||
margin-top: 4px;
|
|
||||||
overflow-x: hidden;
|
|
||||||
overflow-y: hidden;
|
|
||||||
padding-bottom: 4px;
|
|
||||||
padding-left: 2px;
|
|
||||||
padding-right: 2px;
|
|
||||||
padding-top: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#parent #container .number {
|
|
||||||
color: rgb(0, 0, 0);
|
|
||||||
font-family: arial, helvetica, sans-serif;
|
|
||||||
font-size: 13.3333px;
|
|
||||||
width: 342.65px;
|
|
||||||
margin-right: 7px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#parent #container .op {
|
|
||||||
color: rgb(0, 0, 0);
|
|
||||||
font-family: arial, helvetica, sans-serif;
|
|
||||||
font-size: 13.3333px;
|
|
||||||
margin-bottom: 8px;
|
|
||||||
margin-left: 0px;
|
|
||||||
margin-right: 0px;
|
|
||||||
margin-top: 4px;
|
|
||||||
overflow-x: hidden;
|
|
||||||
overflow-y: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
#parent #container .op blockquote {
|
|
||||||
margin-left: 0px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#parent #container .name {
|
|
||||||
color: rgb(17, 119, 67);
|
|
||||||
font-family: arial, helvetica, sans-serif;
|
|
||||||
font-size: 13.3333px;
|
|
||||||
font-weight: 700;
|
|
||||||
margin-left: 7px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#parent #container .quote {
|
|
||||||
color: rgb(221, 0, 0);
|
|
||||||
font-family: arial, helvetica, sans-serif;
|
|
||||||
font-size: 13.3333px;
|
|
||||||
text-decoration-color: rgb(221, 0, 0);
|
|
||||||
text-decoration-line: underline;
|
|
||||||
text-decoration-style: solid;
|
|
||||||
text-decoration-thickness: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
#parent #container .greentext {
|
|
||||||
color: rgb(120, 153, 34);
|
|
||||||
font-family: arial, helvetica, sans-serif;
|
|
||||||
font-size: 13.3333px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#parent #container blockquote {
|
|
||||||
margin: 0px !important;
|
|
||||||
margin-block-start: 1em;
|
|
||||||
margin-block-end: 1em;
|
|
||||||
margin-inline-start: 40px;
|
|
||||||
margin-inline-end: 40px;
|
|
||||||
margin-top: 13.33px !important;
|
|
||||||
margin-bottom: 13.33px !important;
|
|
||||||
margin-left: 40px !important;
|
|
||||||
margin-right: 40px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#parent #container .message {
|
|
||||||
color: black;
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
"""
|
|
||||||
|
|
||||||
posts = []
|
posts = []
|
||||||
post = ''
|
post = ''
|
||||||
@ -208,135 +93,42 @@ def get_image_cache(path):
|
|||||||
|
|
||||||
return image_cache[path][1]
|
return image_cache[path][1]
|
||||||
|
|
||||||
|
def load_html_image(paths):
|
||||||
|
for str_path in paths:
|
||||||
|
path = Path(str_path)
|
||||||
|
if path.exists():
|
||||||
|
return f'<img src="file/{get_image_cache(path)}">'
|
||||||
|
return ''
|
||||||
|
|
||||||
def generate_chat_html(history, name1, name2, character):
|
def generate_chat_html(history, name1, name2, character):
|
||||||
css = """
|
with open(Path(__file__).resolve().parent / '../css/html_chat_style.css', 'r') as f:
|
||||||
.chat {
|
css = f.read()
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
max-width: 800px;
|
|
||||||
height: 66.67vh;
|
|
||||||
overflow-y: auto;
|
|
||||||
padding-right: 20px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column-reverse;
|
|
||||||
}
|
|
||||||
|
|
||||||
.message {
|
output = f'<style>{css}</style><div class="chat" id="chat">'
|
||||||
display: grid;
|
|
||||||
grid-template-columns: 60px 1fr;
|
|
||||||
padding-bottom: 25px;
|
|
||||||
font-size: 15px;
|
|
||||||
font-family: Helvetica, Arial, sans-serif;
|
|
||||||
line-height: 1.428571429;
|
|
||||||
}
|
|
||||||
|
|
||||||
.circle-you {
|
img_bot = load_html_image([f"characters/{character}.{ext}" for ext in ['png', 'jpg', 'jpeg']] + ["img_bot.png","img_bot.jpg","img_bot.jpeg"])
|
||||||
width: 50px;
|
img_me = load_html_image(["img_me.png", "img_me.jpg", "img_me.jpeg"])
|
||||||
height: 50px;
|
|
||||||
background-color: rgb(238, 78, 59);
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.circle-bot {
|
|
||||||
width: 50px;
|
|
||||||
height: 50px;
|
|
||||||
background-color: rgb(59, 78, 244);
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.circle-bot img, .circle-you img {
|
|
||||||
border-radius: 50%;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
object-fit: cover;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text {
|
|
||||||
}
|
|
||||||
|
|
||||||
.text p {
|
|
||||||
margin-top: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.username {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.message-body {
|
|
||||||
}
|
|
||||||
|
|
||||||
.message-body img {
|
|
||||||
max-width: 300px;
|
|
||||||
max-height: 300px;
|
|
||||||
border-radius: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.message-body p {
|
|
||||||
margin-bottom: 0 !important;
|
|
||||||
font-size: 15px !important;
|
|
||||||
line-height: 1.428571429 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dark .message-body p em {
|
|
||||||
color: rgb(138, 138, 138) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.message-body p em {
|
|
||||||
color: rgb(110, 110, 110) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
"""
|
|
||||||
|
|
||||||
output = ''
|
|
||||||
output += f'<style>{css}</style><div class="chat" id="chat">'
|
|
||||||
img = ''
|
|
||||||
|
|
||||||
for i in [
|
|
||||||
f"characters/{character}.png",
|
|
||||||
f"characters/{character}.jpg",
|
|
||||||
f"characters/{character}.jpeg",
|
|
||||||
"img_bot.png",
|
|
||||||
"img_bot.jpg",
|
|
||||||
"img_bot.jpeg"
|
|
||||||
]:
|
|
||||||
|
|
||||||
path = Path(i)
|
|
||||||
if path.exists():
|
|
||||||
img = f'<img src="file/{get_image_cache(path)}">'
|
|
||||||
break
|
|
||||||
|
|
||||||
img_me = ''
|
|
||||||
for i in ["img_me.png", "img_me.jpg", "img_me.jpeg"]:
|
|
||||||
path = Path(i)
|
|
||||||
if path.exists():
|
|
||||||
img_me = f'<img src="file/{get_image_cache(path)}">'
|
|
||||||
break
|
|
||||||
|
|
||||||
for i,_row in enumerate(history[::-1]):
|
for i,_row in enumerate(history[::-1]):
|
||||||
row = _row.copy()
|
row = [markdown.markdown(re.sub(r"(.)```", r"\1\n```", entry), extensions=['fenced_code']) for entry in _row]
|
||||||
row[0] = re.sub(r"(\*\*)([^\*\n]*)(\*\*)", r"<b>\2</b>", row[0])
|
|
||||||
row[1] = re.sub(r"(\*\*)([^\*\n]*)(\*\*)", r"<b>\2</b>", row[1])
|
|
||||||
row[0] = re.sub(r"(\*)([^\*\n]*)(\*)", r"<em>\2</em>", row[0])
|
|
||||||
row[1] = re.sub(r"(\*)([^\*\n]*)(\*)", r"<em>\2</em>", row[1])
|
|
||||||
p = '\n'.join([f"<p>{x}</p>" for x in row[1].split('\n')])
|
|
||||||
output += f"""
|
output += f"""
|
||||||
<div class="message">
|
<div class="message">
|
||||||
<div class="circle-bot">
|
<div class="circle-bot">
|
||||||
{img}
|
{img_bot}
|
||||||
</div>
|
</div>
|
||||||
<div class="text">
|
<div class="text">
|
||||||
<div class="username">
|
<div class="username">
|
||||||
{name2}
|
{name2}
|
||||||
</div>
|
</div>
|
||||||
<div class="message-body">
|
<div class="message-body">
|
||||||
{p}
|
{row[1]}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
"""
|
"""
|
||||||
|
|
||||||
if not (i == len(history)-1 and len(row[0]) == 0):
|
if not (i == len(history)-1 and len(row[0]) == 0):
|
||||||
p = '\n'.join([f"<p>{x}</p>" for x in row[0].split('\n')])
|
|
||||||
output += f"""
|
output += f"""
|
||||||
<div class="message">
|
<div class="message">
|
||||||
<div class="circle-you">
|
<div class="circle-you">
|
||||||
@ -347,7 +139,7 @@ def generate_chat_html(history, name1, name2, character):
|
|||||||
{name1}
|
{name1}
|
||||||
</div>
|
</div>
|
||||||
<div class="message-body">
|
<div class="message-body">
|
||||||
{p}
|
{row[0]}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -1,77 +1,15 @@
|
|||||||
|
from pathlib import Path
|
||||||
|
|
||||||
import gradio as gr
|
import gradio as gr
|
||||||
|
|
||||||
refresh_symbol = '\U0001f504' # 🔄
|
refresh_symbol = '\U0001f504' # 🔄
|
||||||
|
|
||||||
css = """
|
with open(Path(__file__).resolve().parent / '../css/main.css', 'r') as f:
|
||||||
.tabs.svelte-710i53 {
|
css = f.read()
|
||||||
margin-top: 0
|
with open(Path(__file__).resolve().parent / '../css/chat.css', 'r') as f:
|
||||||
}
|
chat_css = f.read()
|
||||||
.py-6 {
|
with open(Path(__file__).resolve().parent / '../css/main.js', 'r') as f:
|
||||||
padding-top: 2.5rem
|
page_js = f.read()
|
||||||
}
|
|
||||||
.dark #refresh-button {
|
|
||||||
background-color: #ffffff1f;
|
|
||||||
}
|
|
||||||
#refresh-button {
|
|
||||||
flex: none;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
min-width: 50px;
|
|
||||||
border: none;
|
|
||||||
box-shadow: none;
|
|
||||||
border-radius: 10px;
|
|
||||||
background-color: #0000000d;
|
|
||||||
}
|
|
||||||
#download-label, #upload-label {
|
|
||||||
min-height: 0
|
|
||||||
}
|
|
||||||
#accordion {
|
|
||||||
}
|
|
||||||
.dark svg {
|
|
||||||
fill: white;
|
|
||||||
}
|
|
||||||
svg {
|
|
||||||
display: unset !important;
|
|
||||||
vertical-align: middle !important;
|
|
||||||
margin: 5px;
|
|
||||||
}
|
|
||||||
ol li p, ul li p {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
#main, #settings, #extensions, #chat-settings {
|
|
||||||
border: 0;
|
|
||||||
}
|
|
||||||
"""
|
|
||||||
|
|
||||||
chat_css = """
|
|
||||||
.h-\[40vh\], .wrap.svelte-byatnx.svelte-byatnx.svelte-byatnx {
|
|
||||||
height: 66.67vh
|
|
||||||
}
|
|
||||||
.gradio-container {
|
|
||||||
max-width: 800px !important;
|
|
||||||
margin-left: auto !important;
|
|
||||||
margin-right: auto !important;
|
|
||||||
}
|
|
||||||
.w-screen {
|
|
||||||
width: unset
|
|
||||||
}
|
|
||||||
div.svelte-362y77>*, div.svelte-362y77>.form>* {
|
|
||||||
flex-wrap: nowrap
|
|
||||||
}
|
|
||||||
/* fixes the API documentation in chat mode */
|
|
||||||
.api-docs.svelte-1iguv9h.svelte-1iguv9h.svelte-1iguv9h {
|
|
||||||
display: grid;
|
|
||||||
}
|
|
||||||
.pending.svelte-1ed2p3z {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
"""
|
|
||||||
|
|
||||||
page_js = """
|
|
||||||
document.getElementById("main").parentNode.childNodes[0].style = "border: none; background-color: #8080802b; margin-bottom: 40px"
|
|
||||||
document.getElementById("main").parentNode.style = "padding: 0; margin: 0"
|
|
||||||
document.getElementById("main").parentNode.parentNode.parentNode.style = "padding: 0"
|
|
||||||
"""
|
|
||||||
|
|
||||||
class ToolButton(gr.Button, gr.components.FormComponent):
|
class ToolButton(gr.Button, gr.components.FormComponent):
|
||||||
"""Small button with single emoji as text, fits inside gradio forms"""
|
"""Small button with single emoji as text, fits inside gradio forms"""
|
||||||
|
|||||||
@ -2,6 +2,7 @@ accelerate==0.17.1
|
|||||||
bitsandbytes==0.37.1
|
bitsandbytes==0.37.1
|
||||||
flexgen==0.1.7
|
flexgen==0.1.7
|
||||||
gradio==3.18.0
|
gradio==3.18.0
|
||||||
|
markdown
|
||||||
numpy
|
numpy
|
||||||
requests
|
requests
|
||||||
rwkv==0.4.2
|
rwkv==0.4.2
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user