enhanced ui and fixed scripts

This commit is contained in:
Saifeddine ALOUI 2024-09-05 22:24:33 +02:00
parent c360ae5634
commit 25b66aabd9
11 changed files with 261 additions and 223 deletions

View File

@ -104,9 +104,6 @@ if [ -d "lollms-webui" ]; then
cd lollms_core
pip install -e .
cd ../..
cd utilities/pipmaster
pip install -e .
cd ../..
else
git clone --depth 1 --recurse-submodules "$REPO_URL"
@ -116,6 +113,8 @@ else
cd ../..
fi
cd lollms-webui
# Loop through each "git+" requirement and uninstall it (workaround for inconsistent git package updating)
while IFS= read -r requirement; do
if echo "$requirement" | grep -q "git+"; then

View File

@ -165,11 +165,9 @@ else
git submodule update --init --recursive
cd $INSTALL_DIR/lollms-webui/lollms_core
pip install -e .
cd $INSTALL_DIR/lollms-webui/utilities/pipmaster
pip install -e .
cd $INSTALL_DIR/lollms-webui || exit 1
fi
cd $INSTALL_DIR/lollms-webui || exit 1
# Loop through each "git+" requirement and uninstall it (workaround for inconsistent git package updating)
while IFS= read -r requirement; do

View File

@ -96,7 +96,7 @@ git clone --depth 1 --recurse-submodules https://github.com/ParisNeo/lollms-web
git submodule update --init --recursive
cd lollms-webui\lollms_core
pip install -e .
cd ..\..
cd ..
pip install -r requirements.txt

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

4
web/dist/index.html vendored
View File

@ -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-dad20e5b.js"></script>
<link rel="stylesheet" href="/assets/index-45552536.css">
<script type="module" crossorigin src="/assets/index-f5bbacab.js"></script>
<link rel="stylesheet" href="/assets/index-27866bc8.css">
</head>
<body>
<div id="app"></div>

View File

