Fix lint (again)

This commit is contained in:
Jai A
2023-03-30 15:56:19 -07:00
parent c66382d2a4
commit 446f6eba68
13 changed files with 290 additions and 307 deletions

View File

@@ -2,63 +2,59 @@
<Card class="mod-card">
<div class="card-row">
<div class="iconified-input">
<SearchIcon/>
<input
type="text"
placeholder="Search Mods"
v-model="searchFilter"
/>
<SearchIcon />
<input v-model="searchFilter" type="text" placeholder="Search Mods" />
</div>
<span class="manage">
<span class="text-combo">
Sort By
<DropdownSelect :options="['Name', 'Version', 'Author']" v-model="sortFilter" default-value="Name" class="dropdown"/>
<DropdownSelect
v-model="sortFilter"
:options="['Name', 'Version', 'Author']"
default-value="Name"
class="dropdown"
/>
</span>
<Button color="primary">
<PlusIcon />
Add Mods
</Button>
<PlusIcon />
Add Mods
</Button>
</span>
</div>
<div class="table-container">
<div class="table-row table-head">
<div class="table-cell table-text">
<Button color="success" iconOnly>
<Button color="success" icon-only>
<UpdatedIcon />
</Button>
</div>
<div class="table-cell table-text name-cell"> Name </div>
<div class="table-cell table-text"> Version </div>
<div class="table-cell table-text"> Author </div>
<div class="table-cell table-text"> Actions </div>
<div class="table-cell table-text name-cell">Name</div>
<div class="table-cell table-text">Version</div>
<div class="table-cell table-text">Author</div>
<div class="table-cell table-text">Actions</div>
</div>
<div class="table-row" v-for="mod in search" :key="mod.name">
<div v-for="mod in search" :key="mod.name" class="table-row">
<div class="table-cell table-text">
<Button v-if="mod.outdated" iconOnly>
<Button v-if="mod.outdated" icon-only>
<UpdatedIcon />
</Button>
<Button v-else disabled iconOnly>
<CheckCircleIcon/>
<Button v-else disabled icon-only>
<CheckCircleIcon />
</Button>
</div>
<div class="table-cell table-text name-cell">
<span class="mod-text">
<Avatar :src="mod.icon"/>
<Avatar :src="mod.icon" />
{{ mod.name }}
</span>
</div>
<div class="table-cell table-text"> {{ mod.version }} </div>
<div class="table-cell table-text"> {{ mod.author }} </div>
<div class="table-cell table-text">{{ mod.version }}</div>
<div class="table-cell table-text">{{ mod.author }}</div>
<div class="table-cell table-text manage">
<Button iconOnly>
<Button icon-only>
<TrashIcon />
</Button>
<input
type="checkbox"
class="switch stylized-toggle"
id="switch-1"
checked
/>
<input id="switch-1" type="checkbox" class="switch stylized-toggle" checked />
</div>
</div>
</div>
@@ -67,55 +63,66 @@
<script>
export default {
name: "Mods",
name: 'Mods',
data() {
return {
searchFilter: "",
sortFilter: "",
searchFilter: '',
sortFilter: '',
mods: [
{
name: "Fabric API",
icon: "https://cdn.modrinth.com/data/P7dR8mSH/icon.png",
version: "0.76.0+1.19.4",
author: "modmuss50",
description: "Lightweight and modular API providing common hooks and intercompatibility measures utilized by mods using the Fabric toolchain.",
outdated: true
name: 'Fabric API',
icon: 'https://cdn.modrinth.com/data/P7dR8mSH/icon.png',
version: '0.76.0+1.19.4',
author: 'modmuss50',
description:
'Lightweight and modular API providing common hooks and intercompatibility measures utilized by mods using the Fabric toolchain.',
outdated: true,
},
{
name: "Spirit",
icon: "https://cdn.modrinth.com/data/b1LdOZlE/465598dc5d89f67fb8f8de6def21240fa35e3a54.png",
version: "2.2.4",
author: "CodexAdrian",
description: "Create your own configurable mob spawner!",
outdated: true
name: 'Spirit',
icon: 'https://cdn.modrinth.com/data/b1LdOZlE/465598dc5d89f67fb8f8de6def21240fa35e3a54.png',
version: '2.2.4',
author: 'CodexAdrian',
description: 'Create your own configurable mob spawner!',
outdated: true,
},
{
name: "Botarium",
icon: "https://cdn.modrinth.com/data/2u6LRnMa/98b286b0d541ad4f9409e0af3df82ad09403f179.gif",
version: "2.0.5",
author: "CodexAdrian",
description: "A crossplatform API for devs that makes transfer and storage of items, fluids and energy easier, as well as some other helpful things",
outdated: true
name: 'Botarium',
icon: 'https://cdn.modrinth.com/data/2u6LRnMa/98b286b0d541ad4f9409e0af3df82ad09403f179.gif',
version: '2.0.5',
author: 'CodexAdrian',
description:
'A crossplatform API for devs that makes transfer and storage of items, fluids and energy easier, as well as some other helpful things',
outdated: true,
},
{
name: "Tempad",
icon: "https://cdn.modrinth.com/data/gKNwt7xu/icon.gif",
version: "2.2.4",
author: "CodexAdrian",
description: "Create a portal to anywhere from anywhere",
outdated: false
name: 'Tempad',
icon: 'https://cdn.modrinth.com/data/gKNwt7xu/icon.gif',
version: '2.2.4',
author: 'CodexAdrian',
description: 'Create a portal to anywhere from anywhere',
outdated: false,
},
{
name: "Sodium",
icon: "https://cdn.modrinth.com/data/AANobbMI/icon.png",
version: "0.4.10",
author: "jellysquid3",
description: "Modern rendering engine and client-side optimization mod for Minecraft",
outdated: false
}
]
name: 'Sodium',
icon: 'https://cdn.modrinth.com/data/AANobbMI/icon.png',
version: '0.4.10',
author: 'jellysquid3',
description: 'Modern rendering engine and client-side optimization mod for Minecraft',
outdated: false,
},
],
}
},
computed: {
search() {
const filtered = this.mods.filter((mod) => {
return mod.name.toLowerCase().includes(this.searchFilter.toLowerCase())
})
return this.updateSort(filtered, this.sortFilter)
},
},
methods: {
updateSort(projects, sort) {
switch (sort) {
@@ -148,23 +155,24 @@ export default {
return 1
}
return 0
})
})
}
},
},
computed: {
search() {
const filtered = this.mods.filter((mod) => {
return mod.name.toLowerCase().includes(this.searchFilter.toLowerCase())
})
return this.updateSort(filtered, this.sortFilter);
}
}
}
</script>
<script setup>
import { Avatar, Button, TrashIcon, PlusIcon, Card, CheckCircleIcon, SearchIcon, UpdatedIcon, DropdownSelect } from 'omorphia'
import {
Avatar,
Button,
TrashIcon,
PlusIcon,
Card,
CheckCircleIcon,
SearchIcon,
UpdatedIcon,
DropdownSelect,
} from 'omorphia'
</script>
<style scoped lang="scss">
@@ -244,4 +252,4 @@ import { Avatar, Button, TrashIcon, PlusIcon, Card, CheckCircleIcon, SearchIcon,
.dropdown {
width: 7rem !important;
}
</style>
</style>