m4xx1m/dv-community-map
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve legend display on mobile

Browse Source
This commit is contained in:
Pyro Nicampt committed 2024-12-31 19:20:55 -06:00
1 parent 22122c2bd8
commit b5fdfb3fb8
3 files changed
+55 -37
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

legend.js
+4 -3
View File
@@ -75,12 +75,13 @@ document.addEventListener('DOMContentLoaded', async () => {
addSettingEntry(thisSetting, settingsPanel);
}
const legend = document.getElementById('legend');
const legendContents = document.getElementById('legendContents');
const legendButton = document.getElementById('legendButton');
const legendArrow = legendButton.children[0];
let legendState = true;
let legendButtonEvent = e => {
legendArrow.style.transform = `rotate(${legendState ? 180 : 0}deg) translateY(${legendState ? -3 : 3}px)`;
legend.style.transform = `translateX(${legendState ? 0 : legendButton.clientWidth-legend.clientWidth}px)`;
legendArrow.style.transform = `rotate(${legendState ? 180 : 0}deg) translateY(${legendState ? -0 : 0}px)`;
legend.style.transform = `translateX(${legendState ? 0 : -legendContents.clientWidth}px)`;
legendState = !legendState;
};
legendButton.addEventListener('click', legendButtonEvent);
@@ -90,8 +91,8 @@ document.addEventListener('DOMContentLoaded', async () => {
function addSettingEntry(thisSetting, parent, indent=0){
thisSetting.divContainer = document.createElement('div');
thisSetting.divContainer.innerHTML = ' '.repeat(indent);
thisSetting.inputElement = document.createElement('input');
thisSetting.inputElement.style.margin = `0 0.5em 0 ${indent}em`;
thisSetting.labelElement = document.createElement('label');
parent.appendChild(thisSetting.divContainer);
thisSetting.divContainer.appendChild(thisSetting.inputElement);