diff --git a/css/html_instruct_style.css b/css/html_instruct_style.css index 130c353a..673dad2a 100644 --- a/css/html_instruct_style.css +++ b/css/html_instruct_style.css @@ -1,13 +1,13 @@ .chat { - background: var(--block-background-fill); - padding: 24px 19px; - padding-right: 19px !important; - padding-top: 0px; - border: 1px solid var(--block-border-color); + background: var(--block-background-fill); + padding: 24px 19px; + padding-right: 19px !important; + padding-top: 0; + border: 1px solid var(--block-border-color); } .chat > .messages { - padding-top: 28px !important; + padding-top: 28px !important; } .message { @@ -62,7 +62,6 @@ .gradio-container .chat .user-message { padding: 20px; background-color: var(--color-accent-soft); - border-radius: 20px; margin-bottom: 12px !important; margin-left: 16px; border-radius: 22px; diff --git a/css/main.css b/css/main.css index fa706ba9..bb944cc9 100644 --- a/css/main.css +++ b/css/main.css @@ -92,7 +92,7 @@ div.svelte-15lo0d8 > *, div.svelte-15lo0d8 > .form > * { .header_bar { background-color: #f7f7f7; box-shadow: 0 2px 3px rgba(22 22 22 / 35%); - margin-bottom: 0px; + margin-bottom: 0; overflow-x: scroll; margin-left: 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 { - padding-top: 0px; + padding-top: 0; } #chat-tab button#Generate, #chat-tab button#stop { diff --git a/js/main.js b/js/main.js index 0828dee4..dd57dde3 100644 --- a/js/main.js +++ b/js/main.js @@ -178,11 +178,11 @@ for(i = 0; i < noBackgroundelements.length; i++) { 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++) { - const parentNode = slimDropdownElements[i].parentNode; - parentNode.style.background = 'transparent'; - parentNode.style.border = '0'; + const parentNode = slimDropdownElements[i].parentNode; + parentNode.style.background = "transparent"; + parentNode.style.border = "0"; } //------------------------------------------------ @@ -313,7 +313,7 @@ function addBigPicture() { } function deleteBigPicture() { - var bigProfilePictures = document.querySelectorAll('.bigProfilePicture'); + var bigProfilePictures = document.querySelectorAll(".bigProfilePicture"); bigProfilePictures.forEach(function (element) { element.parentNode.removeChild(element); }); @@ -337,16 +337,16 @@ let currentChatInputHeight = 0; function updateCssProperties() { // Set the height of the chat area - const chatContainer = document.getElementById('chat').parentNode.parentNode.parentNode; - const chatInputHeight = document.querySelector('#chat-input textarea').clientHeight; + const chatContainer = document.getElementById("chat").parentNode.parentNode.parentNode; + const chatInputHeight = document.querySelector("#chat-input textarea").clientHeight; const newChatHeight = `${chatContainer.clientHeight - chatInputHeight + 40}px`; - document.documentElement.style.setProperty('--chat-height', newChatHeight); - document.documentElement.style.setProperty('--input-delta', `${chatInputHeight - 40}px`); + document.documentElement.style.setProperty("--chat-height", newChatHeight); + document.documentElement.style.setProperty("--input-delta", `${chatInputHeight - 40}px`); // 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`; - document.documentElement.style.setProperty('--header-height', headerHeight); + document.documentElement.style.setProperty("--header-height", headerHeight); // Offset the scroll position of the chat area if (chatInputHeight !== currentChatInputHeight) { @@ -356,6 +356,6 @@ function updateCssProperties() { } new ResizeObserver(updateCssProperties) - .observe(document.querySelector('#chat-input textarea')); + .observe(document.querySelector("#chat-input textarea")); -window.addEventListener('resize', updateCssProperties); +window.addEventListener("resize", updateCssProperties); diff --git a/js/show_controls.js b/js/show_controls.js index cdd6efc4..1ff88e52 100644 --- a/js/show_controls.js +++ b/js/show_controls.js @@ -12,9 +12,9 @@ function toggle_controls(value) { document.getElementById("chat-col").classList.remove("bigchat"); document.getElementById("chat-tab").style.paddingBottom = ""; - let gallery_element = document.getElementById('gallery-extension'); + let gallery_element = document.getElementById("gallery-extension"); if (gallery_element) { - gallery_element.style.display = 'block'; + gallery_element.style.display = "block"; } } else { diff --git a/js/update_big_picture.js b/js/update_big_picture.js index 1984215a..4c094776 100644 --- a/js/update_big_picture.js +++ b/js/update_big_picture.js @@ -1,5 +1,5 @@ function updateBigPicture() { - var existingElement = document.querySelector('.bigProfilePicture'); + var existingElement = document.querySelector(".bigProfilePicture"); if (existingElement) { var timestamp = new Date().getTime(); existingElement.src = "/file/cache/pfp_character.png?time=" + timestamp;