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

Fix for mobile

Browse Source
This commit is contained in:
ebolam
2022-08-11 15:33:10 -04:00
parent 5f25883fa3
commit c38b793425
2 changed files with 49 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
static/koboldai.css
View File

@@ -263,6 +263,13 @@
cursor: pointer; cursor: pointer;
} }
@media only screen and (max-aspect-ratio: 7/5) {
/* mobile */
.menu_icon.hidden {
display: inline-block !important;
}
}
@media only screen and (max-aspect-ratio: 7/5) { @media only screen and (max-aspect-ratio: 7/5) {
.menu_pin { .menu_pin {
display: none; display: none;
@@ -468,6 +475,13 @@
grid-area: lefticon; grid-area: lefticon;
} }
@media only screen and (max-aspect-ratio: 7/5) {
/* mobile */
.right_menu_icon.hidden {
display: inline-block !important;
}
}
.rightSideMenu { .rightSideMenu {
height: 100%; height: 100%;
width: 0; width: 0;
@@ -488,9 +502,12 @@
width: var(--flyout_menu_width); width: var(--flyout_menu_width);
} }
@media only screen and (min-aspect-ratio: 7/5) {
/* Desktop Mode */
.rightSideMenu.pinned { .rightSideMenu.pinned {
width: var(--flyout_menu_width); width: var(--flyout_menu_width);
} }
}
.rightSideMenu .flyout_menu_contents { .rightSideMenu .flyout_menu_contents {
overflow-x: hidden; overflow-x: hidden;
@@ -498,6 +515,12 @@
height: calc(100vh - 150px); height: calc(100vh - 150px);
} }
@media only screen and (max-aspect-ratio: 7/5) {
/* mobile */
.story_menu_pin {
display: none;
}
}
table.server_vars { table.server_vars {
@@ -629,7 +652,7 @@ body {
grid-template-areas: "menuicon gamescreen lefticon" grid-template-areas: "menuicon gamescreen lefticon"
"menuicon options lefticon" "menuicon options lefticon"
"menuicon inputrow lefticon"; "menuicon inputrow lefticon";
grid-template-columns: 30px auto 20px; grid-template-columns: 30px auto 30px;
grid-template-rows: auto min-content 100px; grid-template-rows: auto min-content 100px;
} }
} }
@@ -1118,3 +1141,9 @@ body.NotConnected {
.cursor { .cursor {
cursor: pointer; cursor: pointer;
} }
@font-face {
font-family: 'Material Symbols Outlined';
font-style: normal;
src: url(/material-symbols.woff) format('woff');
}

44
static/koboldai.js
View File

@@ -1958,36 +1958,28 @@ function close_menus() {
} }
function toggle_flyout(x) { function toggle_flyout(x) {
if (document.getElementById("SideMenu").classList.contains("pinned")) { if (document.getElementById("SideMenu").classList.contains("open")) {
//do nothing x.classList.remove("change");
document.getElementById("SideMenu").classList.remove("open");
document.getElementById("main-grid").classList.remove("menu-open");
} else { } else {
if (document.getElementById("SideMenu").classList.contains("open")) { x.classList.add("change");
x.classList.remove("change"); document.getElementById("SideMenu").classList.add("open");
document.getElementById("SideMenu").classList.remove("open"); document.getElementById("main-grid").classList.add("menu-open");
document.getElementById("main-grid").classList.remove("menu-open"); document.getElementById("menu_pin").classList.remove("hidden");
} else { }
x.classList.add("change");
document.getElementById("SideMenu").classList.add("open");
document.getElementById("main-grid").classList.add("menu-open");
document.getElementById("menu_pin").classList.remove("hidden");
}
}
} }
function toggle_flyout_right(x) { function toggle_flyout_right(x) {
if (document.getElementById("rightSideMenu").classList.contains("pinned")) { if (document.getElementById("rightSideMenu").classList.contains("open")) {
//do nothing x.classList.remove("change");
document.getElementById("rightSideMenu").classList.remove("open");
document.getElementById("main-grid").classList.remove("story_menu-open");
} else { } else {
if (document.getElementById("rightSideMenu").classList.contains("open")) { x.classList.add("change");
x.classList.remove("change"); document.getElementById("rightSideMenu").classList.add("open");
document.getElementById("rightSideMenu").classList.remove("open"); document.getElementById("main-grid").classList.add("story_menu-open");
document.getElementById("main-grid").classList.remove("story_menu-open"); document.getElementById("story_menu_pin").classList.remove("hidden");
} else {
x.classList.add("change");
document.getElementById("rightSideMenu").classList.add("open");
document.getElementById("main-grid").classList.add("story_menu-open");
document.getElementById("story_menu_pin").classList.remove("hidden");
}
} }
} }
@@ -2045,7 +2037,7 @@ function setCookie(cname, cvalue, exdays=60) {
const d = new Date(); const d = new Date();
d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000)); d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
let expires = "expires="+d.toUTCString(); let expires = "expires="+d.toUTCString();
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/"; document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/;samesite=none;domain=koboldai.org";
} }
function getCookie(cname) { function getCookie(cname) {