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 debugger icons

Browse Source
This commit is contained in:
LenAnderson
2024-07-12 13:33:02 -04:00
parent 067a4e0525
commit 9446c487e9
7 changed files with 718 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
public/scripts/extensions/quick-reply/html/qrEditor.html
View File

@@ -141,16 +141,16 @@
<div id="qr--modal-debugButtons">
<div title="Resume" id="qr--modal-resume" class="qr--modal-debugButton menu_button">
<span class="qr--glyph">▷</span>
<!-- <span class="qr--glyph">▷</span> -->
</div>
<div title="Step Over" id="qr--modal-step" class="qr--modal-debugButton qr--glyph-combo menu_button">
<span class="qr--glyph">↷</span><span class="qr--glyph">▪</span>
<!-- <span class="qr--glyph">↷</span><span class="qr--glyph">▪</span> -->
</div>
<div title="Step Into" id="qr--modal-stepInto" class="qr--modal-debugButton qr--glyph-combo menu_button">
<span class="qr--glyph">↓</span><span class="qr--glyph">▪</span>
<!-- <span class="qr--glyph">↓</span><span class="qr--glyph">▪</span> -->
</div>
<div title="Step Out" id="qr--modal-stepOut" class="qr--modal-debugButton qr--glyph-combo menu_button">
<span class="qr--glyph">↑</span><span class="qr--glyph">▪</span>
<!-- <span class="qr--glyph">↑</span><span class="qr--glyph">▪</span> -->
</div>
</div>
<div id="qr--modal-debugState"></div>

26
public/scripts/extensions/quick-reply/style.css
View File

@@ -548,15 +548,27 @@
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugButtons .qr--modal-debugButton {
aspect-ratio: 1.25 / 1;
width: 2.25em;
position: relative;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugButtons .qr--modal-debugButton.qr--glyph-combo {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr 1fr;
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugButtons .qr--modal-debugButton:after {
content: '';
position: absolute;
inset: 3px;
background-color: var(--SmartThemeBodyColor);
mask-size: contain;
mask-position: center;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugButtons .qr--modal-debugButton.qr--glyph-combo .qr--glyph {
grid-column: 1;
line-height: 0.8;
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugButtons .qr--modal-debugButton#qr--modal-resume:after {
mask-image: url('/img/step-resume.svg');
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugButtons .qr--modal-debugButton#qr--modal-step:after {
mask-image: url('/img/step-over.svg');
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugButtons .qr--modal-debugButton#qr--modal-stepInto:after {
mask-image: url('/img/step-into.svg');
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugButtons .qr--modal-debugButton#qr--modal-stepOut:after {
mask-image: url('/img/step-out.svg');
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-executeProgress {
--prog: 0;

39
public/scripts/extensions/quick-reply/style.less
View File

@@ -631,15 +631,36 @@
.qr--modal-debugButton {
aspect-ratio: 1.25 / 1;
width: 2.25em;
&.qr--glyph-combo {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr 1fr;
.qr--glyph {
grid-column: 1;
line-height: 0.8;
}
}
position: relative;
&:after {
content: '';
position: absolute;
inset: 3px;
background-color: var(--SmartThemeBodyColor);
mask-size: contain;
mask-position: center;
}
&#qr--modal-resume:after {
mask-image: url('/img/step-resume.svg');
}
&#qr--modal-step:after {
mask-image: url('/img/step-over.svg');
}
&#qr--modal-stepInto:after {
mask-image: url('/img/step-into.svg');
}
&#qr--modal-stepOut:after {
mask-image: url('/img/step-out.svg');
}
// &.qr--glyph-combo {
// display: grid;
// grid-template-columns: 1fr;
// grid-template-rows: 1fr 1fr;
// .qr--glyph {
// grid-column: 1;
// line-height: 0.8;
// }
// }
}
}