@ -26,27 +26,32 @@
scrollbar-width: none;
}
}
/* Custom font */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap');
.display-none {
@apply hidden;
}
h1 {
@apply text-5xl md:text-6xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-blue-700 dark:from-blue-400 dark:to-blue-500;
}
h1 { @apply text-4xl md:text-5xl font-bold text-gray-900 dark:text-gray-100 mb-6; }
h2 {
@apply text-3xl font-semibold text-gray-800 dark:text-gray-200;
@apply text-3xl font-semibold text-gray-800 dark:text-gray-200 mb-4;
}
h3 {
@apply text-2xl font-semibold text-gray-700 dark:text-gray-300;
@apply text-2xl font-medium text-gray-700 dark:text-gray-300 mb-3;
}
h4 {
@apply text-xl font-semibold italic text-gray-600 dark:text-gray-400;
@apply text-xl font-medium text-gray-600 dark:text-gray-400 mb-2;
}
/* Optional: Add a subtle bottom border to headers for added distinction */
h1, h2, h3, h4 {
@apply border-b border-gray-200 dark:border-gray-700 pb-2;
}
p {
@apply text-base text-gray-600 dark:text-gray-300 break-words;
}
@ -105,20 +110,44 @@ textarea, input, select {
.chatbox-color {
@apply bg-gradient-to-br from-blue-200 to-blue-300 dark:from-blue-800 dark:to-blue-900
}
.message {
@apply relative w-full rounded-lg m-2 shadow-lg border-2 border-transparent
flex flex-col flex-grow flex-wrap overflow-visible p-4 pb-2;
}
/* Base message styling */
.message { @apply relative w-full rounded-lg m-2 shadow-lg border border-gray-200 dark:border-gray-700 flex flex-col flex-grow flex-wrap overflow-visible p-5 pb-3 text-lg; /* Increased from text-base to text-lg */ }
.message:hover {
@apply border-primary border-solid;
@apply border-blue-400 dark:border-blue-500;
}
/* Light theme */
.message {
@apply bg-blue-200 text-gray-800;
}
/* Dark theme */
.dark .message {
@apply bg-blue-800 text-gray-200;
}
/* Alternating backgrounds for better distinction */
.message:nth-child(even) {
@apply bg-gradient-to-br from-blue-200 to-blue-300 dark:from-blue-800 dark:to-blue-800;
@apply bg-blue-50 dark:bg-blue-700;
}
.message:nth-child(odd) {
@apply bg-gradient-to-br from-blue-300 to-blue-400 dark:from-blue-800 dark:to-blue-900;
@apply bg-blue-200 dark:bg-blue-800;
}
/* Additional styling for more professional look */
.message-header {
@apply text-xl font-semibold mb-2; /* Increased from text-lg to text-xl */
}
.message-content {
@apply text-lg leading-relaxed; /* Increased from text-base to text-lg */
}
/* Body styling */
body {
@apply bg-gradient-to-br from-gray-100 to-gray-200 dark:from-gray-800 dark:to-gray-900 min-h-screen text-base; /* Added text-base for default body text */
}
.discussion{
@ -129,10 +158,6 @@ textarea, input, select {
}
body {
@apply bg-gradient-to-br from-blue-100 to-purple-100 dark:from-blue-900 dark:to-purple-900 min-h-screen;
}
.bg-gradient-welcome {
@apply bg-gradient-to-br from-blue-100 to-purple-100 dark:from-blue-900 dark:to-purple-900;
}
@ -195,37 +220,51 @@ body {
.text-shadow-custom {
text-shadow: 1px 1px 0px white, -1px -1px 0px white, 1px -1px 0px white, -1px 1px 0px white;
}
.menu-item {
@apply mb-2 px-4 py-2 text-red-600 dark:text-red-300 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;
@apply mb-2 px-4 py-2 text-green-600 dark:text-green-300 font-bold text-lg transition-all duration-300 ease-in-out;
@apply hover:text-red-400 hover:dark:text-red-200 hover:transform hover:-translate-y-1;
}
.menu-item.active-link {
@apply rounded-t-md border-red-500 text-shadow-custom text-red-600 font-bold text-lg transition-all duration-300 ease-in-out scale-105;
@apply hover:text-red-600 hover:dark:text-gray-50 hover:transform hover:-translate-y-1;
@apply hover:text-red-700 hover:dark:text-red-300 hover:transform hover:-translate-y-1;
/* Glow effect on text */
text-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
text-shadow: 0 0 10px rgba(255, 100, 100, 0.5);
}
.menu-item.active-link::after {
.menu-item.active-link::before {
content: '';
position: absolute;
bottom: -5px;
left: 0;
width: 100%;
height: 5px;
/* Lightsaber colors */
z-index: 10000;
background: linear-gradient(to right, #00ff00, #00ff00, #00ff00); /* Normal mode */
background: linear-gradient(to right, #ff3b3b, #ff7b7b, #ff3b3b); /* Strawberry colors */
border-radius: 10px;
animation: lightsaber 2s infinite;
animation: shimmer 2s infinite;
}
.dark .menu-item.active-link::after {
background: linear-gradient(to right, #ff0000, #ff0000, #ff0000); /* Dark mode */
.dark .menu-item.active-link::before {
background: linear-gradient(to right, #8b0000, #ff0000, #8b0000); /* Dark mode strawberry colors */
}
@keyframes shimmer {
0% { background-position: -100% 0; }
100% { background-position: 100% 0; }
}
@keyframes bounce {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-5px); }
}
.strawberry-emoji {
display: inline-block;
margin-left: 5px;
animation: bounce 2s infinite;
}
@keyframes lightsaber {
0% {
transform: scale(1);

View File

@ -11,11 +11,13 @@
ref="menuItems"
>
{{ link.text }}
<span v-if="isRouteActive(link.route)" class="strawberry-emoji">🍓</span>
</RouterLink>
</nav>
</div>
</template>
<script setup>
import { computed, ref, onMounted, watch } from 'vue';
import { RouterLink, useRoute } from 'vue-router';

View File

@ -9,10 +9,10 @@
alt="Logo" title="LoLLMS WebUI">
</div>
<div class="flex flex-col justify-center">
<h1 class="text-2xl md:text-2xl font-bold text-red-600 mb-2"
<div class="text-2xl md:text-2xl font-bold text-red-600 mb-2"
style="text-shadow: 2px 2px 0px white, -2px -2px 0px white, 2px -2px 0px white, -2px 2px 0px white;">
LoLLMS
</h1>
</div>
<p class="text-gray-400 text-sm">One tool to rule them all</p>
</div>
</RouterLink>

View File

@ -20,10 +20,10 @@
<div class="flex flex-col items-center text-center max-w-4xl w-full px-4 relative z-10">
<div class="mb-8 w-full">
<h1 class="text-6xl md:text-7xl font-bold text-red-600 mb-2"
<div class="text-6xl md:text-7xl font-bold text-red-600 mb-2"
style="text-shadow: 2px 2px 0px white, -2px -2px 0px white, 2px -2px 0px white, -2px 2px 0px white;">
LoLLMS
</h1>
</div>
<p class="text-2xl text-gray-600 dark:text-gray-300 italic">
One tool to rule them all
</p>

@ -1 +1 @@
Subproject commit 0c9bd03d0e007f2c0b87a7da0810b6572bd170ed
Subproject commit 46303455f98ff5f0ef1baa4f4bd2347c939b5019