mirror of
https://github.com/ParisNeo/lollms-webui.git
synced 2024-12-21 05:13:10 +00:00
Upgraded ui
This commit is contained in:
Saifeddine ALOUI
parent
b4924c34d2
commit
0d74996e7c
File diff suppressed because one or more lines are too long
8
web/dist/assets/index-82bdec9f.css
vendored
8
web/dist/assets/index-82bdec9f.css
vendored
File diff suppressed because one or more lines are too long
8
web/dist/assets/index-a89f9eac.css
vendored
Normal file
8
web/dist/assets/index-a89f9eac.css
vendored
Normal file
File diff suppressed because one or more lines are too long
4
web/dist/index.html
vendored
4
web/dist/index.html
vendored
@ -6,8 +6,8 @@
|
||||
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js"></script>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>LoLLMS WebUI</title>
|
||||
<script type="module" crossorigin src="/assets/index-cde8135f.js"></script>
|
||||
<link rel="stylesheet" href="/assets/index-82bdec9f.css">
|
||||
<script type="module" crossorigin src="/assets/index-57e01b2f.js"></script>
|
||||
<link rel="stylesheet" href="/assets/index-a89f9eac.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
|
||||
@ -180,21 +180,108 @@ body {
|
||||
.link {
|
||||
@apply text-blue-500 hover:text-blue-600 dark:text-blue-400 dark:hover:text-blue-300;
|
||||
}
|
||||
|
||||
.nav-ul {
|
||||
@apply list-none p-0 m-0 flex flex-row justify-center h-full;
|
||||
.navbar-container {
|
||||
@apply text-gray-700 dark:text-gray-50 bg-gradient-to-r from-blue-200 to-purple-200 dark:from-blue-800 dark:to-purple-800 rounded shadow-lg
|
||||
}
|
||||
|
||||
.nav-link {
|
||||
@apply relative inline-block px-4 py-2 mx-1 text-white font-bold rounded transition-all duration-300 ease-in-out;
|
||||
@apply text-gray-700 dark:text-gray-50 bg-gradient-to-r from-indigo-300 to-purple-400 dark:from-indigo-500 dark:to-purple-600; /* Light mode gradient */
|
||||
.game-menu {
|
||||
@apply flex justify-center items-center relative;
|
||||
}
|
||||
.menu-item {
|
||||
@apply px-4 py-2 text-gray-800 dark:text-gray-100 font-bold text-lg transition-all duration-300 ease-in-out;
|
||||
@apply hover:text-gray-500 hover:dark:text-gray-50 hover:transform hover:-translate-y-1;
|
||||
}
|
||||
|
||||
.nav-link:hover {
|
||||
.menu-item.active-link {
|
||||
@apply px-4 py-2 text-gray-800 dark:text-gray-100 font-bold text-lg transition-all duration-300 ease-in-out scale-105;
|
||||
@apply hover:text-gray-500 hover:dark:text-gray-50 hover:transform hover:-translate-y-1;
|
||||
/* Glow effect on text */
|
||||
text-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
|
||||
/* Lightsaber effect */
|
||||
position: relative;
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -5px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 5px;
|
||||
/* Lightsaber colors */
|
||||
background: linear-gradient(to right, #ff0000, #b13a06, #d31515); /* Normal mode */
|
||||
border-radius: 10px;
|
||||
animation: lightsaber 2s infinite;
|
||||
}
|
||||
}
|
||||
|
||||
.dark .menu-item.active-link::after {
|
||||
background: linear-gradient(to right, #2c2c67, #1d3062, #4e36b6); /* Dark mode */
|
||||
}
|
||||
|
||||
@keyframes lightsaber {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
}
|
||||
50% {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.app-card {
|
||||
@apply transition-all duration-300 ease-in-out bg-gradient-to-br from-blue-200 to-purple-300 dark:from-blue-800 dark:to-purple-800 text-gray-800 dark:text-gray-100 shadow-md hover:shadow-lg;
|
||||
}
|
||||
|
||||
.app-card:hover {
|
||||
@apply transform -translate-y-1;
|
||||
@apply text-gray-700 dark:text-gray-50 bg-gradient-to-r from-indigo-300 to-purple-300 dark:from-indigo-400 dark:to-purple-500; /* Reverse gradient on hover */
|
||||
}
|
||||
|
||||
.nav-link.active {
|
||||
@apply bg-white text-indigo-600 shadow-lg; /* Active state styles */
|
||||
button {
|
||||
@apply transition-all duration-300 ease-in-out;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
@apply transform -translate-y-0.5;
|
||||
}
|
||||
|
||||
.scrollbar-thin {
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: theme('colors.blue.300') theme('colors.blue.100');
|
||||
}
|
||||
|
||||
.dark .scrollbar-thin {
|
||||
scrollbar-color: theme('colors.blue.700') theme('colors.blue.900');
|
||||
}
|
||||
|
||||
.scrollbar-thin::-webkit-scrollbar {
|
||||
@apply w-2;
|
||||
}
|
||||
|
||||
.scrollbar-thin::-webkit-scrollbar-track {
|
||||
@apply bg-blue-100 dark:bg-blue-900 rounded-full;
|
||||
}
|
||||
|
||||
.scrollbar-thin::-webkit-scrollbar-thumb {
|
||||
@apply bg-blue-300 dark:bg-blue-700 rounded-full;
|
||||
}
|
||||
|
||||
.scrollbar-thin::-webkit-scrollbar-thumb:hover {
|
||||
@apply bg-blue-400 dark:bg-blue-600;
|
||||
}
|
||||
.btn {
|
||||
@apply font-semibold py-2 px-4 rounded-lg transition-all duration-300 ease-in-out shadow-md flex items-center;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
@apply bg-blue-500 text-white hover:bg-blue-600 focus:ring-4 focus:ring-blue-300 dark:focus:ring-blue-800;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
@apply bg-blue-200 text-gray-700 hover:bg-blue-300 focus:ring-4 focus:ring-blue-200 dark:bg-blue-700 dark:text-gray-200 dark:hover:bg-blue-600 dark:focus:ring-blue-600;
|
||||
}
|
||||
|
||||
.search-input {
|
||||
@apply w-full border-b-2 border-blue-200 dark:border-blue-700 py-2 px-4 pl-10 transition-colors duration-300 ease-in-out focus:outline-none focus:border-blue-500 dark:focus:border-blue-400 bg-transparent text-gray-800 dark:text-gray-100;
|
||||
}
|
||||
@ -1,47 +1,51 @@
|
||||
<template>
|
||||
<div v-if="$store.state.ready" class="navbar-container z-60 flex flex-col sm:flex-row items-center">
|
||||
<div class="w-full text-center">
|
||||
<div class="m-0 flex border-b w-full items-center justify-center flex-row font-medium nav-ul text-center">
|
||||
<RouterLink
|
||||
v-for="(link, index) in filteredNavLinks"
|
||||
:key="index"
|
||||
:to="{ name: link.route }"
|
||||
class="nav-link"
|
||||
:class="{ 'active_link': isRouteActive(link.route) }"
|
||||
>
|
||||
{{ link.text }}
|
||||
</RouterLink>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="$store.state.ready" class="navbar-container z-10000">
|
||||
<nav class="game-menu">
|
||||
<RouterLink
|
||||
v-for="(link, index) in filteredNavLinks"
|
||||
:key="index"
|
||||
:to="{ name: link.route }"
|
||||
class="menu-item"
|
||||
:class="{ 'active-link': isRouteActive(link.route) }"
|
||||
@click="setActiveIndex(index)"
|
||||
ref="menuItems"
|
||||
>
|
||||
{{ link.text }}
|
||||
</RouterLink>
|
||||
</nav>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed } from 'vue';
|
||||
import { RouterLink } from 'vue-router';
|
||||
import { computed, ref, onMounted, watch } from 'vue';
|
||||
import { RouterLink, useRoute } from 'vue-router';
|
||||
import { store } from '../main';
|
||||
|
||||
const route = useRoute();
|
||||
const activeItemIndex = ref(0);
|
||||
const menuItems = ref([]);
|
||||
|
||||
const navLinks = [
|
||||
{ active: true, route: 'discussions', text: 'Discussions' },
|
||||
{ active: true, route: 'playground', text: 'Playground' },
|
||||
{ active: true, route: 'AppsZoo', text: 'Apps Zoo' },
|
||||
{
|
||||
active: false,
|
||||
route: 'AutoSD',
|
||||
text: 'Auto111-SD',
|
||||
condition: () => store.state.config.enable_sd_service || store.state.config.active_tti_service === 'autosd'
|
||||
active: false,
|
||||
route: 'AutoSD',
|
||||
text: 'Auto111-SD',
|
||||
condition: () => store.state.config.enable_sd_service || store.state.config.active_tti_service === 'autosd'
|
||||
},
|
||||
{
|
||||
active: false,
|
||||
route: 'ComfyUI',
|
||||
text: 'ComfyUI',
|
||||
condition: () => store.state.config.enable_comfyui_service || store.state.config.active_tti_service === 'comfyui'
|
||||
active: false,
|
||||
route: 'ComfyUI',
|
||||
text: 'ComfyUI',
|
||||
condition: () => store.state.config.enable_comfyui_service || store.state.config.active_tti_service === 'comfyui'
|
||||
},
|
||||
{
|
||||
active: false,
|
||||
route: 'interactive',
|
||||
text: 'Interactive',
|
||||
condition: () => store.state.config.active_tts_service !== 'None' && store.state.config.active_stt_service !== 'None'
|
||||
active: false,
|
||||
route: 'interactive',
|
||||
text: 'Interactive',
|
||||
condition: () => store.state.config.active_tts_service !== 'None' && store.state.config.active_stt_service !== 'None'
|
||||
},
|
||||
{ active: true, route: 'settings', text: 'Settings' },
|
||||
{ active: true, route: 'help_view', text: 'Help' }
|
||||
@ -49,44 +53,45 @@ const navLinks = [
|
||||
|
||||
const filteredNavLinks = computed(() => {
|
||||
if (!store.state.ready) {
|
||||
return navLinks.filter(link => link.active);
|
||||
return navLinks.filter(link => link.active);
|
||||
}
|
||||
return navLinks.filter(link => {
|
||||
if (link.condition) {
|
||||
return link.condition();
|
||||
}
|
||||
return link.active;
|
||||
if (link.condition) {
|
||||
return link.condition();
|
||||
}
|
||||
return link.active;
|
||||
});
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
updateActiveItem();
|
||||
});
|
||||
|
||||
watch(() => route.name, updateActiveItem);
|
||||
|
||||
function updateActiveItem() {
|
||||
const newIndex = filteredNavLinks.value.findIndex(link => link.route === route.name);
|
||||
if (newIndex !== -1) {
|
||||
activeItemIndex.value = newIndex;
|
||||
}
|
||||
}
|
||||
|
||||
function isRouteActive(routeName) {
|
||||
return route.name === routeName;
|
||||
}
|
||||
|
||||
function setActiveIndex(index) {
|
||||
activeItemIndex.value = index;
|
||||
}
|
||||
</script>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'Navigation',
|
||||
computed: {
|
||||
filteredNavLinks() {
|
||||
return filteredNavLinks.value;
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
isRouteActive(routeName) {
|
||||
try {
|
||||
return this.$route.name === routeName;
|
||||
} catch {
|
||||
console.log("routeName not found");
|
||||
return false;
|
||||
}
|
||||
}
|
||||
},
|
||||
name: 'Navigation',
|
||||
computed: {
|
||||
filteredNavLinks() {
|
||||
return filteredNavLinks.value;
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.nav-link.active_link {
|
||||
font-weight: bold;
|
||||
color: #fff; /* White text for active link */
|
||||
background-color: #007bff; /* Blue background for active link */
|
||||
border-radius: 5px; /* Rounded corners for active link */
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<header class="top-0 shadow-lg">
|
||||
<header class="top-0 shadow-lg navbar-container">
|
||||
<nav class="container flex flex-col lg:flex-row items-center gap-2 pb-0">
|
||||
<!-- LOGO -->
|
||||
<RouterLink :to="{ name: 'discussions' }" class="flex items-center space-x-2"> <!-- Added space-x-2 -->
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="app-zoo w-full p-6 overflow-y-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">
|
||||
<nav class="bg-white shadow-lg rounded-lg p-4 max-w-4xl mx-auto">
|
||||
<div class="app-zoo background-color w-full p-6 overflow-y-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">
|
||||
<nav class="panels-color shadow-lg rounded-lg p-4 max-w-4xl mx-auto">
|
||||
<div class="flex flex-wrap items-center justify-between gap-4">
|
||||
<div class="flex items-center space-x-4">
|
||||
<button
|
||||
@ -320,76 +320,3 @@ export default {
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.app-card {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.app-card:hover {
|
||||
transform: translateY(-5px);
|
||||
}
|
||||
|
||||
button {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.scrollbar-thin::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
.scrollbar-thin::-webkit-scrollbar-track {
|
||||
background: #f1f1f1;
|
||||
}
|
||||
|
||||
.scrollbar-thin::-webkit-scrollbar-thumb {
|
||||
background: #888;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.scrollbar-thin::-webkit-scrollbar-thumb:hover {
|
||||
background: #555;
|
||||
}
|
||||
.btn {
|
||||
font-weight: 600;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 0.5rem;
|
||||
transition: all 0.3s ease-in-out;
|
||||
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.btn-primary {
|
||||
background-color: #3b82f6;
|
||||
color: white;
|
||||
}
|
||||
.btn-primary:hover {
|
||||
background-color: #2563eb;
|
||||
}
|
||||
.btn-primary:focus {
|
||||
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.5);
|
||||
}
|
||||
.btn-secondary {
|
||||
background-color: #e5e7eb;
|
||||
color: #374151;
|
||||
}
|
||||
.btn-secondary:hover {
|
||||
background-color: #d1d5db;
|
||||
}
|
||||
.btn-secondary:focus {
|
||||
box-shadow: 0 0 0 3px rgba(107, 114, 128, 0.5);
|
||||
}
|
||||
.search-input {
|
||||
width: 100%;
|
||||
border-bottom: 2px solid #e5e7eb;
|
||||
padding: 0.5rem 1rem 0.5rem 2.5rem;
|
||||
transition: border-color 0.3s ease-in-out;
|
||||
}
|
||||
.search-input:focus {
|
||||
outline: none;
|
||||
border-color: #3b82f6;
|
||||
}
|
||||
</style>
|
||||
@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<div class="container overflow-y-scroll flex flex-row shadow-lg p-10 pt-0 overflow-y-scroll w-full dark:bg-bg-dark 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">
|
||||
<div class="container flex flex-row shadow-lg p-10 pt-0 overflow-y-scroll w-full background-color 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">
|
||||
<!-- CONTROL PANEL -->
|
||||
<div
|
||||
class="sticky top-0 z-10 flex flex-row mb-2 p-3 gap-3 w-full rounded-b-lg bg-bg-light-tone dark:bg-bg-dark-tone shadow-lg">
|
||||
class="sticky top-0 z-10 flex flex-row mb-2 p-3 gap-3 w-full rounded-b-lg panel-color shadow-lg">
|
||||
<!-- SAVE CONFIG -->
|
||||
<div v-if="showConfirmation" class="flex gap-3 flex-1 items-center duration-75">
|
||||
<button class="text-2xl hover:text-red-600 duration-75 active:scale-90 " title="Cancel" type="button"
|
||||
@ -88,7 +88,7 @@
|
||||
|
||||
<div :class="isLoading ? 'pointer-events-none opacity-30 w-full' : 'w-full'">
|
||||
<!-- DISK AND RAM USAGE -->
|
||||
<div class="flex flex-col mb-2 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
<div class="flex flex-col mb-2 rounded-lg panels-color hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
<div class="flex flex-row p-3">
|
||||
<button @click.stop="sc_collapsed = !sc_collapsed"
|
||||
class="text-2xl hover:text-primary p-2 -m-2 w-full text-left flex flex-row items-center ">
|
||||
@ -210,7 +210,7 @@
|
||||
</div>
|
||||
<!-- Router CONFIGS -->
|
||||
<div
|
||||
class="flex flex-col mb-2 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
class="flex flex-col mb-2 rounded-lg panels-color hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
<div class="flex flex-row p-3">
|
||||
<button @click.stop="smartrouterconf_collapsed = !smartrouterconf_collapsed"
|
||||
class="text-2xl hover:text-primary p-2 -m-2 w-full text-left flex flex-row items-center">
|
||||
@ -294,7 +294,7 @@
|
||||
</div>
|
||||
<!-- MAIN CONFIGS -->
|
||||
<div
|
||||
class="flex flex-col mb-2 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
class="flex flex-col mb-2 rounded-lg panels-color hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
<div class="flex flex-row p-3">
|
||||
<button @click.stop="mainconf_collapsed = !mainconf_collapsed"
|
||||
class="text-2xl hover:text-primary p-2 -m-2 w-full text-left flex flex-row items-center">
|
||||
@ -1094,7 +1094,7 @@
|
||||
<!-- Data settings-->
|
||||
|
||||
<div
|
||||
class="flex flex-col mb-2 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
class="flex flex-col mb-2 rounded-lg panels-color hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
<div class="flex flex-row p-3">
|
||||
<button @click.stop="data_conf_collapsed = !data_conf_collapsed"
|
||||
class="text-2xl hover:text-primary p-2 -m-2 w-full text-left flex flex-row items-center">
|
||||
@ -1507,7 +1507,7 @@
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="flex flex-col mb-2 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
class="flex flex-col mb-2 rounded-lg panels-color hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
<div class="flex flex-row p-3">
|
||||
<button @click.stop="internet_conf_collapsed = !internet_conf_collapsed"
|
||||
class="text-2xl hover:text-primary p-2 -m-2 w-full text-left flex flex-row items-center">
|
||||
@ -1676,7 +1676,7 @@
|
||||
|
||||
<!-- Servers CONFIGS -->
|
||||
<div
|
||||
class="flex flex-col mb-2 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
class="flex flex-col mb-2 rounded-lg panels-color hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
<div class="flex flex-row p-3">
|
||||
<button @click.stop="servers_conf_collapsed = !servers_conf_collapsed"
|
||||
class="text-2xl hover:text-primary p-2 -m-2 w-full text-left flex flex-row items-center">
|
||||
@ -3506,7 +3506,7 @@
|
||||
|
||||
<!-- BINDING ZOO -->
|
||||
<div
|
||||
class="flex flex-col mb-2 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
class="flex flex-col mb-2 rounded-lg panels-color hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
<div class="flex flex-row p-3">
|
||||
<button @click.stop="bzc_collapsed = !bzc_collapsed"
|
||||
class="text-2xl hover:text-primary p-2 -m-2 w-full text-left flex flex-row items-center">
|
||||
@ -3574,7 +3574,7 @@
|
||||
|
||||
<!-- MODELS ZOO -->
|
||||
<div
|
||||
class="flex flex-col mb-2 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
class="flex flex-col mb-2 rounded-lg panels-color hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
<div class="flex flex-row p-3">
|
||||
<button @click.stop="modelsZooToggleCollapse()"
|
||||
class="text-2xl hover:text-primary p-2 -m-2 w-full text-left flex items-center">
|
||||
@ -3815,7 +3815,7 @@
|
||||
<!-- ADD MODELS -->
|
||||
<!-- PERSONALITY ZOO -->
|
||||
<div
|
||||
class="flex flex-col mb-2 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
class="flex flex-col mb-2 rounded-lg panels-color hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
<div class="flex flex-row p-3 items-center">
|
||||
<button @click.stop="pzc_collapsed = !pzc_collapsed"
|
||||
class="text-2xl hover:text-primary p-2 -m-2 text-left w-full flex items-center">
|
||||
@ -3992,7 +3992,7 @@
|
||||
|
||||
<!-- MODEL CONFIGURATION -->
|
||||
<div
|
||||
class="flex flex-col mb-2 p-3 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
class="flex flex-col mb-2 p-3 rounded-lg panels-color hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
|
||||
<div class="flex flex-row">
|
||||
<button @click.stop="mc_collapsed = !mc_collapsed"
|
||||
class="text-2xl hover:text-primary p-2 -m-2 w-full text-left flex items-center">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user