Mirrors/text-generation-webui
1
0
Fork 0
mirror of https://github.com/oobabooga/text-generation-webui.git synced 2024-11-22 08:07:56 +01:00
Code Issues Packages Projects Releases Wiki Activity

Lint the JS/CSS

Browse Source
This commit is contained in:
oobabooga 2023-12-27 09:59:23 -08:00
parent 648c2d1cc2
commit c419206ce1
5 changed files with 24 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
css/html_instruct_style.css
View File

@ -1,13 +1,13 @@
.chat { .chat {
background: var(--block-background-fill); background: var(--block-background-fill);
padding: 24px 19px; padding: 24px 19px;
padding-right: 19px !important; padding-right: 19px !important;
padding-top: 0px; padding-top: 0;
border: 1px solid var(--block-border-color); border: 1px solid var(--block-border-color);
} }
.chat > .messages { .chat > .messages {
padding-top: 28px !important; padding-top: 28px !important;
} }
.message { .message {
@ -62,7 +62,6 @@
.gradio-container .chat .user-message { .gradio-container .chat .user-message {
padding: 20px; padding: 20px;
background-color: var(--color-accent-soft); background-color: var(--color-accent-soft);
border-radius: 20px;
margin-bottom: 12px !important; margin-bottom: 12px !important;
margin-left: 16px; margin-left: 16px;
border-radius: 22px; border-radius: 22px;

4
css/main.css
View File

@ -92,7 +92,7 @@ div.svelte-15lo0d8 > *, div.svelte-15lo0d8 > .form > * {
.header_bar { .header_bar {
background-color: #f7f7f7; background-color: #f7f7f7;
box-shadow: 0 2px 3px rgba(22 22 22 / 35%); box-shadow: 0 2px 3px rgba(22 22 22 / 35%);
margin-bottom: 0px; margin-bottom: 0;
overflow-x: scroll; overflow-x: scroll;
margin-left: calc(-1 * var(--size-4)); margin-left: calc(-1 * var(--size-4));
margin-right: calc(-1 * var(--size-4)); margin-right: calc(-1 * var(--size-4));
@ -303,7 +303,7 @@ div.svelte-362y77>*, div.svelte-362y77>.form>* {
} }
#chat-tab { #chat-tab {
padding-top: 0px; padding-top: 0;
} }
#chat-tab button#Generate, #chat-tab button#stop { #chat-tab button#Generate, #chat-tab button#stop {

26
js/main.js
View File

@ -178,11 +178,11 @@ for(i = 0; i < noBackgroundelements.length; i++) {
noBackgroundelements[i].parentNode.parentNode.parentNode.style.alignItems = "center"; noBackgroundelements[i].parentNode.parentNode.parentNode.style.alignItems = "center";
} }
const slimDropdownElements = document.querySelectorAll('.slim-dropdown'); const slimDropdownElements = document.querySelectorAll(".slim-dropdown");
for (i = 0; i < slimDropdownElements.length; i++) { for (i = 0; i < slimDropdownElements.length; i++) {
const parentNode = slimDropdownElements[i].parentNode; const parentNode = slimDropdownElements[i].parentNode;
parentNode.style.background = 'transparent'; parentNode.style.background = "transparent";
parentNode.style.border = '0'; parentNode.style.border = "0";
} }
//------------------------------------------------ //------------------------------------------------
@ -313,7 +313,7 @@ function addBigPicture() {
} }
function deleteBigPicture() { function deleteBigPicture() {
var bigProfilePictures = document.querySelectorAll('.bigProfilePicture'); var bigProfilePictures = document.querySelectorAll(".bigProfilePicture");
bigProfilePictures.forEach(function (element) { bigProfilePictures.forEach(function (element) {
element.parentNode.removeChild(element); element.parentNode.removeChild(element);
}); });
@ -337,16 +337,16 @@ let currentChatInputHeight = 0;
function updateCssProperties() { function updateCssProperties() {
// Set the height of the chat area // Set the height of the chat area
const chatContainer = document.getElementById('chat').parentNode.parentNode.parentNode; const chatContainer = document.getElementById("chat").parentNode.parentNode.parentNode;
const chatInputHeight = document.querySelector('#chat-input textarea').clientHeight; const chatInputHeight = document.querySelector("#chat-input textarea").clientHeight;
const newChatHeight = `${chatContainer.clientHeight - chatInputHeight + 40}px`; const newChatHeight = `${chatContainer.clientHeight - chatInputHeight + 40}px`;
document.documentElement.style.setProperty('--chat-height', newChatHeight); document.documentElement.style.setProperty("--chat-height", newChatHeight);
document.documentElement.style.setProperty('--input-delta', `${chatInputHeight - 40}px`); document.documentElement.style.setProperty("--input-delta", `${chatInputHeight - 40}px`);
// Set the position offset of the chat input box // Set the position offset of the chat input box
const header = document.querySelector('.header_bar'); const header = document.querySelector(".header_bar");
const headerHeight = `${header.clientHeight}px`; const headerHeight = `${header.clientHeight}px`;
document.documentElement.style.setProperty('--header-height', headerHeight); document.documentElement.style.setProperty("--header-height", headerHeight);
// Offset the scroll position of the chat area // Offset the scroll position of the chat area
if (chatInputHeight !== currentChatInputHeight) { if (chatInputHeight !== currentChatInputHeight) {
@ -356,6 +356,6 @@ function updateCssProperties() {
} }
new ResizeObserver(updateCssProperties) new ResizeObserver(updateCssProperties)
.observe(document.querySelector('#chat-input textarea')); .observe(document.querySelector("#chat-input textarea"));
window.addEventListener('resize', updateCssProperties); window.addEventListener("resize", updateCssProperties);

4
js/show_controls.js
View File

@ -12,9 +12,9 @@ function toggle_controls(value) {
document.getElementById("chat-col").classList.remove("bigchat"); document.getElementById("chat-col").classList.remove("bigchat");
document.getElementById("chat-tab").style.paddingBottom = ""; document.getElementById("chat-tab").style.paddingBottom = "";
let gallery_element = document.getElementById('gallery-extension'); let gallery_element = document.getElementById("gallery-extension");
if (gallery_element) { if (gallery_element) {
gallery_element.style.display = 'block'; gallery_element.style.display = "block";
} }
} else { } else {

2
js/update_big_picture.js
View File

@ -1,5 +1,5 @@
function updateBigPicture() { function updateBigPicture() {
var existingElement = document.querySelector('.bigProfilePicture'); var existingElement = document.querySelector(".bigProfilePicture");
if (existingElement) { if (existingElement) {
var timestamp = new Date().getTime(); var timestamp = new Date().getTime();
existingElement.src = "/file/cache/pfp_character.png?time=" + timestamp; existingElement.src = "/file/cache/pfp_character.png?time=" + timestamp;