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

Better Random Story placement

Browse Source
This commit is contained in:
ebolam
2022-08-15 18:56:39 -04:00
parent 594789bdfa
commit 8cd14713f9
2 changed files with 29 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
static/koboldai.css
View File

@@ -102,6 +102,8 @@
z-index: 2; z-index: 2;
border-bottom-color: #FFF; border-bottom-color: #FFF;
} }
.tabrow:before { .tabrow:before {
position: absolute; position: absolute;
content: " "; content: " ";
@@ -166,7 +168,7 @@
grid-template-areas: "label value" grid-template-areas: "label value"
"item item" "item item"
"minlabel maxlabel"; "minlabel maxlabel";
grid-template-rows: 20px 25px 10px; grid-template-rows: 20px 25px 15px;
grid-template-columns: 160px 40px; grid-template-columns: 160px 40px;
row-gap: 0.2em; row-gap: 0.2em;
background-color: var(--setting_background); background-color: var(--setting_background);
@@ -190,12 +192,16 @@
.setting_minlabel { .setting_minlabel {
grid-area: minlabel; grid-area: minlabel;
overflow: hidden; overflow: hidden;
padding: 5px;
padding-top: 0px;
font-size: 0.8em; font-size: 0.8em;
} }
.setting_maxlabel { .setting_maxlabel {
grid-area: maxlabel; grid-area: maxlabel;
overflow: hidden; overflow: hidden;
padding: 5px;
padding-top: 0px;
text-align: right; text-align: right;
font-size: 0.8em; font-size: 0.8em;
} }
@@ -203,11 +209,15 @@
.setting_label { .setting_label {
grid-area: label; grid-area: label;
overflow: hidden; overflow: hidden;
padding: 5px;
padding-top: 0px;
} }
.setting_value { .setting_value {
text-align: right; text-align: right;
grid-area: value; grid-area: value;
padding: 5px;
padding-top: 0px;
background-color: inherit; background-color: inherit;
color: inherit; color: inherit;
border: none; border: none;
@@ -319,7 +329,7 @@
height: 100%; height: 100%;
width: var(--flyout_menu_closed_width); width: var(--flyout_menu_closed_width);
position: fixed; position: fixed;
z-index: 1; z-index: 3;
top: 0; top: 0;
left: 0; left: 0;
background-color: var(--flyout_background); background-color: var(--flyout_background);
@@ -332,7 +342,7 @@
height: 100%; height: 100%;
width: var(--flyout_menu_width); width: var(--flyout_menu_width);
position: fixed; position: fixed;
z-index: 1; z-index: 2;
top: 0; top: 0;
left: 0; left: 0;
background-color: var(--flyout_background); background-color: var(--flyout_background);
@@ -511,7 +521,7 @@
height: 100%; height: 100%;
width: 0; width: 0;
position: fixed; position: fixed;
z-index: 1; z-index: 3;
top: 0; top: 0;
right: 0; right: 0;
background-color: var(--flyout_background); background-color: var(--flyout_background);

25
templates/index_new.html
View File

@@ -45,20 +45,25 @@
<div id="Select Options" class="sequence_area"></div> <div id="Select Options" class="sequence_area"></div>
<!------------ Theme Area---------------------> <!------------ Theme Area--------------------->
<div class="themerow" id="themerow"> <div class="themerow" id="themerow">
<h4>If you want to generate a random prompt, insert a theme here:</h4> <div class="tabrow nomenu_icon">
<input type="text" autocomplete="off" style="width: 100%;" id="themetext" placeholder="Theme for Random Story" oninput='if (this.value != "") { <span class="prompt_menu selected" id="prompt_menu_random" onclick="this.classList.add('selected');
document.getElementById("input_text").disabled = true; document.getElementById('prompt_menu_normal').classList.remove('selected');
} else { document.getElementById('random_game_prompt').classList.add('hidden');
document.getElementById("input_text").disabled = false; document.getElementById('input_text').classList.remove('hidden');">Prompt</span>
}'/> <span class="prompt_menu" id="prompt_menu_normal" onclick="this.classList.add('selected');
<h4>If you want to write your prompt, insert it here:</h4> document.getElementById('prompt_menu_random').classList.remove('selected');
document.getElementById('random_game_prompt').classList.remove('hidden');
document.getElementById('input_text').classList.add('hidden');">Random Prompt</span>
</div>
</div> </div>
<!------------ Input Area---------------------> <!------------ Input Area--------------------->
<div class="inputrow" id="inputrow_container"> <div class="inputrow" id="inputrow_container">
<div id="random_game_prompt" class="hidden">
<input type="text" autocomplete="off" style="width: 100%;" id="themetext" placeholder="Theme for Random Story" oninput='if (this.value != "") {
document.getElementById("input_text").value = "";'/>
</div>
<textarea autocomplete="off" row=5 id="input_text" placeholder="Enter Prompt Here" oninput='if (this.value != "") { <textarea autocomplete="off" row=5 id="input_text" placeholder="Enter Prompt Here" oninput='if (this.value != "") {
document.getElementById("themetext").disabled = true; document.getElementById("themetext").value = "";
} else {
document.getElementById("themetext").disabled = false;
}'></textarea> }'></textarea>
<div class="statusbar_outer hidden"> <div class="statusbar_outer hidden">
<div class="statusbar_inner" style="width:0%">0%</div> <div class="statusbar_inner" style="width:0%">0%</div>