1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-07-19 13:19:39 +02:00

Mobile responsive template preparation (#2071)
Some checks failed
Publish Docker image / ci (push) Has been cancelled
Publish Docker image / Build docker image (push) Has been cancelled

* Mobile responsive template

* Fix sidebar mobile conflict

* Lint fix
This commit is contained in:
Zach Gollwitzer 2025-04-09 12:42:46 -04:00 committed by GitHub
parent 2bc3887262
commit 52d170e36c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 117 additions and 74 deletions

View file

@ -7,7 +7,7 @@ export default class extends Controller {
config: Object,
};
static targets = ["leftPanel", "rightPanel", "content"];
static targets = ["leftPanel", "leftPanelMobile", "rightPanel", "content"];
initialize() {
this.leftPanelOpen = this.configValue.left_panel.is_open;
@ -20,6 +20,16 @@ export default class extends Controller {
this.#persistPreference("show_sidebar", this.leftPanelOpen);
}
toggleLeftPanelMobile() {
if (this.leftPanelOpen) {
this.leftPanelMobileTarget.classList.remove("hidden");
this.leftPanelOpen = false;
} else {
this.leftPanelMobileTarget.classList.add("hidden");
this.leftPanelOpen = true;
}
}
toggleRightPanel() {
this.rightPanelOpen = !this.rightPanelOpen;
this.#updatePanelWidths();
@ -27,7 +37,6 @@ export default class extends Controller {
}
#updatePanelWidths() {
this.contentTarget.style.maxWidth = `${this.#contentMaxWidth()}px`;
this.leftPanelTarget.style.width = `${this.#leftPanelWidth()}px`;
this.rightPanelTarget.style.width = `${this.#rightPanelWidth()}px`;
this.rightPanelTarget.style.overflow = this.#rightPanelOverflow();
@ -61,18 +70,6 @@ export default class extends Controller {
return "hidden";
}
#contentMaxWidth() {
if (!this.leftPanelOpen && !this.rightPanelOpen) {
return 1024;
}
if (this.leftPanelOpen && !this.rightPanelOpen) {
return 896;
}
return 768;
}
#persistPreference(field, value) {
fetch(`/users/${this.userIdValue}`, {
method: "PATCH",