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

fix floating details position on left

Browse Source
This commit is contained in:
LenAnderson
2024-04-23 14:19:03 -04:00
parent 2f53455094
commit 5da8b177e6
2 changed files with 18 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
public/scripts/slash-commands/SlashCommandAutoComplete.js
View File

@ -708,11 +708,14 @@ export class SlashCommandAutoComplete {
if (left < window.innerWidth / 4) { if (left < window.innerWidth / 4) {
// if cursor is in left part of screen, show details on right of list // if cursor is in left part of screen, show details on right of list
this.detailsWrap.classList.add('right'); this.detailsWrap.classList.add('right');
this.detailsWrap.classList.remove('left');
} else { } else {
// if cursor is in right part of screen, show details on left of list // if cursor is in right part of screen, show details on left of list
this.detailsWrap.classList.remove('right'); this.detailsWrap.classList.remove('right');
this.detailsWrap.classList.add('left');
} }
} else { } else {
this.detailsWrap.classList.remove('left');
this.detailsWrap.classList.remove('right'); this.detailsWrap.classList.remove('right');
this.detailsWrap.classList.add('full'); this.detailsWrap.classList.add('full');
} }

21
public/style.css
View File

@ -1160,16 +1160,24 @@ select {
flex-direction: row; flex-direction: row;
left: 0; left: 0;
right: 0; right: 0;
&.right:before {
flex: 0 0 calc(var(--targetOffset) * 1px + 50vw);
}
&:before {
flex: 0 0 calc(var(--targetOffset) * 1px - 25vw);
}
.slashCommandAutoComplete-details { .slashCommandAutoComplete-details {
max-height: unset; max-height: unset;
width: 25vw; width: 25vw;
} }
&.left {
&:before {
flex: 0 1 calc(var(--targetOffset) * 1px - 25vw);
}
&:after {
flex: 1 0 auto;
width: 50vw;
}
}
&.right {
&:before {
flex: 0 0 calc(var(--targetOffset) * 1px + 50vw);
}
}
&.full { &.full {
&:before { &:before {
content: ""; content: "";
@ -1224,6 +1232,7 @@ select {
display: grid; display: grid;
grid-template-columns: 0fr auto minmax(50%, 1fr); grid-template-columns: 0fr auto minmax(50%, 1fr);
align-items: baseline; align-items: baseline;
max-height: calc(95vh - var(--bottom));
/* gap: 0.5em; */ /* gap: 0.5em; */
> .item { > .item {
cursor: pointer; cursor: pointer;