mirror of
https://github.com/SillyTavern/SillyTavern.git
synced 2025-06-05 21:59:27 +02:00
put settings on top
right nav is only for character management now. rewrote the drawer toggle to handle multiple drawers.
This commit is contained in:
RossAsscends
1
public/img/book-atlas-solid.svg
Normal file
1
public/img/book-atlas-solid.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M0 96C0 43 43 0 96 0H384h32c17.7 0 32 14.3 32 32V352c0 17.7-14.3 32-32 32v64c17.7 0 32 14.3 32 32s-14.3 32-32 32H384 96c-53 0-96-43-96-96V96zM64 416c0 17.7 14.3 32 32 32H352V384H96c-17.7 0-32 14.3-32 32zM247.4 283.8c-3.7 3.7-6.2 4.2-7.4 4.2s-3.7-.5-7.4-4.2c-3.8-3.7-8-10-11.8-18.9c-6.2-14.5-10.8-34.3-12.2-56.9h63c-1.5 22.6-6 42.4-12.2 56.9c-3.8 8.9-8 15.2-11.8 18.9zm42.7-9.9c7.3-18.3 12-41.1 13.4-65.9h31.1c-4.7 27.9-21.4 51.7-44.5 65.9zm0-163.8c23.2 14.2 39.9 38 44.5 65.9H303.5c-1.4-24.7-6.1-47.5-13.4-65.9zM368 192a128 128 0 1 0 -256 0 128 128 0 1 0 256 0zM145.3 208h31.1c1.4 24.7 6.1 47.5 13.4 65.9c-23.2-14.2-39.9-38-44.5-65.9zm31.1-32H145.3c4.7-27.9 21.4-51.7 44.5-65.9c-7.3 18.3-12 41.1-13.4 65.9zm56.1-75.8c3.7-3.7 6.2-4.2 7.4-4.2s3.7 .5 7.4 4.2c3.8 3.7 8 10 11.8 18.9c6.2 14.5 10.8 34.3 12.2 56.9h-63c1.5-22.6 6-42.4 12.2-56.9c3.8-8.9 8-15.2 11.8-18.9z"/></svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
1
public/img/face-smile-regular.svg
Normal file
1
public/img/face-smile-regular.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M464 256A208 208 0 1 0 48 256a208 208 0 1 0 416 0zM0 256a256 256 0 1 1 512 0A256 256 0 1 1 0 256zm177.6 62.1C192.8 334.5 218.8 352 256 352s63.2-17.5 78.4-33.9c9-9.7 24.2-10.4 33.9-1.4s10.4 24.2 1.4 33.9c-22 23.8-60 49.4-113.6 49.4s-91.7-25.5-113.6-49.4c-9-9.7-8.4-24.9 1.4-33.9s24.9-8.4 33.9 1.4zM144.4 208a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm192-32a32 32 0 1 1 0 64 32 32 0 1 1 0-64z"/></svg>
|
||||
|
After Width: | Height: | Size: 632 B |
1
public/img/sliders-solid.svg
Normal file
1
public/img/sliders-solid.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M0 416c0-17.7 14.3-32 32-32l54.7 0c12.3-28.3 40.5-48 73.3-48s61 19.7 73.3 48L480 384c17.7 0 32 14.3 32 32s-14.3 32-32 32l-246.7 0c-12.3 28.3-40.5 48-73.3 48s-61-19.7-73.3-48L32 448c-17.7 0-32-14.3-32-32zm192 0a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM384 256a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zm-32-80c32.8 0 61 19.7 73.3 48l54.7 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-54.7 0c-12.3 28.3-40.5 48-73.3 48s-61-19.7-73.3-48L32 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l246.7 0c12.3-28.3 40.5-48 73.3-48zM192 64a32 32 0 1 0 0 64 32 32 0 1 0 0-64zm73.3 0L480 64c17.7 0 32 14.3 32 32s-14.3 32-32 32l-214.7 0c-12.3 28.3-40.5 48-73.3 48s-61-19.7-73.3-48L32 128C14.3 128 0 113.7 0 96S14.3 64 32 64l86.7 0C131 35.7 159.2 16 192 16s61 19.7 73.3 48z"/></svg>
|
||||
|
After Width: | Height: | Size: 977 B |
1
public/img/wifi-solid.svg
Normal file
1
public/img/wifi-solid.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M54.2 202.9C123.2 136.7 216.8 96 320 96s196.8 40.7 265.8 106.9c12.8 12.2 33 11.8 45.2-.9s11.8-33-.9-45.2C549.7 79.5 440.4 32 320 32S90.3 79.5 9.8 156.7C-2.9 169-3.3 189.2 8.9 202s32.5 13.2 45.2 .9zM320 256c56.8 0 108.6 21.1 148.2 56c13.3 11.7 33.5 10.4 45.2-2.8s10.4-33.5-2.8-45.2C459.8 219.2 393 192 320 192s-139.8 27.2-190.5 72c-13.3 11.7-14.5 31.9-2.8 45.2s31.9 14.5 45.2 2.8c39.5-34.9 91.3-56 148.2-56zm64 160a64 64 0 1 0 -128 0 64 64 0 1 0 128 0z"/></svg>
|
||||
|
After Width: | Height: | Size: 699 B |
@@ -52,10 +52,459 @@
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<!-- background selection menu -->
|
||||
<div id="bg_menu">
|
||||
<div id="logo_block">
|
||||
<div id="bg_menu_button"><img src="img/tri.png">
|
||||
</div>
|
||||
<img src="img/logo.png" id="site_logo">
|
||||
<div id="update-notification">
|
||||
<a id="verson" href="https://github.com/TavernAI/TavernAI" target="_blank"></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="bg_menu_content">
|
||||
<form id="form_bg_download" action="javascript:void(null);" method="post" enctype="multipart/form-data">
|
||||
<label class="input-file">
|
||||
<input type="file" id="add_bg_button" name="avatar"
|
||||
accept="image/png, image/jpeg, image/jpg, image/gif, image/bmp">
|
||||
<span class="bg_example_but_load"><img src='img/addbg3.png'></span>
|
||||
|
||||
</label>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div id="bg1"></div>
|
||||
<div id="bg2"></div>
|
||||
<div id="top-bar"></div>
|
||||
|
||||
<!-- top bar central settings buttons -->
|
||||
<div id="top-bar">
|
||||
<div id="top-settings-holder">
|
||||
|
||||
<div id="sys-settings-button" class="drawer" style="z-index:3001;">
|
||||
<div class="drawer-toggle drawer-header">
|
||||
<div class="drawer-icon icon-connect closedIcon"></div>
|
||||
</div>
|
||||
<div id="rm_api_block" class="drawer-content closedDrawer" >
|
||||
<div id="main-API-selector-block">
|
||||
<h3 id="title_api">API</h3>
|
||||
<select id="main_api">
|
||||
<option value="kobold">KoboldAI</option>
|
||||
<option value="textgenerationwebui">Text generation web UI</option>
|
||||
<option value="novel">NovelAI</option>
|
||||
</select>
|
||||
</div>
|
||||
<div id="kobold_api" style="position: relative;"> <!-- shows the kobold settings -->
|
||||
<form action="javascript:void(null);" method="post" enctype="multipart/form-data">
|
||||
<h4>API url</h4>
|
||||
<h5>Example: http://127.0.0.1:5000/api </h5>
|
||||
<input id="api_url_text" name="api_url" class="text_pole" maxlength="500" value=""
|
||||
autocomplete="off">
|
||||
<input id="api_button" class="menu_button" type="submit" value="Connect">
|
||||
<img id="api_loading" src="img/load.svg">
|
||||
<div id="online_status2">
|
||||
<div id="online_status_indicator2"></div>
|
||||
<div id="online_status_text2">Not connected</div>
|
||||
</div>
|
||||
</form>
|
||||
<div id="kobold_api-presets">
|
||||
<h3>Kobold Presets
|
||||
<a href="/notes/4" class="notes-link" target="_blank">
|
||||
<span class="note-link-span">?</span>
|
||||
</a>
|
||||
</h3>
|
||||
<select id="settings_perset">
|
||||
<option value="gui">GUI KoboldAI Settings</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div id="novel_api" style="display: none;position: relative;"> <!-- shows the novel settings -->
|
||||
<h4>Novel AI Model
|
||||
<a href="/notes/8" class="notes-link" target="_blank">
|
||||
<span class="note-link-span">?</span>
|
||||
</a>
|
||||
</h4>
|
||||
<select id="model_novel_select" class="option_select_right_menu" style='margin-bottom: 16px;'>
|
||||
<option value="euterpe-v2">Euterpe</option>
|
||||
<option value="krake-v2">Krake</option>
|
||||
</select><br>
|
||||
Preset settings
|
||||
<a href="/notes/7" class="notes-link" target="_blank">
|
||||
<span class="note-link-span">?</span>
|
||||
</a><br>
|
||||
<select id="settings_perset_novel" class="option_select_right_menu">
|
||||
<option value="gui">Default</option>
|
||||
</select>
|
||||
</div>
|
||||
<div id="textgenerationwebui_api" style="display: none;position: relative;">
|
||||
<div class="oobabooga_logo">
|
||||
<a href="https://github.com/oobabooga/text-generation-webui"target="_blank">
|
||||
oobabooga/text-generation-webui
|
||||
</a>
|
||||
</div>
|
||||
<span>Make sure you run it:
|
||||
<ul>
|
||||
<li>with <pre>--no-stream</pre> option</li>
|
||||
<li>in notebook mode (not <pre>--cai-chat</pre> or <pre>--chat</pre>)</li>
|
||||
</ul>
|
||||
</span>
|
||||
<form action="javascript:void(null);" method="post" enctype="multipart/form-data">
|
||||
<h4>API url</h4>
|
||||
<h5>Example: http://127.0.0.1:7860/ </h5>
|
||||
<input id="textgenerationwebui_api_url_text" name="textgenerationwebui_api_url"
|
||||
class="text_pole" maxlength="500" size="35" value="" autocomplete="off">
|
||||
<input id="api_button_textgenerationwebui" class="menu_button" type="submit" value="Connect">
|
||||
<img id="api_loading_textgenerationwebui" src="img/load.svg">
|
||||
</form>
|
||||
<div id="online_status4">
|
||||
<div id="online_status_indicator4"></div>
|
||||
<div id="online_status_text4">Not connected</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="user-settings-button" class="drawer" style="z-index:3004;">
|
||||
<div class="drawer-toggle">
|
||||
<div class="drawer-icon icon-user closedIcon"></div>
|
||||
</div>
|
||||
<div id="user-settings-block" class="drawer-content closedDrawer">
|
||||
<h3>User Settings</h3>
|
||||
<h4>Your Avatar</h4>
|
||||
<div id="user_avatar_block">
|
||||
<div class="avatar_upload">+</div>
|
||||
</div>
|
||||
<form id="form_upload_avatar" action="javascript:void(null);" method="post"
|
||||
enctype="multipart/form-data">
|
||||
<input type="file" id="avatar_upload_file" accept="image/png" name="avatar">
|
||||
</form>
|
||||
<form id='form_change_name' action="javascript:void(null);" method="post" enctype="multipart/form-data">
|
||||
<br>
|
||||
<h4>Name</h4>
|
||||
<input id="your_name" name="your_name" class="text_pole" maxlength="35" value=""
|
||||
autocomplete="off"><br>
|
||||
<input id="your_name_button" class="menu_button" type="submit"
|
||||
title="Click to set a new User Name (reloads page)" value="Change Name">
|
||||
</form>
|
||||
<div id="power-user-options-block">
|
||||
<h3>Power User Options</h3>
|
||||
<div id="power-user-option-checkboxes">
|
||||
<label for="auto-connect-checkbox"><input id="auto-connect-checkbox" type="checkbox" />
|
||||
Auto-connect to Last Server
|
||||
</label>
|
||||
<label for="auto-load-chat-checkbox"><input id="auto-load-chat-checkbox" type="checkbox" />
|
||||
Auto-load Last Chat
|
||||
</label>
|
||||
<label for="collapse-newlines-checkbox"><input id="collapse-newlines-checkbox" type="checkbox" />
|
||||
Collapse Newlines in Output
|
||||
</label>
|
||||
<label for="force-pygmalion-formatting-checkbox"><input id="force-pygmalion-formatting-checkbox" type="checkbox" />
|
||||
Pygmalion Formatting for All Models
|
||||
</label>
|
||||
<label for="swipes-checkbox"><input id="swipes-checkbox" type="checkbox" />
|
||||
Swipes
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="ai-config-button" class="drawer" style="z-index:3002;">
|
||||
<div class="drawer-toggle drawer-header">
|
||||
<div class="drawer-icon icon-sliders closedIcon"></div>
|
||||
</div>
|
||||
<div class="drawer-content closedDrawer">
|
||||
<div class="flex-container">
|
||||
<div id="ai-settings-flex-col1" class="wide50p">
|
||||
<div id="common-gen-settings-block">
|
||||
<div id="pro-settings-block">
|
||||
<div id="amount_gen_block" class="range-block">
|
||||
<div class="range-block-title">
|
||||
Amount generation
|
||||
</div>
|
||||
<span id="amount_gen_counter" class="range-block-counter">select</span>
|
||||
<input type="range" class="range-block-range" id="amount_gen" name="volume" min="16" max="512" step="1">
|
||||
</div>
|
||||
<div id="max_context_block" class="range-block">
|
||||
<div class="range-block-title">
|
||||
Context Size
|
||||
</div>
|
||||
<span id="max_context_counter" class="range-block-counter">select</span>
|
||||
<input type="range" class="range-block-range" id="max_context" name="volume" min="512" max="2048" step="1">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="respective-ranges-and-temps">
|
||||
<div id="range_block">
|
||||
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
Temperature
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<span id="temp_counter">select</span>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="temp" name="volume" min="0.1" max="2.0" step="0.01">
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
Repetition Penalty
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<span id="rep_pen_counter">select</span>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="rep_pen" name="volume" min="1" max="1.5" step="0.01">
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
Repetition Penalty Range
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<span id="rep_pen_range_counter">select</span>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="rep_pen_range" name="volume" min="0" max="2048" step="1">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="range_block_novel">
|
||||
Temperature
|
||||
<span id="temp_counter_novel">select</span>
|
||||
<input type="range" id="temp_novel" name="volume" min="0.1" max="2.0" step="0.01">
|
||||
Repetition Penalty
|
||||
<span id="rep_pen_counter_novel">select</span>
|
||||
<input type="range" id="rep_pen_novel" name="volume" min="1" max="1.5" step="0.01">
|
||||
Repetition Penalty Range
|
||||
<span id="rep_pen_size_counter_novel">select</span>
|
||||
<input type="range" id="rep_pen_size_novel" name="volume" min="0" max="2048" step="1">
|
||||
</div>
|
||||
<div id="range_block_textgenerationwebui">
|
||||
Temperature
|
||||
<span id="temp_counter_textgenerationwebui">select</span>
|
||||
<input type="range" id="temp_textgenerationwebui" name="volume" min="0.1" max="2.0" step="0.01">
|
||||
Repetition Penalty
|
||||
<span id="rep_pen_counter_textgenerationwebui">select</span>
|
||||
<input type="range" id="rep_pen_textgenerationwebui" name="volume" min="1" max="1.5" step="0.01">
|
||||
Repetition Penalty Range
|
||||
<span id="rep_pen_size_counter_textgenerationwebui">select</span>
|
||||
<input type="range" id="rep_pen_size_textgenerationwebui" name="volume" min="0" max="2048" step="1">
|
||||
</div>
|
||||
</div>
|
||||
<div id="anchors-block">
|
||||
Anchors Order
|
||||
<a href="/notes/9" class="notes-link" target="_blank"><span class="note-link-span">?</span></a>
|
||||
<br>
|
||||
<select id="anchor_order">
|
||||
<option value="0">Character then Style</option>
|
||||
<option value="1">Style then Character</option>
|
||||
</select>
|
||||
<div id="anchor_checkbox">
|
||||
<label for="character_anchor"><input id="character_anchor" type="checkbox" />
|
||||
Character Anchor
|
||||
</label>
|
||||
<label for="style_anchor"><input id="style_anchor" type="checkbox" />
|
||||
Style Anchor
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="ai-settings-flex-col2" class="wide50p">
|
||||
<div id="advanced-ai-config-block">
|
||||
<div id="kobold_api-settings">
|
||||
<div id="kobold-advanced-config">
|
||||
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
Top P Sampling
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<span id="top_p_counter">select</span>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="top_p" name="volume" min="0" max="1" step="0.01">
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
Top A Sampling
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<span id="top_a_counter">select</span>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="top_a" name="volume" min="0" max="1" step="0.01">
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
Top K Sampling
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<span id="top_k_counter">select</span>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="top_k" name="volume" min="0" max="100" step="1">
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
Typical Sampling
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<span id="typical_counter">select</span>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="typical" name="volume" min="0" max="1" step="0.01">
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
Tail Free Sampling
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<span id="tfs_counter">select</span>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="tfs" name="volume" min="0" max="1" step="0.05">
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
Repetition Penalty Slope
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<span id="rep_pen_slope_counter">select</span>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="rep_pen_slope" name="volume" min="0" max="10" step="0.1">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="novel_api-settings">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<div id="textgenerationwebui_api-settings">
|
||||
|
||||
|
||||
<div>
|
||||
<h3>Advanced Settings</h3>
|
||||
Top K
|
||||
<span id="top_k_counter_textgenerationwebui">select</span>
|
||||
<input type="range" id="top_k_textgenerationwebui" name="volume" min="0" max="200" step="1">
|
||||
Top P
|
||||
<span id="top_p_counter_textgenerationwebui">select</span>
|
||||
<input type="range" id="top_p_textgenerationwebui" name="volume" min="0" max="1" step="0.1">
|
||||
Typical P
|
||||
<span id="typical_p_counter_textgenerationwebui">select</span>
|
||||
<input type="range" id="typical_p_textgenerationwebui" name="volume" min="0" max="1" step="0.1">
|
||||
<h4>Penalty Alpha
|
||||
<span id="penalty_alpha_counter_textgenerationwebui">select</span>
|
||||
<input type="range" id="penalty_alpha_textgenerationwebui" name="volume" min="0" max="5" step="0.05" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="WI-SP-button" class="drawer" style="z-index:3003;">
|
||||
<div class="drawer-toggle drawer-header">
|
||||
<div class="drawer-icon icon-globe closedIcon "></div>
|
||||
</div>
|
||||
<div class="drawer-content closedDrawer">
|
||||
<div id="wi-holder">
|
||||
<div id="world_info_block">
|
||||
<h3>World Info</h3>
|
||||
<div id="world_info_buttons">
|
||||
<div id="world_create_button" class="right_menu_button">
|
||||
<h4>+Create</h4>
|
||||
</div>
|
||||
<div id="world_import_button" class="right_menu_button">
|
||||
<h4>+Import</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<h4>How to use <a href="/notes/13" class="notes-link" target="_blank"><span
|
||||
class="note-link-span">?</span></a></h4>
|
||||
<div id="rm_world_import" class="right_menu" style="display: none;">
|
||||
<form id="form_world_import" action="javascript:void(null);" method="post"
|
||||
enctype="multipart/form-data">
|
||||
<input type="file" id="world_import_file" accept=".json" name="avatar">
|
||||
</form>
|
||||
</div>
|
||||
<select id="world_info">
|
||||
<option value="None">None</option>
|
||||
</select>
|
||||
<input id="world_info_edit_button" class="menu_button" type="submit" value="Details">
|
||||
<div id="world_info_depth_block">
|
||||
<h4>
|
||||
Scan Depth <a href="/notes/13_1" class="notes-link" target="_blank"><span
|
||||
class="note-link-span">?</span></a>
|
||||
</h4>
|
||||
<span id="world_info_depth_counter">depth</span>
|
||||
<input type="range" id="world_info_depth" name="volume" min="1" max="10" step="1">
|
||||
</div>
|
||||
<div id="world_info_budget_block">
|
||||
<h4>
|
||||
Token Budget <a href="/notes/13_2" class="notes-link" target="_blank"><span
|
||||
class="note-link-span">?</span></a>
|
||||
</h4>
|
||||
<span id="world_info_budget_counter">budget</span>
|
||||
<input type="range" id="world_info_budget" name="volume" min="32" max="2048" step="16">
|
||||
</div>
|
||||
</div>
|
||||
<div id="softprompt_block">
|
||||
<h4>Soft Prompt</h4>
|
||||
<h5>About soft prompts <a href="/notes/14" class="notes-link" target="_blank"><span
|
||||
class="note-link-span">?</span></a></h5>
|
||||
<select id="softprompt">
|
||||
<option value="">None</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="extensions-settings-button" class="drawer" style="z-index:3004;">
|
||||
<div class="drawer-toggle">
|
||||
<div class="drawer-icon icon-cubes closedIcon"></div>
|
||||
</div>
|
||||
<div id="rm_extensions_block" class="drawer-content closedDrawer">
|
||||
<div class="extensions_block">
|
||||
<h3>Extensions API: <a target="_blank" href="https://github.com/SillyLossy/TavernAI-extras">TavernAI-extras</a></h3>
|
||||
<input id="extensions_url" type="text" class="text_pole" />
|
||||
<div class="extensions_url_block">
|
||||
<input id="extensions_connect" class="menu_button" type="submit" value="Connect" />
|
||||
<span class="expander"></span>
|
||||
<label for="extensions_autoconnect"><input id="extensions_autoconnect" type="checkbox"/>Auto-connect</label>
|
||||
</div>
|
||||
<div id="extensions_status">Not connected</div>
|
||||
<div id="extensions_loaded">
|
||||
<h4>Active extensions</h4>
|
||||
<ul id="extensions_list">
|
||||
</ul>
|
||||
<p>Missing something? Press <a id="extensions_details" href="javascript:void">here</a> for more details!</p>
|
||||
</div>
|
||||
<div id="extensions_settings">
|
||||
<h3>Extension settings</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- various fullscreen popups -->
|
||||
<div id="shadow_popup">
|
||||
<div id="dialogue_popup">
|
||||
<div id="dialogue_popup_text">
|
||||
@@ -130,7 +579,6 @@
|
||||
<div id="character_popup_ok" class="menu_button">Save</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div id="world_popup">
|
||||
<div id="world_popup_text">
|
||||
<img id="world_cross" src="img/cross.png">
|
||||
@@ -241,7 +689,6 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="shadow_select_chat_popup">
|
||||
<div id="select_chat_popup">
|
||||
<div id="select_chat_popup_text">
|
||||
@@ -295,41 +742,20 @@
|
||||
<!--<div style="margin-bottom:5px;">***</div><div>TRX: TCiBKCt6xEGrsjpgQA2jDXWJLyUh1KN2Sn</div><div>BTC: 1LASziomyYNkZ2zk8Sa4ZLTkvczBMrjyjP</div>-->
|
||||
</div>
|
||||
</div>
|
||||
<div id="bg_menu">
|
||||
<div id="logo_block">
|
||||
<div id="bg_menu_button"><img src="img/tri.png">
|
||||
</div>
|
||||
<img src="img/logo.png" id="site_logo">
|
||||
<div id="update-notification">
|
||||
<a id="verson" href="https://github.com/TavernAI/TavernAI" target="_blank"></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="bg_menu_content">
|
||||
<form id="form_bg_download" action="javascript:void(null);" method="post" enctype="multipart/form-data">
|
||||
<label class="input-file">
|
||||
<input type="file" id="add_bg_button" name="avatar"
|
||||
accept="image/png, image/jpeg, image/jpg, image/gif, image/bmp">
|
||||
<span class="bg_example_but_load"><img src='img/addbg3.png'></span>
|
||||
|
||||
</label>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- right nav panel for character/groups management/editing/creation -->
|
||||
<input type="checkbox" id="nav-toggle">
|
||||
|
||||
<nav id="right-nav-panel">
|
||||
<div id="right-nav-panel-tabs">
|
||||
<div class="right_menu_button" id="rm_button_characters" title="Select/Create Characters">
|
||||
<img alt="" class="svg_icon" src="img/id-card-regular.svg" />
|
||||
</div>
|
||||
<div class="right_menu_button" id="rm_button_settings" title="API and AI Settings">
|
||||
<!-- <div class="right_menu_button" id="rm_button_settings" title="API and AI Settings">
|
||||
<img alt="" class="svg_icon" src="img/gear-solid.svg" />
|
||||
</div>
|
||||
<div class="right_menu_button" id="rm_button_extensions" title="Extensions">
|
||||
<img alt="" class="svg_icon" src="img/cubes-solid.svg" />
|
||||
</div>
|
||||
</div>-->
|
||||
<div class="right_menu_button" id="rm_button_selected_ch">
|
||||
<h2></h2>
|
||||
</div>
|
||||
@@ -341,7 +767,6 @@
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="rm_ch_create_block" class="right_menu" style="display: none;">
|
||||
<form id="form_create" action="javascript:void(null);" method="post" enctype="multipart/form-data">
|
||||
<div id="avatar-and-name-block">
|
||||
@@ -472,415 +897,6 @@
|
||||
<input id="rm_group_delete" class="menu_button" type="submit" value="Delete">
|
||||
</div>
|
||||
</div>
|
||||
<div id="rm_api_block" class="right_menu">
|
||||
|
||||
<div id="main-API-selector-block">
|
||||
<h3 id="title_api">API</h3>
|
||||
<select id="main_api">
|
||||
<option value="kobold">KoboldAI</option>
|
||||
<option value="textgenerationwebui">Text generation web UI</option>
|
||||
<option value="novel">NovelAI</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div id="respective-settings-block">
|
||||
<div id="kobold_api" style="position: relative;"> <!-- shows the kobold settings -->
|
||||
<div class="API-logo">
|
||||
<a href="https://github.com/KoboldAI/KoboldAI-Client" target="_blank">
|
||||
<img alt="KoboldAI Logo" src="img/kobold.png" style="width:40px;height:40px;">
|
||||
</a>
|
||||
</div>
|
||||
<form action="javascript:void(null);" method="post" enctype="multipart/form-data">
|
||||
<h4>API url</h4>
|
||||
<h5>Example: http://127.0.0.1:5000/api </h5>
|
||||
<input id="api_url_text" name="api_url" class="text_pole" maxlength="500" value=""
|
||||
autocomplete="off">
|
||||
<input id="api_button" class="menu_button" type="submit" value="Connect">
|
||||
<img id="api_loading" src="img/load.svg">
|
||||
<div id="online_status2">
|
||||
<div id="online_status_indicator2"></div>
|
||||
<div id="online_status_text2">Not connected</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<hr>
|
||||
|
||||
<div id="ai-presets-and-config-block">
|
||||
<h3>Preset settings
|
||||
<a href="/notes/4" class="notes-link" target="_blank">
|
||||
<span class="note-link-span">?</span>
|
||||
</a>
|
||||
</h3>
|
||||
<select id="settings_perset">
|
||||
<option value="gui">GUI KoboldAI Settings</option>
|
||||
</select>
|
||||
<div id="range_block">
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
<h4>Temperature </h4>
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<h5 id="temp_counter">select</h5>
|
||||
</div>
|
||||
<div class="range-block-range"><input type="range" id="temp" name="volume" min="0.1"
|
||||
max="2.0" step="0.01"></div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
<h4>Repetition Penalty </h4>
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<h5 id="rep_pen_counter">select</h5>
|
||||
</div>
|
||||
<div class="range-block-range"><input type="range" id="rep_pen" name="volume" min="1"
|
||||
max="1.5" step="0.01"></div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
<h4>Repetition Penalty Range</h4>
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<h5 id="rep_pen_range_counter">select</h5>
|
||||
</div>
|
||||
<div class="range-block-range"><input type="range" id="rep_pen_range" name="volume"
|
||||
min="0" max="2048" step="1"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="drawer">
|
||||
<div class="drawer-toggle drawer-header">
|
||||
<h3>Advanced Settings
|
||||
<a href="/notes/kai_advanced" class="notes-link" target="_blank">
|
||||
<span class="note-link-span">?</span>
|
||||
</a>
|
||||
</h3>
|
||||
<div class="drawer-icon down"></div>
|
||||
</div>
|
||||
<div class="drawer-content">
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
<h4>Top P Sampling</h4>
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<h5 id="top_p_counter">select</h5>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="top_p" name="volume" min="0" max="1" step="0.01">
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
<h4>Top A Sampling</h4>
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<h5 id="top_a_counter">select</h5>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="top_a" name="volume" min="0" max="1" step="0.01">
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
<h4>Top K Sampling</h4>
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<h5 id="top_k_counter">select</h5>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="top_k" name="volume" min="0" max="100" step="1">
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
<h4>Typical Sampling</h4>
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<h5 id="typical_counter">select</h5>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="typical" name="volume" min="0" max="1" step="0.01">
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
<h4>Tail Free Sampling</h4>
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<h5 id="tfs_counter">select</h5>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="tfs" name="volume" min="0" max="1" step="0.05">
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block">
|
||||
<div class="range-block-title">
|
||||
<h4>Repetition Penalty Slope</h4>
|
||||
</div>
|
||||
<div class="range-block-counter">
|
||||
<h5 id="rep_pen_slope_counter">select</h5>
|
||||
</div>
|
||||
<div class="range-block-range">
|
||||
<input type="range" id="rep_pen_slope" name="volume" min="0" max="10" step="0.1">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="softprompt_block">
|
||||
<h4>Soft Prompt</h4>
|
||||
<h5>About soft prompts <a href="/notes/14" class="notes-link" target="_blank"><span
|
||||
class="note-link-span">?</span></a></h5>
|
||||
<select id="softprompt">
|
||||
<option value="">None</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="textgenerationwebui_api" style="display: none;position: relative;">
|
||||
<div class="oobabooga_logo"><a href="https://github.com/oobabooga/text-generation-webui"
|
||||
target="_blank">
|
||||
oobabooga/text-generation-webui
|
||||
</a></div>
|
||||
<span>Make sure you run it:
|
||||
<ul>
|
||||
<li>with <pre>--no-stream</pre> option</li>
|
||||
<li>in notebook mode (not <pre>--cai-chat</pre> or <pre>--chat</pre>)</li>
|
||||
</ul>
|
||||
</span>
|
||||
<form action="javascript:void(null);" method="post" enctype="multipart/form-data">
|
||||
|
||||
<h4>API url</h4>
|
||||
<h5>Example: http://127.0.0.1:7860/ </h5>
|
||||
<input id="textgenerationwebui_api_url_text" name="textgenerationwebui_api_url"
|
||||
class="text_pole" maxlength="500" size="35" value="" autocomplete="off">
|
||||
<input id="api_button_textgenerationwebui" class="menu_button" type="submit" value="Connect">
|
||||
<img id="api_loading_textgenerationwebui" src="img/load.svg">
|
||||
</form>
|
||||
<div id="online_status4">
|
||||
<div id="online_status_indicator4"></div>
|
||||
<div id="online_status_text4">Not connected</div>
|
||||
</div>
|
||||
<div id="range_block">
|
||||
<h4>Temperature </h4>
|
||||
<h5 id="temp_counter_textgenerationwebui">select</h5>
|
||||
<input type="range" id="temp_textgenerationwebui" name="volume" min="0.1" max="2.0" step="0.01">
|
||||
<h4>Repetition Penalty </h4>
|
||||
<h5 id="rep_pen_counter_textgenerationwebui">select</h5>
|
||||
<input type="range" id="rep_pen_textgenerationwebui" name="volume" min="1" max="1.5"
|
||||
step="0.01">
|
||||
<h4>Repetition Penalty Range</h4>
|
||||
<h5 id="rep_pen_size_counter_textgenerationwebui">select</h5>
|
||||
<input type="range" id="rep_pen_size_textgenerationwebui" name="volume" min="0" max="2048"
|
||||
step="1">
|
||||
|
||||
<div class="drawer">
|
||||
<div class="drawer-toggle drawer-header">
|
||||
<h3>Advanced Settings</h3>
|
||||
<div class="drawer-icon down"></div>
|
||||
</div>
|
||||
<div class="drawer-content">
|
||||
<h4>Top K</h4>
|
||||
<h5 id="top_k_counter_textgenerationwebui">select</h5>
|
||||
<input type="range" id="top_k_textgenerationwebui" name="volume" min="0" max="200" step="1">
|
||||
<h4>Top P</h4>
|
||||
<h5 id="top_p_counter_textgenerationwebui">select</h5>
|
||||
<input type="range" id="top_p_textgenerationwebui" name="volume" min="0" max="1" step="0.1">
|
||||
<h4>Typical P</h4>
|
||||
<h5 id="typical_p_counter_textgenerationwebui">select</h5>
|
||||
<input type="range" id="typical_p_textgenerationwebui" name="volume" min="0" max="1" step="0.1">
|
||||
<h4>Penalty Alpha</h4>
|
||||
<h5 id="penalty_alpha_counter_textgenerationwebui">select</h5>
|
||||
<input type="range" id="penalty_alpha_textgenerationwebui" name="volume" min="0" max="5" step="0.05" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="novel_api" style="display: none;position: relative;"> <!-- shows the novel settings -->
|
||||
<div class="API-logo">
|
||||
<a href="https://novelai.net/" target="_blank">
|
||||
<img src="img/novelai.png" style="width:auto;height:22px;">
|
||||
</a>
|
||||
</div>
|
||||
<form action="javascript:void(null);" method="post" enctype="multipart/form-data">
|
||||
<h4>Novel API key<a href="/notes/6" class="notes-link" target="_blank"><span
|
||||
class="note-link-span">?</span></a></h4>
|
||||
<input id="api_key_novel" name="api_key_novel" class="text_pole" maxlength="500" value=""
|
||||
autocomplete="off">
|
||||
<Br>
|
||||
<input id="api_button_novel" class="menu_button" type="submit" value="Connect">
|
||||
<img id="api_loading_novel" src="img/load.svg">
|
||||
</form>
|
||||
<div id="online_status3">
|
||||
<div id="online_status_indicator3"></div>
|
||||
<div id="online_status_text3">No connection...</div>
|
||||
</div>
|
||||
<h4>Novel AI Model<a href="/notes/8" class="notes-link" target="_blank"><span
|
||||
class="note-link-span">?</span></a></h4>
|
||||
<select id="model_novel_select" class="option_select_right_menu" style='margin-bottom: 16px;'>
|
||||
<option value="euterpe-v2">Euterpe</option>
|
||||
<option value="krake-v2">Krake</option>
|
||||
</select>
|
||||
<h4>Preset settings<a href="/notes/7" class="notes-link" target="_blank"><span
|
||||
class="note-link-span">?</span></a></h4>
|
||||
<select id="settings_perset_novel" class="option_select_right_menu">
|
||||
<option value="gui">Default</option>
|
||||
</select>
|
||||
<div id="range_block_novel">
|
||||
<h4>Temperature </h4>
|
||||
<h5 id="temp_counter_novel">select</h5>
|
||||
<input type="range" id="temp_novel" name="volume" min="0.1" max="2.0" step="0.01">
|
||||
<h4>Repetition Penalty </h4>
|
||||
<h5 id="rep_pen_counter_novel">select</h5>
|
||||
<input type="range" id="rep_pen_novel" name="volume" min="1" max="1.5" step="0.01">
|
||||
<h4>Repetition Penalty Range</h4>
|
||||
<h5 id="rep_pen_size_counter_novel">select</h5>
|
||||
<input type="range" id="rep_pen_size_novel" name="volume" min="0" max="2048" step="1">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<div id="user-settings-block">
|
||||
<h3>User Settings</h3>
|
||||
<h4>Your Avatar</h4>
|
||||
<div id="user_avatar_block">
|
||||
<div class="avatar_upload">+</div>
|
||||
</div>
|
||||
<form id="form_upload_avatar" action="javascript:void(null);" method="post"
|
||||
enctype="multipart/form-data">
|
||||
<input type="file" id="avatar_upload_file" accept="image/png" name="avatar">
|
||||
</form>
|
||||
<form id='form_change_name' action="javascript:void(null);" method="post" enctype="multipart/form-data">
|
||||
<br>
|
||||
<h4>Name</h4>
|
||||
<input id="your_name" name="your_name" class="text_pole" maxlength="35" value=""
|
||||
autocomplete="off"><br>
|
||||
<input id="your_name_button" class="menu_button" type="submit"
|
||||
title="Click to set a new User Name (reloads page)" value="Change Name">
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<div id="world_info_block">
|
||||
<h3>World Info</h3>
|
||||
<div id="world_info_buttons">
|
||||
<div id="world_create_button" class="right_menu_button">
|
||||
<h4>+Create</h4>
|
||||
</div>
|
||||
<div id="world_import_button" class="right_menu_button">
|
||||
<h4>+Import</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<h4>How to use <a href="/notes/13" class="notes-link" target="_blank"><span
|
||||
class="note-link-span">?</span></a></h4>
|
||||
<div id="rm_world_import" class="right_menu" style="display: none;">
|
||||
<form id="form_world_import" action="javascript:void(null);" method="post"
|
||||
enctype="multipart/form-data">
|
||||
<input type="file" id="world_import_file" accept=".json" name="avatar">
|
||||
</form>
|
||||
</div>
|
||||
<select id="world_info">
|
||||
<option value="None">None</option>
|
||||
</select>
|
||||
<input id="world_info_edit_button" class="menu_button" type="submit" value="Details">
|
||||
<div id="world_info_depth_block">
|
||||
<h4>
|
||||
Scan Depth <a href="/notes/13_1" class="notes-link" target="_blank"><span
|
||||
class="note-link-span">?</span></a>
|
||||
</h4>
|
||||
<h5 id="world_info_depth_counter">depth</h5>
|
||||
<input type="range" id="world_info_depth" name="volume" min="1" max="10" step="1">
|
||||
</div>
|
||||
<div id="world_info_budget_block">
|
||||
<h4>
|
||||
Token Budget <a href="/notes/13_2" class="notes-link" target="_blank"><span
|
||||
class="note-link-span">?</span></a>
|
||||
</h4>
|
||||
<h5 id="world_info_budget_counter">budget</h5>
|
||||
<input type="range" id="world_info_budget" name="volume" min="32" max="2048" step="16">
|
||||
</div>
|
||||
<hr>
|
||||
|
||||
<div id="pro-settings-block">
|
||||
<h3>Pro Settings</h3>
|
||||
<div id="amount_gen_block">
|
||||
<h4>Amount generation </h4>
|
||||
<h5 id="amount_gen_counter">select</h5>
|
||||
<input type="range" id="amount_gen" name="volume" min="16" max="512" step="1">
|
||||
</div>
|
||||
<div id="max_context_block">
|
||||
<h4>Context Size</h4>
|
||||
<h5 id="max_context_counter">select</h5>
|
||||
<input type="range" id="max_context" name="volume" min="512" max="2048" step="1">
|
||||
</div>
|
||||
<div id="anchors-block">
|
||||
<h4>Anchors Order</h4>
|
||||
<h5>Helps to increase the length of messages <a href="/notes/9" class="notes-link"
|
||||
target="_blank"><span class="note-link-span">?</span></a></h5>
|
||||
<select id="anchor_order">
|
||||
<option value="0">Character Anchor - Style Anchor</option>
|
||||
<option value="1">Style Anchor - Character Anchor</option>
|
||||
</select>
|
||||
<div id="anchor_checkbox">
|
||||
<label for="character_anchor"><input id="character_anchor" type="checkbox" />
|
||||
<h4>Character Anchor</h4>
|
||||
</label>
|
||||
<label for="style_anchor"><input id="style_anchor" type="checkbox" />
|
||||
<h4>Style Anchor</h4>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<div id="power-user-options-block">
|
||||
<h3>Power User Options</h3>
|
||||
<div id="power-user-option-checkboxes">
|
||||
<label for="auto-connect-checkbox"><input id="auto-connect-checkbox" type="checkbox" />
|
||||
<h4>Auto-connects Last Server</h4>
|
||||
</label>
|
||||
<label for="auto-load-chat-checkbox"><input id="auto-load-chat-checkbox" type="checkbox" />
|
||||
<h4>Auto-load Last Chat</h4>
|
||||
</label>
|
||||
<label for="collapse-newlines-checkbox"><input id="collapse-newlines-checkbox" type="checkbox" />
|
||||
<h4>Collapse Newlines in Output</h4>
|
||||
</label>
|
||||
<label for="force-pygmalion-formatting-checkbox"><input id="force-pygmalion-formatting-checkbox" type="checkbox" />
|
||||
<h4>Force Pygmalion formatting for any model</h4>
|
||||
</label>
|
||||
<label for="swipes-checkbox"><input id="swipes-checkbox" type="checkbox" />
|
||||
<h4>Swipes</h4>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="rm_extensions_block" class="right_menu">
|
||||
<div class="extensions_block">
|
||||
<h3>Extensions API: <a target="_blank" href="https://github.com/SillyLossy/TavernAI-extras">TavernAI-extras</a></h3>
|
||||
<input id="extensions_url" type="text" class="text_pole" />
|
||||
<div class="extensions_url_block">
|
||||
<input id="extensions_connect" class="menu_button" type="submit" value="Connect" />
|
||||
<span class="expander"></span>
|
||||
<label for="extensions_autoconnect"><input id="extensions_autoconnect" type="checkbox"/>Auto-connect</label>
|
||||
</div>
|
||||
<div id="extensions_status">Not connected</div>
|
||||
<div id="extensions_loaded">
|
||||
<h4>Active extensions</h4>
|
||||
<ul id="extensions_list">
|
||||
</ul>
|
||||
<p>Missing something? Press <a id="extensions_details" href="javascript:void">here</a> for more details!</p>
|
||||
</div>
|
||||
<div id="extensions_settings">
|
||||
<h3>Extension settings</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="rm_character_import" class="right_menu" style="display: none;">
|
||||
<form id="form_import" action="javascript:void(null);" method="post" enctype="multipart/form-data">
|
||||
@@ -889,8 +905,6 @@
|
||||
value="" autocomplete="off">
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="rm_characters_block" class="right_menu">
|
||||
<div class="form_create_bottom_buttons_block">
|
||||
<div id="rm_button_create" title="Create New Character" class="menu_button">
|
||||
@@ -917,12 +931,10 @@
|
||||
<div id="rm_info_button" class="menu_button">Back</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</nav>
|
||||
|
||||
<div id="typing_indicator_template">
|
||||
<div class="typing_indicator"><span class="typing_indicator_name">CHAR</span> is typing</div>
|
||||
</div>
|
||||
|
||||
<!-- templates for JS to reuse when needed -->
|
||||
<div id="message_template">
|
||||
<div class="mes" mesid="${count_view_mes}" ch_name="${characterName}" is_user="${mes.is_user}">
|
||||
<div class="for_checkbox"></div><input type="checkbox" class="del_checkbox">
|
||||
@@ -944,7 +956,6 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="group_avatars_template">
|
||||
<div class="avatar avatar_collage collage_1">
|
||||
<img alt="img1" class="img_1" src="">
|
||||
@@ -966,6 +977,10 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- chat and input bar -->
|
||||
<div id="typing_indicator_template">
|
||||
<div class="typing_indicator"><span class="typing_indicator_name">CHAR</span> is typing</div>
|
||||
</div>
|
||||
<div id="sheld">
|
||||
<div id="chat">
|
||||
</div>
|
||||
@@ -1007,6 +1022,7 @@
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -1006,7 +1006,7 @@ async function Generate(type, automatic_trigger) {//encode("dsfs").length
|
||||
} else {
|
||||
chat.length = chat.length - 1;
|
||||
count_view_mes -= 1;
|
||||
$('#chat').children().last().hide(500, function() {
|
||||
$('#chat').children().last().hide(500, function () {
|
||||
$(this).remove();
|
||||
});
|
||||
}
|
||||
@@ -1805,40 +1805,55 @@ function openNavToggle() {
|
||||
|
||||
function changeMainAPI() {
|
||||
const selectedVal = $("#main_api").val();
|
||||
console.log(selectedVal);
|
||||
//console.log(selectedVal);
|
||||
const apiElements = {
|
||||
"kobold": {
|
||||
apiElem: $("#kobold_api"),
|
||||
apiSettings: $("#kobold_api-settings"),
|
||||
apiConnector: $("#kobold_api"),
|
||||
apiRanges: $("#range_block"),
|
||||
maxContextElem: $("#max_context_block"),
|
||||
amountGenElem: $("#amount_gen_block"),
|
||||
softPromptElem: $("#softprompt_block")
|
||||
},
|
||||
"textgenerationwebui": {
|
||||
apiElem: $("#textgenerationwebui_api"),
|
||||
apiSettings: $("#textgenerationwebui_api-settings"),
|
||||
apiConnector: $("#textgenerationwebui_api"),
|
||||
apiRanges: $("#range_block_textgenerationwebui"),
|
||||
maxContextElem: $("#max_context_block"),
|
||||
amountGenElem: $("#amount_gen_block"),
|
||||
softPromptElem: $("#softprompt_block")
|
||||
},
|
||||
"novel": {
|
||||
apiElem: $("#novel_api"),
|
||||
apiSettings: $("#novel_api-settings"),
|
||||
apiConnector: $("#novel_api"),
|
||||
|
||||
apiRanges: $("#range_block_novel"),
|
||||
maxContextElem: $("#max_context_block"),
|
||||
amountGenElem: $("#amount_gen_block"),
|
||||
softPromptElem: $("#softprompt_block")
|
||||
}
|
||||
};
|
||||
console.log('--- apiElements--- ');
|
||||
//console.log(apiElements);
|
||||
|
||||
for (const apiName in apiElements) {
|
||||
const apiObj = apiElements[apiName];
|
||||
const isCurrentApi = selectedVal === apiName;
|
||||
console.log(isCurrentApi);
|
||||
console.log(selectedVal);
|
||||
apiObj.apiElem.css("display", isCurrentApi ? "block" : "none");
|
||||
|
||||
apiObj.apiSettings.css("display", isCurrentApi ? "block" : "none");
|
||||
apiObj.apiConnector.css("display", isCurrentApi ? "block" : "none");
|
||||
apiObj.apiRanges.css("display", isCurrentApi ? "block" : "none");
|
||||
//console.log('--- apiObj.apiElem ---');
|
||||
//console.log(apiObj.apiElem);
|
||||
//console.log(apiObj.apiElem.css("display"));
|
||||
|
||||
if (isCurrentApi && apiName === "kobold") {
|
||||
console.log("enabling SP for kobold");
|
||||
$("#softprompt_block").css("display", "block");
|
||||
}
|
||||
|
||||
if (isCurrentApi && apiName === "textgenerationwebui") {
|
||||
console.log("enabling amount_gen for ooba");
|
||||
apiObj.amountGenElem.children().prop("disabled", false);
|
||||
apiObj.amountGenElem.css("opacity", 1.0);
|
||||
}
|
||||
@@ -2048,20 +2063,21 @@ async function getSettings(type) {
|
||||
$("#settings_perset option[value=gui]")
|
||||
.attr("selected", "true")
|
||||
.trigger("change");
|
||||
$("#range_block").children().prop("disabled", true);
|
||||
/* $("#range_block").children().prop("disabled", true);
|
||||
|
||||
$("#range_block").css("opacity", 0.5);
|
||||
|
||||
$("#amount_gen_block").children().prop("disabled", true);
|
||||
$("#amount_gen_block").css("opacity", 0.45);
|
||||
$("#amount_gen_block").css("opacity", 0.45); */
|
||||
} else {
|
||||
if (typeof koboldai_setting_names[preset_settings] !== "undefined") {
|
||||
$(`#settings_perset option[value=${koboldai_setting_names[preset_settings]}]`)
|
||||
.attr("selected", "true");
|
||||
} else {
|
||||
$("#range_block").children().prop("disabled", true);
|
||||
/* $("#range_block").children().prop("disabled", true);
|
||||
$("#range_block").css("opacity", 0.5);
|
||||
$("#amount_gen_block").children().prop("disabled", true);
|
||||
$("#amount_gen_block").css("opacity", 0.45);
|
||||
$("#amount_gen_block").css("opacity", 0.45); */
|
||||
|
||||
preset_settings = "gui";
|
||||
$("#settings_perset option[value=gui]")
|
||||
@@ -2685,10 +2701,10 @@ function showSwipeButtons() {
|
||||
}
|
||||
//console.log((chat[chat.length - 1]));
|
||||
if ((chat[chat.length - 1].swipes.length - swipeId) === 1) {
|
||||
console.log('highlighting R swipe');
|
||||
//console.log('highlighting R swipe');
|
||||
currentMessage.children('.swipe_right').css('opacity', '0.7');
|
||||
}
|
||||
console.log(swipesCounterHTML);
|
||||
//console.log(swipesCounterHTML);
|
||||
|
||||
$(".swipes-counter").html(swipesCounterHTML);
|
||||
|
||||
@@ -3724,15 +3740,19 @@ $(document).ready(function () {
|
||||
$("#max_context_counter").html(max_context + " Tokens");
|
||||
|
||||
$("#range_block").children().prop("disabled", false);
|
||||
|
||||
$("#range_block").css("opacity", 1.0);
|
||||
$("#amount_gen_block").children().prop("disabled", false);
|
||||
|
||||
$("#amount_gen_block").css("opacity", 1.0);
|
||||
} else {
|
||||
//$('.button').disableSelection();
|
||||
preset_settings = "gui";
|
||||
$("#range_block").children().prop("disabled", true);
|
||||
|
||||
$("#range_block").css("opacity", 0.5);
|
||||
$("#amount_gen_block").children().prop("disabled", true);
|
||||
|
||||
$("#amount_gen_block").css("opacity", 0.45);
|
||||
}
|
||||
saveSettingsDebounced();
|
||||
@@ -4211,8 +4231,27 @@ $(document).ready(function () {
|
||||
});
|
||||
|
||||
$('.drawer-toggle').click(function () {
|
||||
//$('#top-settings-holder').find('.open').slideToggle(0, "swing");
|
||||
var icon = $(this).find('.drawer-icon');
|
||||
icon.toggleClass('down up');
|
||||
$(this).closest('.drawer').find('.drawer-content').slideToggle();
|
||||
var drawer = $(this).parent().find('.drawer-content');
|
||||
var drawerWasOpenAlready = $(this).parent().find('.drawer-content').hasClass('openDrawer');
|
||||
var iconWasOpenAlready = $(this).find('.drawer-icon').hasClass('openicon');
|
||||
console.log('Draw Open? ' + drawerWasOpenAlready + ' Icon Open? ' + iconWasOpenAlready);
|
||||
|
||||
if (!drawerWasOpenAlready) {
|
||||
$('.openDrawer').slideToggle(200, "swing") //close all open drawers
|
||||
$('.openIcon').toggleClass('closedIcon openIcon'); //set all icons to closed state
|
||||
$('.openDrawer').toggleClass('closedDrawer openDrawer'); //set all drawers to closed state
|
||||
console.log('drawer was closed, so opening');
|
||||
icon.toggleClass('openIcon closedIcon');
|
||||
drawer.toggleClass('openDrawer closedDrawer'); //mark selected drawer as open if closed
|
||||
$(this).closest('.drawer').find('.drawer-content').slideToggle(200, "swing"); //open selected drawer
|
||||
|
||||
} else if (drawerWasOpenAlready) {
|
||||
console.log('found the drawer was already open, so closing');
|
||||
icon.toggleClass('closedIcon openIcon');
|
||||
$('.openDrawer').slideToggle(200, "swing");
|
||||
drawer.toggleClass('closedDrawer openDrawer');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1 +1 @@
|
||||
{"username":"You","api_server":"http://127.0.0.1:5000/api","api_server_textgenerationwebui":"","preset_settings":"Classic-Pygmalion-2.7b","preset_settings_novel":"Classic-Euterpe","user_avatar":"legat.png","temp":0.43,"amount_gen":180,"max_context":2048,"anchor_order":0,"style_anchor":false,"character_anchor":false,"main_api":"kobold","api_key_novel":"","rep_pen":1.17,"rep_pen_size":1024,"model_novel":"euterpe-v2","temp_novel":0.5,"rep_pen_novel":1,"rep_pen_size_novel":100,"world_info":"Toaru","world_info_depth":1,"world_info_budget":200,"active_character":"0","textgenerationwebui_settings":{"temp":0.5,"top_p":0.9,"top_k":0,"typical_p":1,"rep_pen":1.1,"rep_pen_size":0,"penalty_alpha":0},"swipes":true}
|
||||
{"username":"Ross","api_server":"http://localhost:5000/api","api_server_textgenerationwebui":"","preset_settings":"Classic-Pygmalion-2.7b","preset_settings_novel":"Classic-Euterpe","user_avatar":"legat.png","amount_gen":180,"max_context":1476,"anchor_order":0,"style_anchor":true,"character_anchor":true,"main_api":"kobold","api_key_novel":"","model_novel":"euterpe-v2","temp_novel":1.11,"rep_pen_novel":1.11,"rep_pen_size_novel":320,"world_info":null,"world_info_depth":2,"world_info_budget":128,"active_character":"0","textgenerationwebui_settings":{"temp":0.47,"top_p":0.9,"top_k":0,"typical_p":1,"rep_pen":1.1,"rep_pen_size":0,"penalty_alpha":0},"swipes":true,"temp":0.55,"rep_pen":1.17,"rep_pen_range":1024,"top_p":0.96,"top_a":0.18,"top_k":0,"typical":1,"tfs":0.68,"rep_pen_slope":0.2}
|
||||
398
public/style.css
398
public/style.css
@@ -162,9 +162,12 @@ code {
|
||||
backdrop-filter: blur(10px);
|
||||
background-color: var(--black70a);
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
z-index: 2001;
|
||||
z-index: 3000;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
#sheld {
|
||||
display: grid;
|
||||
grid-template-rows: auto min-content;
|
||||
@@ -339,7 +342,8 @@ code {
|
||||
}
|
||||
|
||||
#right-nav-panel hr,
|
||||
#personality_div hr {
|
||||
#personality_div hr,
|
||||
#top-settings-holder hr {
|
||||
background-image: linear-gradient(90deg, var(--transparent), var(--white30a), var(--transparent));
|
||||
}
|
||||
|
||||
@@ -568,25 +572,25 @@ textarea {
|
||||
}
|
||||
|
||||
|
||||
.right_menu {
|
||||
/* .topbar {
|
||||
max-height: calc(100% - 50px);
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.right_menu h3 {
|
||||
*/
|
||||
#top-bar h3 {
|
||||
margin: 0;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.right_menu h4 {
|
||||
#top-bar h4 {
|
||||
margin: 0;
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.right_menu h5 {
|
||||
#top-bar h5 {
|
||||
color: var(--white50a);
|
||||
margin: 0;
|
||||
padding-bottom: 5px;
|
||||
margin-bottom: 0;
|
||||
margin-top: 0;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
@@ -711,6 +715,7 @@ select {
|
||||
border: 1px solid var(--white30a);
|
||||
border-radius: 10px;
|
||||
width: 100%;
|
||||
margin-bottom:10px;
|
||||
}
|
||||
|
||||
select option {
|
||||
@@ -1701,82 +1706,38 @@ input[type='checkbox']:not(#nav-toggle):not(#rm_button_panel_pin):checked::after
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#temp {
|
||||
margin-left: 10px;
|
||||
margin-bottom: 20px;
|
||||
.range-block {
|
||||
height:min-content;
|
||||
}
|
||||
|
||||
#temp_counter {
|
||||
margin-bottom: 0;
|
||||
.range-block-title{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#amount_gen {
|
||||
margin-left: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
#amount_gen_counter {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#max_context {
|
||||
margin-left: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
#max_context_counter {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#range_block input {
|
||||
margin-left: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
#range_block_novel input {
|
||||
margin-left: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
/* range sliders */
|
||||
|
||||
#range_block,
|
||||
#range_block_novel {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
#range_block input,
|
||||
#range_block_novel input {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
#temp,
|
||||
#amount_gen,
|
||||
#max_context {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
#temp_counter,
|
||||
#amount_gen_counter,
|
||||
#max_context_counter {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.range-block-counter {
|
||||
width: min-content;
|
||||
margin: 0 auto;
|
||||
width: max-content;
|
||||
position: relative;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-top: 10px;
|
||||
font-size:11px;
|
||||
color: var(--white50a);
|
||||
}
|
||||
|
||||
.range-block-range {
|
||||
margin: 0 auto;
|
||||
margin-bottom: 10px;
|
||||
width: 100%;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
input[type="range"] {
|
||||
-webkit-appearance: none;
|
||||
margin: 0 auto;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: 7px;
|
||||
height: 5px;
|
||||
background: var(--white50a);
|
||||
border-radius: 15px;
|
||||
background-size: 70% 100%;
|
||||
@@ -1897,8 +1858,6 @@ input[type="range"] {
|
||||
}
|
||||
|
||||
#anchor_order {
|
||||
width: 284px;
|
||||
|
||||
margin-bottom: 15px;
|
||||
color: var(--white70a);
|
||||
background-color: var(--black50a);
|
||||
@@ -2587,7 +2546,7 @@ a {
|
||||
backdrop-filter: blur(10px);
|
||||
background-color: var(--black70a);
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
z-index: 2050;
|
||||
z-index: 3000;
|
||||
white-space: nowrap;
|
||||
border-left: 1px solid var(--black30a);
|
||||
scrollbar-width: thin;
|
||||
@@ -2659,13 +2618,188 @@ a {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Extensions */
|
||||
#extensions_url {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#extensions_status {
|
||||
margin-bottom: 10px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.extensions_block input[type="submit"]:hover{
|
||||
background-color: green;
|
||||
}
|
||||
|
||||
.extensions_block input[type="checkbox"] {
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
label[for="extensions_autoconnect"] {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.extensions_url_block {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.extensions_url_block h4 {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.extensions_block {
|
||||
clear: both;
|
||||
padding: 0.05px; /* clear fix */
|
||||
}
|
||||
.extensions_info {
|
||||
text-align: left;
|
||||
margin: 0 1em;
|
||||
}
|
||||
|
||||
.extensions_info h3 {
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.extensions_info h4 {
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.extensions_info p {
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.extensions_info .disabled {
|
||||
color: lightgray;
|
||||
}
|
||||
|
||||
#extensions_list .disabled {
|
||||
text-decoration: line-through;
|
||||
color: lightgray;
|
||||
}
|
||||
|
||||
.success {
|
||||
color: green;
|
||||
}
|
||||
|
||||
.failure {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.expander {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
/*------------ TOP SIDE SETTINGS ----------------*/
|
||||
|
||||
.drawer {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
|
||||
}
|
||||
|
||||
.drawer-icon {
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.icon-connect{
|
||||
background-image: url('img/wifi-solid.svg');
|
||||
}
|
||||
.icon-sliders{
|
||||
background-image: url('img/sliders-solid.svg');
|
||||
}
|
||||
.icon-globe{
|
||||
background-image: url('img/book-atlas-solid.svg');
|
||||
}
|
||||
.icon-user{
|
||||
background-image: url('img/face-smile-regular.svg');
|
||||
}
|
||||
|
||||
.icon-cubes {
|
||||
background-image: url('img/cubes-solid.svg');
|
||||
}
|
||||
|
||||
.drawer-icon.openIcon {
|
||||
/* background-image: url('img/circle-chevron-up-solid.svg'); */
|
||||
filter: invert(1) brightness(200%);
|
||||
}
|
||||
|
||||
.drawer-icon.closedIcon {
|
||||
/* background-image: url('img/circle-chevron-down-solid.svg'); */
|
||||
filter: invert(1) brightness(75%);
|
||||
}
|
||||
|
||||
.drawer-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.drawer-content {
|
||||
background-color: black;
|
||||
color: white;
|
||||
border-radius: 20px;
|
||||
padding: 10px;
|
||||
border: 1px solid grey;
|
||||
box-shadow: 0 0 20px black;
|
||||
/* min-width:400px; */
|
||||
width: max-content;
|
||||
overflow-y: scroll;
|
||||
margin-top: 10px;
|
||||
max-height: 90vh;
|
||||
display: none;
|
||||
position: fixed;
|
||||
width: max-content;
|
||||
margin: 30px auto;
|
||||
}
|
||||
|
||||
.flex-container {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.wide50p { width:50%;}
|
||||
|
||||
#top-settings-holder{
|
||||
margin: 5px auto;
|
||||
height: 40px;
|
||||
max-width: 400px;
|
||||
color: white;
|
||||
justify-content: space-around;
|
||||
display: grid;
|
||||
grid-template-columns: 20% 20% 20% 20% 20%;
|
||||
/* grid-gap: 20px; */
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* ---------- @media quaries must always go at the bottom ------------*/
|
||||
|
||||
@media screen and (max-width: 450px) { /*styles for mobile phones (tested on iPhone 13 Pro)*/
|
||||
body {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.drawer-content {
|
||||
width: 100vw;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 10px;
|
||||
}
|
||||
|
||||
#top-settings-holder{
|
||||
max-width:70vw;
|
||||
}
|
||||
#bg1, #bg2 {position:fixed;}
|
||||
|
||||
#sheld { /*margin around the sides, and a larger one on bottom to avoid iOS Home bar*/
|
||||
@@ -2730,119 +2864,3 @@ a {
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (display-mode: browser) { /*Even in iOS WebApp mode the window detects as this; unhelpful.*/
|
||||
* {
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/* Extensions */
|
||||
#extensions_url {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#extensions_status {
|
||||
margin-bottom: 10px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.extensions_block input[type="submit"]:hover{
|
||||
background-color: green;
|
||||
}
|
||||
|
||||
.extensions_block input[type="checkbox"] {
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
label[for="extensions_autoconnect"] {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.extensions_url_block {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.extensions_url_block h4 {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.extensions_block {
|
||||
clear: both;
|
||||
padding: 0.05px; /* clear fix */
|
||||
}
|
||||
|
||||
.success {
|
||||
color: green;
|
||||
}
|
||||
|
||||
.failure {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.expander {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.drawer {
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.drawer-icon {
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
filter: invert(1) brightness(75%);
|
||||
}
|
||||
|
||||
.drawer-icon.up {
|
||||
background-image: url('img/circle-chevron-up-solid.svg');
|
||||
}
|
||||
|
||||
.drawer-icon.down {
|
||||
background-image: url('img/circle-chevron-down-solid.svg');
|
||||
}
|
||||
|
||||
.drawer-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.drawer-content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.extensions_info {
|
||||
text-align: left;
|
||||
margin: 0 1em;
|
||||
}
|
||||
|
||||
.extensions_info h3 {
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.extensions_info h4 {
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.extensions_info p {
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.extensions_info .disabled {
|
||||
color: lightgray;
|
||||
}
|
||||
|
||||
#extensions_list .disabled {
|
||||
text-decoration: line-through;
|
||||
color: lightgray;
|
||||
}
|
||||
Reference in New Issue
Block a user