Assets extensions visual touch-up

This commit is contained in:
Cohee
2023-10-09 17:21:12 +03:00
parent c9f9bcfc86
commit b84e6e07d1
4 changed files with 29 additions and 19 deletions

View File

@ -103,39 +103,39 @@ input.extension_missing[type="checkbox"] {
} }
/** LEFT COLUMN **/ /** LEFT COLUMN **/
#extensions_settings>.expression_settings { #extensions_settings>#assets_ui {
order: 1; order: 1;
} }
#extensions_settings>.background_settings { #extensions_settings>.expression_settings {
order: 2; order: 2;
} }
#extensions_settings>.sd_settings { #extensions_settings>.background_settings {
order: 3; order: 3;
} }
#extensions_settings>#tts_settings { #extensions_settings>.sd_settings {
order: 4; order: 4;
} }
#extensions_settings>#rvc_settings { #extensions_settings>#tts_settings {
order: 5; order: 5;
} }
#extensions_settings>.objective-settings { #extensions_settings>#rvc_settings {
order: 6; order: 6;
} }
#extensions_settings>#speech_recognition_settings { #extensions_settings>.objective-settings {
order: 7; order: 7;
} }
#extensions_settings>#audio_settings { #extensions_settings>#speech_recognition_settings {
order: 8; order: 8;
} }
#extensions_settings>#assets_ui { #extensions_settings>#audio_settings {
order: 9; order: 9;
} }

View File

@ -48,8 +48,10 @@ function downloadAssetsList(url) {
} }
console.debug(DEBUG_PREFIX, "Updated available assets to", availableAssets); console.debug(DEBUG_PREFIX, "Updated available assets to", availableAssets);
// First extensions, then everything else
const assetTypes = Object.keys(availableAssets).sort((a, b) => (a === 'extension') ? -1 : (b === 'extension') ? 1 : 0);
for (const assetType in availableAssets) { for (const assetType of assetTypes) {
let assetTypeMenu = $('<div />', { id: "assets_audio_ambient_div", class: "assets-list-div" }); let assetTypeMenu = $('<div />', { id: "assets_audio_ambient_div", class: "assets-list-div" });
assetTypeMenu.append(`<h3>${assetType}</h3>`) assetTypeMenu.append(`<h3>${assetType}</h3>`)
for (const i in availableAssets[assetType]) { for (const i in availableAssets[assetType]) {

View File

@ -13,6 +13,10 @@
padding: 5px; padding: 5px;
} }
.assets-list-div h3 {
text-transform: capitalize;
}
.assets-list-div i { .assets-list-div i {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -26,6 +30,10 @@
margin-left: 10px; margin-left: 10px;
} }
.assets-list-div i span:first-of-type {
font-weight: bold;
}
.asset-download-button { .asset-download-button {
position: relative; position: relative;
width: 50px; width: 50px;

View File

@ -1,7 +1,7 @@
<div id="assets_ui"> <div id="assets_ui">
<div class="inline-drawer"> <div class="inline-drawer">
<div class="inline-drawer-toggle inline-drawer-header"> <div class="inline-drawer-toggle inline-drawer-header">
<b>Assets</b> <b>Download Extensions & Assets</b>
<div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div> <div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
</div> </div>
<div class="inline-drawer-content"> <div class="inline-drawer-content">