extras
/
mue
mirror of https://github.com/mue/mue.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

chore: simplify and standardise added UI

This commit is contained in:
alexsparkes 2023-09-22 17:07:52 +01:00
parent 901833da91
commit 79261a6ab4
2 changed files with 34 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
src/components/modals/main/marketplace/sections/Added.jsx
View File

@ -193,10 +193,8 @@ export default class Added extends PureComponent {
if (this.state.installed.length === 0) {
return (
<>
<div className="flexTopMarketplace">
<div className="flexTopMarketplace topAddons">
<span className="mainTitle">{variables.getMessage('modals.main.navbar.addons')}</span>
</div>
<div className="filter">
{sideLoadBackendElements()}
<button
className="sideload"
@ -234,33 +232,35 @@ export default class Added extends PureComponent {
return (
<>
<span className="mainTitle">{variables.getMessage('modals.main.addons.added')}</span>
<div className="filter">
{sideLoadBackendElements()}
<div className="buttonSection">
<button
className="sideload"
onClick={() => document.getElementById('file-input').click()}
>
{variables.getMessage('modals.main.addons.sideload.title')}
<MdCode />
</button>
<button className="addToMue sideload updateCheck" onClick={() => this.updateCheck()}>
<MdUpdate />
{variables.getMessage('modals.main.addons.check_updates')}
</button>
<div className="flexTopMarketplace topAddons">
<span className="mainTitle">{variables.getMessage('modals.main.addons.added')}</span>
<div className="filter">
{sideLoadBackendElements()}
<div className="buttonSection">
<button className="addToMue sideload updateCheck" onClick={() => this.updateCheck()}>
<MdUpdate />
{variables.getMessage('modals.main.addons.check_updates')}
</button>
<button
className="sideload"
onClick={() => document.getElementById('file-input').click()}
>
{variables.getMessage('modals.main.addons.sideload.title')}
<MdCode />
</button>
</div>
</div>
<Dropdown
label={variables.getMessage('modals.main.addons.sort.title')}
name="sortAddons"
onChange={(value) => this.sortAddons(value)}
>
<option value="newest">{variables.getMessage('modals.main.addons.sort.newest')}</option>
<option value="oldest">{variables.getMessage('modals.main.addons.sort.oldest')}</option>
<option value="a-z">{variables.getMessage('modals.main.addons.sort.a_z')}</option>
<option value="z-a">{variables.getMessage('modals.main.addons.sort.z_a')}</option>
</Dropdown>
</div>
<Dropdown
label={variables.getMessage('modals.main.addons.sort.title')}
name="sortAddons"
onChange={(value) => this.sortAddons(value)}
>
<option value="newest">{variables.getMessage('modals.main.addons.sort.newest')}</option>
<option value="oldest">{variables.getMessage('modals.main.addons.sort.oldest')}</option>
<option value="a-z">{variables.getMessage('modals.main.addons.sort.a_z')}</option>
<option value="z-a">{variables.getMessage('modals.main.addons.sort.z_a')}</option>
</Dropdown>
<Items
items={this.state.installed}
filter=""

14
src/components/modals/main/scss/marketplace/_main.scss
View File

@ -378,17 +378,9 @@ p.author {
.filter {
display: flex;
flex-flow: row;
padding: 15px;
gap: 15px;
justify-content: space-between;
align-items: center;
margin-top: 15px;
@include themed {
background: t($modal-sidebar);
border-radius: t($borderRadius);
box-shadow: 0 0 0 4px t($modal-sidebarActive);
}
.MuiFormControl-root {
margin-bottom: 10px;
@ -614,3 +606,9 @@ a.collectionButton {
font-size: 30px;
}
}
.topAddons {
display: flex;
align-items: center;
justify-content: space-between;
}