Skip to content

Commit aceebf8

Browse files
mudlermudler
committed
chore(ui): fix slider overflow
Signed-off-by: Ettore Di Giacinto <[email protected]>
1 parent 71ed031 commit aceebf8

File tree

1 file changed

+22
-22
lines changed

1 file changed

+22
-22
lines changed

‎core/http/views/chat.html‎

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -901,27 +901,27 @@ <h2 class="text-xs font-semibold text-[#94A3B8] uppercase tracking-wide">Chats</
901901
<i :class="showParamsForm ? 'fa-chevron-up' : 'fa-chevron-down'" class="fa-solid text-[10px]"></i>
902902
</button>
903903

904-
<div x-show="showParamsForm" class="p-2 bg-[#1E293B] border border-[#38BDF8]/20 rounded pl-4 border-l-2 border-[#1E293B]">
904+
<div x-show="showParamsForm" class="p-2 bg-[#1E293B] border border-[#38BDF8]/20 rounded pl-4 border-l-2 border-[#1E293B] overflow-hidden">
905905
<div class="flex flex-col space-y-3">
906906
<!-- Temperature -->
907-
<div class="space-y-1">
908-
<div class="flex items-center justify-between">
909-
<label class="text-xs text-[#94A3B8]">Temperature</label>
910-
<span class="text-xs text-[#E5E7EB] font-medium" x-text="($store.chat.activeChat()?.temperature !== null && $store.chat.activeChat()?.temperature !== undefined) ? $store.chat.activeChat().temperature.toFixed(2) : 'Default'"></span>
907+
<div class="space-y-1 min-w-0">
908+
<div class="flex items-center justify-between gap-2">
909+
<label class="text-xs text-[#94A3B8] flex-shrink-0">Temperature</label>
910+
<span class="text-xs text-[#E5E7EB] font-medium flex-shrink-0" x-text="($store.chat.activeChat()?.temperature !== null && $store.chat.activeChat()?.temperature !== undefined) ? $store.chat.activeChat().temperature.toFixed(2) : 'Default'"></span>
911911
</div>
912-
<div class="flex items-center gap-2">
912+
<div class="flex items-center gap-2 min-w-0">
913913
<input
914914
type="range"
915915
min="0"
916916
max="2"
917917
step="0.01"
918-
class="flex-1 h-1.5 bg-[#101827] rounded-lg appearance-none cursor-pointer accent-[#38BDF8]"
918+
class="flex-1 min-w-0 h-1.5 bg-[#101827] rounded-lg appearance-none cursor-pointer accent-[#38BDF8]"
919919
:value="$store.chat.activeChat()?.temperature ?? 1.0"
920920
@input="if ($store.chat.activeChat()) { $store.chat.activeChat().temperature = parseFloat($event.target.value); $store.chat.activeChat().updatedAt = Date.now(); autoSaveChats(); }"
921921
/>
922922
<button
923923
@click="if ($store.chat.activeChat()) { $store.chat.activeChat().temperature = null; $store.chat.activeChat().updatedAt = Date.now(); autoSaveChats(); }"
924-
class="text-[#94A3B8] hover:text-[#38BDF8] transition-colors text-xs px-2 py-1"
924+
class="text-[#94A3B8] hover:text-[#38BDF8] transition-colors text-xs px-2 py-1 flex-shrink-0"
925925
title="Reset to default"
926926
x-show="$store.chat.activeChat()?.temperature !== null && $store.chat.activeChat()?.temperature !== undefined"
927927
>
@@ -932,24 +932,24 @@ <h2 class="text-xs font-semibold text-[#94A3B8] uppercase tracking-wide">Chats</
932932
</div>
933933

