diff --git a/static/koboldai.css b/static/koboldai.css
index 2ecc94f9..3af1578f 100644
--- a/static/koboldai.css
+++ b/static/koboldai.css
@@ -447,6 +447,8 @@ input[type="range"]::-ms-fill-upper {
}
.story_title {
+ display: flex;
+ justify-content: space-between;
font-size: calc(1.8em + var(--font_size_adjustment));
text-align: center;
border-bottom: 1px;
@@ -463,9 +465,10 @@ input[type="range"]::-ms-fill-upper {
}
.story_title_icons {
- font-size: calc(18px + var(--font_size_adjustment));
- padding: 10px 0 0 0;
- margin-left: 125px;
+ display: flex;
+ width: 100%;
+ padding: 10px;
+ justify-content: space-between;
}
.settings_menu {
@@ -473,6 +476,20 @@ input[type="range"]::-ms-fill-upper {
padding-top: 7px;
}
+.settings_button {
+ color: var(--button_text);
+ background: var(--button_background);
+ border-color: white;
+ border-width: 1px;
+ border-radius: var(--radius_settings_button);
+ border-style:solid;
+ height: 35px;
+}
+
+.settings_button[story_gamesaved="true"] {
+ filter: brightness(40%);
+}
+
.settings_select {
color: var(--dropdown_text);
background: var(--dropdown_background);
diff --git a/templates/settings flyout.html b/templates/settings flyout.html
index e2452d17..ece421ef 100644
--- a/templates/settings flyout.html
+++ b/templates/settings flyout.html
@@ -45,12 +45,13 @@
- Running Model:
-
-
- folder_open
+ 1) Model:
+
@@ -61,16 +62,29 @@
+
+ cloud_download
+ file_download
+
- Story Name:
+ 2) Story:
- description
- folder_open
- save
- cloud_download
- file_download
+
+
+
+
+
diff --git a/themes/Darkness.css b/themes/Darkness.css
index be381135..45998443 100644
--- a/themes/Darkness.css
+++ b/themes/Darkness.css
@@ -68,6 +68,9 @@
--setting_background: #242424;
--setting_text: #e0e0e0;
+
+ --button_text: var(--setting_text);
+ --button_background: var(--setting_background);
--sample_order_select_color: #1d434a;
--sample_order_select_color_text: #e0e0e0;
@@ -143,6 +146,7 @@
--radius_buttons: 5px;
--radius_item_popup: 5px;
--radius_wi_card: 10px;
+ --radius_settings_button: 5px;
diff --git a/themes/Gruvbox Dark.css b/themes/Gruvbox Dark.css
index a1f462e3..241b55ca 100644
--- a/themes/Gruvbox Dark.css
+++ b/themes/Gruvbox Dark.css
@@ -115,6 +115,9 @@
--setting_background: var(--gruvbox-dark0-soft);
--setting_text: var(--gruvbox-light0);
+
+ --button_text: var(--setting_text);
+ --button_background: var(--setting_background);
--sample_order_select_color: var(--gruvbox-dark2);
--sample_order_select_color_text: var(--gruvbox-light2);
@@ -177,6 +180,7 @@
--radius_buttons: 0px;
--radius_item_popup: 0px;
--radius_wi_card: 0px;
+ --radius_settings_button: 5px;
/* Variables */
--flyout_menu_closed_width: 0px;
diff --git a/themes/Material You.css b/themes/Material You.css
index 5d7b5219..48054cf3 100644
--- a/themes/Material You.css
+++ b/themes/Material You.css
@@ -80,6 +80,9 @@
--setting_background: var(--surface_palette);
--setting_text: var(--on_surface_palette);
+
+ --button_text: var(--setting_text);
+ --button_background: var(--setting_background);
--sample_order_select_color: var(--primary_palette);
--sample_order_select_color_text: var(--on_primary_palette);
@@ -156,6 +159,7 @@
--radius_buttons: 5px;
--radius_item_popup: 2px;
--radius_wi_card: 5px;
+ --radius_settings_button: 5px;
diff --git a/themes/Monochrome.css b/themes/Monochrome.css
index 50c35a78..4173a606 100644
--- a/themes/Monochrome.css
+++ b/themes/Monochrome.css
@@ -68,6 +68,9 @@
--setting_background: #273141;
--setting_text: #e0e0e0;
+
+ --button_text: var(--setting_text);
+ --button_background: var(--setting_background);
--sample_order_select_color: #244c65;
--sample_order_select_color_text: #e0e0e0;
@@ -142,6 +145,7 @@
--radius_buttons: 5px;
--radius_item_popup: 2px;
--radius_wi_card: 5px;
+ --radius_settings_button: 5px;
diff --git a/themes/Unicorn.css b/themes/Unicorn.css
index 4598bd9f..97a4bae7 100644
--- a/themes/Unicorn.css
+++ b/themes/Unicorn.css
@@ -81,6 +81,9 @@
--setting_background: #e1c5c5;
--setting_text: #421d1d;
+
+ --button_text: var(--setting_text);
+ --button_background: var(--setting_background);
--sample_order_select_color: #dc6872;
--sample_order_select_color_text: #f2f1f1;
@@ -157,6 +160,7 @@
--radius_buttons: 10px;
--radius_item_popup: 5px;
--radius_wi_card: 10px;
+ --radius_settings_button: 5px;