Files
SillyTavern/public/css/welcome.css
T
Copilot ff10249ab5 Add configurable welcome screen recent chats, fix pin loss on rename, and add popup number input validation (#5436)
* Add configurable recent chats settings and fix pin loss on chat rename

- Add gear icon button to welcome screen header for settings
- Settings popup with Max recent chats (default: 15) and Collapsed recent chats (default: 3) options
- Settings stored in accountStorage as 'recentChatsSettings'
- Add PinnedChatsManager.rename() to migrate pin state when chats are renamed
- Call rename() from both character and group chat rename functions

Agent-Logs-Url: https://github.com/SillyTavern/SillyTavern/sessions/99fa84c4-a82b-4253-96ff-a0621fb63f5c

Co-authored-by: Cohee1207 <18619528+Cohee1207@users.noreply.github.com>

* Fix pin rename: use file_name with .jsonl extension to match stored pin keys

The data-file attribute contains chat_name (without .jsonl), but PinnedChatsManager
stores keys using file_name (with .jsonl). Append .jsonl to both old and new names
when calling PinnedChatsManager.rename() in character and group chat rename functions.

Agent-Logs-Url: https://github.com/SillyTavern/SillyTavern/sessions/c8e4f720-1d0b-49ef-b57b-ba9d85c42d4f

Co-authored-by: Cohee1207 <18619528+Cohee1207@users.noreply.github.com>

* Refactor to support number inputs

* Restore package-lock

* Use clamp() from utils.js instead of manual Math.min/Math.max

Agent-Logs-Url: https://github.com/SillyTavern/SillyTavern/sessions/1669884c-1bd3-4b60-808d-5610f24838e6

Co-authored-by: Cohee1207 <18619528+Cohee1207@users.noreply.github.com>

* Revert unintended package-lock.json changes

Agent-Logs-Url: https://github.com/SillyTavern/SillyTavern/sessions/1669884c-1bd3-4b60-808d-5610f24838e6

Co-authored-by: Cohee1207 <18619528+Cohee1207@users.noreply.github.com>

* Use input values instead of magic numbers

* Add auto-clamping on number inputs in popups and range placeholders in welcome-screen settings

Agent-Logs-Url: https://github.com/SillyTavern/SillyTavern/sessions/9af8ad07-77bc-46db-9ec6-0030fecf0f8d

Co-authored-by: Cohee1207 <18619528+Cohee1207@users.noreply.github.com>

* Use constants for min/max chat limits to avoid hardcoded duplication in tooltips

Agent-Logs-Url: https://github.com/SillyTavern/SillyTavern/sessions/9af8ad07-77bc-46db-9ec6-0030fecf0f8d

Co-authored-by: Cohee1207 <18619528+Cohee1207@users.noreply.github.com>

* Improve input validation by using Number.isFinite for min/max values in Popup class

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: Cohee1207 <18619528+Cohee1207@users.noreply.github.com>
2026-04-10 21:30:43 +03:00

240 lines
5.2 KiB
CSS

#chat .mes[type="assistant_message"] .mes_button {
display: none;
}
.welcomePanel {
display: flex;
flex-direction: column;
gap: 5px;
padding: 10px;
width: 100%;
}
.welcomePanel:has(.showMoreChats) {
padding-bottom: 5px;
}
.welcomePanel.recentHidden .welcomeRecent,
.welcomePanel.recentHidden .recentChatsTitle,
.welcomePanel.recentHidden .hideRecentChats,
.welcomePanel.recentHidden .recentChatsSettings,
.welcomePanel:not(.recentHidden) .showRecentChats {
display: none;
}
body.bubblechat .welcomePanel {
border-radius: 10px;
background-color: var(--SmartThemeBotMesBlurTintColor);
border: 1px solid var(--SmartThemeBorderColor);
margin-bottom: 5px;
}
body.hideChatAvatars .welcomePanel .recentChatList .recentChat .avatar {
display: none;
}
.welcomePanel .welcomeHeader {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
}
.welcomePanel .recentChatsTitle {
flex-grow: 1;
font-size: calc(var(--mainFontSize) * 1.15);
font-weight: 600;
}
.welcomePanel .welcomeHeaderTitle {
margin: 0;
flex-grow: 1;
display: flex;
flex-direction: row;
align-items: center;
gap: 10px;
}
.welcomePanel .welcomeHeaderVersionDisplay {
font-size: calc(var(--mainFontSize) * 1.3);
font-weight: 600;
flex-grow: 1;
}
.welcomePanel .welcomeHeaderLogo {
width: 30px;
height: 30px;
}
.welcomePanel .welcomeShortcuts {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 5px;
}
.welcomePanel .welcomeShortcuts .welcomeShortcutsSeparator {
margin: 0 2px;
color: var(--SmartThemeBorderColor);
font-size: calc(var(--mainFontSize) * 1.1);
}
.welcomeRecent .recentChatList {
display: flex;
flex-direction: column;
width: 100%;
gap: 2px;
}
.welcomeRecent .welcomePanelLoader {
display: flex;
justify-content: center;
align-items: center;
flex: 1;
width: 100%;
height: 100%;
position: absolute;
}
.welcomePanel .recentChatList .noRecentChat {
display: flex;
flex-direction: row;
justify-content: center;
align-items: baseline;
gap: 5px;
padding: 10px;
}
.welcomeRecent .recentChatList .recentChat {
display: flex;
flex-direction: row;
align-items: center;
padding: 5px 10px;
border-radius: 10px;
cursor: pointer;
gap: 10px;
border: 1px solid var(--SmartThemeBorderColor);
position: relative;
}
.welcomeRecent .recentChatList .recentChat .avatar {
flex: 0;
align-self: center;
}
.welcomeRecent .recentChatList .recentChat:hover {
background-color: var(--white30a);
}
.welcomeRecent .recentChatList .recentChat .recentChatInfo {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
flex-grow: 1;
overflow: hidden;
justify-content: center;
align-self: flex-start;
}
.welcomeRecent .recentChatList .recentChat .chatNameContainer {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: baseline;
font-size: calc(var(--mainFontSize) * 1);
gap: 5px;
}
.welcomeRecent .recentChatList .recentChat .chatNameContainer .chatName {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
flex: 1;
}
.welcomeRecent .recentChatList .recentChat .chatActions {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 5px;
}
.welcomeRecent .recentChatList .recentChat .chatActions button {
margin: 0;
font-size: 0.8em;
cursor: pointer;
}
.welcomeRecent .recentChatList .recentChat .chatMessageContainer {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
gap: 5px;
font-size: calc(var(--mainFontSize) * 0.85);
}
.welcomeRecent .recentChatList .recentChat .chatMessageContainer .chatMessage {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
line-clamp: 2;
overflow: hidden;
}
body.big-avatars .welcomeRecent .recentChatList .recentChat .chatMessageContainer .chatMessage {
-webkit-line-clamp: 4;
line-clamp: 4;
}
.welcomeRecent .recentChatList .recentChat .chatStats {
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: baseline;
align-self: flex-start;
gap: 5px;
}
.welcomeRecent .recentChatList .recentChat .chatStats .counterBlock {
display: flex;
flex-direction: row;
align-items: baseline;
gap: 5px;
}
.welcomeRecent .recentChatList .recentChat .chatStats .counterBlock::after {
content: "|";
color: var(--SmartThemeBorderColor);
font-size: calc(var(--mainFontSize) * 0.95);
}
.welcomeRecent .recentChatList .recentChat.hidden {
display: none;
}
.welcomeRecent .recentChatList .showMoreChats {
align-self: center;
}
.welcomeRecent .recentChatList .showMoreChats.rotated {
transform: rotate(180deg);
}
.welcomeRecent .recentChatList .recentChat .recentChatPinned {
top: 1px;
left: 1px;
position: absolute;
opacity: 0.8;
color: var(--SmartThemeQuoteColor);
}
@media screen and (max-width: 1000px) {
.welcomePanel .welcomeShortcuts a span {
display: none;
}
}