rixty/SillyTavern
1
0
Fork 0
mirror of https://github.com/SillyTavern/SillyTavern.git synced 2025-06-05 21:59:27 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add rounded square avatars theme option

Browse Source
This commit is contained in:
Cohee
2025-05-22 00:39:00 +03:00
parent fdc9a2a93b
commit d336ea7a13
4 changed files with 9 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
public/css/toggle-dependent.css
View File

@ -45,6 +45,11 @@ body.square-avatars .avatar img {
border-radius: var(--avatar-base-border-radius) !important;
}
body.rounded-avatars .avatar,
body.rounded-avatars .avatar img {
border-radius: var(--avatar-base-border-radius-rounded) !important;
}
/*char list grid mode*/
body.charListGrid #rm_print_characters_block {

1
public/index.html
View File

@ -4348,6 +4348,7 @@
<select id="avatar_style" class="widthNatural flex1 margin0 text_pole">
<option value="0" data-i18n="Circle">Circle</option>
<option value="2" data-i18n="Square">Square</option>
<option value="3" data-i18n="Rounded">Rounded</option>
<option value="1" data-i18n="Rectangle">Rectangle</option>
</select>
</div>

2
public/scripts/power-user.js
View File

@ -96,6 +96,7 @@ const avatar_styles = {
ROUND: 0,
RECTANGULAR: 1,
SQUARE: 2,
ROUNDED: 3,
};
export const chat_styles = {
@ -1021,6 +1022,7 @@ function applyNoShadows() {
function applyAvatarStyle() {
$('body').toggleClass('big-avatars', power_user.avatar_style === avatar_styles.RECTANGULAR);
$('body').toggleClass('square-avatars', power_user.avatar_style === avatar_styles.SQUARE);
$('body').toggleClass('rounded-avatars', power_user.avatar_style === avatar_styles.ROUNDED);
$('#avatar_style').val(power_user.avatar_style).prop('selected', true);
}

1
public/style.css
View File

@ -117,6 +117,7 @@
--avatar-base-width: 50px;
--avatar-base-border-radius: 2px;
--avatar-base-border-radius-round: 50%;
--avatar-base-border-radius-rounded: 10px;
--inline-avatar-small-factor: 0.6;
--animation-duration: 125ms;