934934
<!-- Top P -->
935-
<div class="space-y-1">
936-
<div class="flex items-center justify-between">
937-
<label class="text-xs text-[#94A3B8]">Top P</label>
938-
<span class="text-xs text-[#E5E7EB] font-medium" x-text="($store.chat.activeChat()?.topP !== null && $store.chat.activeChat()?.topP !== undefined) ? $store.chat.activeChat().topP.toFixed(2) : 'Default'"></span>
935+
<div class="space-y-1 min-w-0">
936+
<div class="flex items-center justify-between gap-2">
937+
<label class="text-xs text-[#94A3B8] flex-shrink-0">Top P</label>
938+
<span class="text-xs text-[#E5E7EB] font-medium flex-shrink-0" x-text="($store.chat.activeChat()?.topP !== null && $store.chat.activeChat()?.topP !== undefined) ? $store.chat.activeChat().topP.toFixed(2) : 'Default'"></span>
939939
</div>
940-
<div class="flex items-center gap-2">
940+
<div class="flex items-center gap-2 min-w-0">
941941
<input
942942
type="range"
943943
min="0"
944944
max="1"
945945
step="0.01"
946-
class="flex-1 h-1.5 bg-[#101827] rounded-lg appearance-none cursor-pointer accent-[#38BDF8]"
946+
class="flex-1 min-w-0 h-1.5 bg-[#101827] rounded-lg appearance-none cursor-pointer accent-[#38BDF8]"
947947
:value="$store.chat.activeChat()?.topP ?? 0.9"
948948
@input="if ($store.chat.activeChat()) { $store.chat.activeChat().topP = parseFloat($event.target.value); $store.chat.activeChat().updatedAt = Date.now(); autoSaveChats(); }"
949949
/>
950950
<button
951951
@click="if ($store.chat.activeChat()) { $store.chat.activeChat().topP = null; $store.chat.activeChat().updatedAt = Date.now(); autoSaveChats(); }"
952-
class="text-[#94A3B8] hover:text-[#38BDF8] transition-colors text-xs px-2 py-1"
952+
class="text-[#94A3B8] hover:text-[#38BDF8] transition-colors text-xs px-2 py-1 flex-shrink-0"
953953
title="Reset to default"
954954
x-show="$store.chat.activeChat()?.topP !== null && $store.chat.activeChat()?.topP !== undefined"
955955
>
@@ -960,24 +960,24 @@ <h2 class="text-xs font-semibold text-[#94A3B8] uppercase tracking-wide">Chats</
960960
</div>
961961

962962
<!-- Top K -->
963-
<div class="space-y-1">
964-
<div class="flex items-center justify-between">
965-
<label class="text-xs text-[#94A3B8]">Top K</label>
966-
<span class="text-xs text-[#E5E7EB] font-medium" x-text="($store.chat.activeChat()?.topK !== null && $store.chat.activeChat()?.topK !== undefined) ? $store.chat.activeChat().topK : 'Default'"></span>
963+
<div class="space-y-1 min-w-0">
964+
<div class="flex items-center justify-between gap-2">
965+
<label class="text-xs text-[#94A3B8] flex-shrink-0">Top K</label>
966+
<span class="text-xs text-[#E5E7EB] font-medium flex-shrink-0" x-text="($store.chat.activeChat()?.topK !== null && $store.chat.activeChat()?.topK !== undefined) ? $store.chat.activeChat().topK : 'Default'"></span>
967967
</div>
968-
<div class="flex items-center gap-2">
968+
<div class="flex items-center gap-2 min-w-0">
969969
<input
970970
type="range"
971971
min="0"
972972
max="100"
973973
step="1"
974-
class="flex-1 h-1.5 bg-[#101827] rounded-lg appearance-none cursor-pointer accent-[#38BDF8]"
974+
class="flex-1 min-w-0 h-1.5 bg-[#101827] rounded-lg appearance-none cursor-pointer accent-[#38BDF8]"
975975
:value="$store.chat.activeChat()?.topK ?? 40"
976976
@input="if ($store.chat.activeChat()) { $store.chat.activeChat().topK = parseInt($event.target.value); $store.chat.activeChat().updatedAt = Date.now(); autoSaveChats(); }"
977977
/>
978978
<button
979979
@click="if ($store.chat.activeChat()) { $store.chat.activeChat().topK = null; $store.chat.activeChat().updatedAt = Date.now(); autoSaveChats(); }"
980-
class="text-[#94A3B8] hover:text-[#38BDF8] transition-colors text-xs px-2 py-1"
980+
class="text-[#94A3B8] hover:text-[#38BDF8] transition-colors text-xs px-2 py-1 flex-shrink-0"
981981
title="Reset to default"
982982
x-show="$store.chat.activeChat()?.topK !== null && $store.chat.activeChat()?.topK !== undefined"
983983
>

0 commit comments

Comments
 (0)