add servers & css for them

This commit is contained in:
blueb 2023-08-21 19:27:45 -04:00
parent 4a52fe632d
commit 56c452280f
4 changed files with 73 additions and 2 deletions

View File

@ -1192,4 +1192,22 @@ button:active,
.popup-title {
line-height: inherit;
}
}
.switches-vertical {
display: flex;
width: auto;
flex-direction: column;
flex-wrap: nowrap;
overflow-x: scroll;
}
.switch-vertical.first {
border-top-left-radius: 5px 6px!important;
border-top-right-radius: 5px 6px!important;
border-bottom-left-radius: 0px;
}
.switch-vertical.last {
border-bottom-left-radius: 5px 6px!important;
border-bottom-right-radius: 5px 6px!important;
border-top-right-radius: 0px;
}

View File

@ -41,6 +41,8 @@
"SettingsThemeLight": "light",
"SettingsThemeDark": "dark",
"SettingsKeepDownloadButton": "keep >> visible",
"SettingsServerPicker": "server picker",
"SettingsServerPickerDescription": "choose which server to download from",
"AccessibilityKeepDownloadButton": "keep the download button always visible",
"SettingsEnableDownloadPopup": "ask how to save",
"AccessibilityEnableDownloadPopup": "ask what to do with downloads",

View File

@ -13,6 +13,13 @@ export function switcher(obj) {
let items = ``;
if (obj.name === "download") {
items = obj.items;
} else if (obj.vertical) {
for (let i = 0; i < obj.items.length; i++) {
let classes = obj.items[i]["classes"] ? obj.items[i]["classes"] : [];
if (i === 0) classes.push("first");
if (i === (obj.items.length - 1)) classes.push("last");
items += `<button id="${obj.name}-${obj.items[i]["action"]}" class="switch switch-vertical${classes.length > 0 ? ' ' + classes.join(' ') : ''}" onclick="changeSwitcher('${obj.name}', '${obj.items[i]["action"]}')">${obj.items[i]["text"] ? obj.items[i]["text"] : obj.items[i]["action"]}</button>`
}
} else {
for (let i = 0; i < obj.items.length; i++) {
let classes = obj.items[i]["classes"] ? obj.items[i]["classes"] : [];
@ -22,12 +29,25 @@ export function switcher(obj) {
}
}
if (obj.noParent) return `<div id="${obj.name}" class="switches">${items}</div>`;
return `<div id="${obj.name}-switcher" class="switch-container">
if (obj.noParent && obj.vertical) {
return `<div id="${obj.name}" class="switches switches-vertical">${items}</div>`
} else if (obj.noParent) {
return `<div id="${obj.name}" class="switches">${items}</div>`
}
if (obj.vertical) {
return `<div id="${obj.name}-switcher" class="switch-container">
${obj.subtitle ? `<div class="subtitle">${obj.subtitle}</div>` : ``}
<div class="switches switches-vertical">${items}</div>
${obj.explanation ? `<div class="explanation">${obj.explanation}</div>` : ``}
</div>`
} else {
return `<div id="${obj.name}-switcher" class="switch-container">
${obj.subtitle ? `<div class="subtitle">${obj.subtitle}</div>` : ``}
<div class="switches">${items}</div>
${obj.explanation ? `<div class="explanation">${obj.explanation}</div>` : ``}
</div>`
}
}
export function checkbox(obj) {
let paddings = ["bottom-margin", "top-margin", "no-margin", "top-margin-only"];

View File

@ -451,6 +451,37 @@ export default function(obj) {
aria: t("AccessibilityEnableDownloadPopup")
}])
})
+ settingsCategory({
name: "serverpicker",
title: t('SettingsServerPicker'),
explanation: t('SettingsServerPickerDescription'),
body: switcher({
name: "serverpicker",
vertical: true,
items: [{
action: "co.wuk.sh",
text: "co.wuk.sh"
}, {
action: "api.c0ba.lt",
text: "api.c0ba.lt"
}, {
action: "co-api.blueb.me",
text: "co-api.blueb.me"
}, {
action: "wukko.wolfdo.gg",
text: "wukko.wolfdo.gg"
}, {
action: "api.co.749.city",
text: "api.co.749.city"
}, {
action: "cobalt-api.fluffy.tools",
text: "cobalt-api.fluffy.tools"
}, {
action: "capi.oak.li",
text: "capi.oak.li"
}]
})
})
}],
})}
${popupWithBottomButtons({