tomasalias/AstralRinth
1
0
Fork 0
forked from didirus/AstralRinth
Code Pull Requests Activity

Switch to Nuxt

Browse Source
This commit is contained in:
Mikhail Oleynikov
2020-07-14 16:42:46 +03:00
parent b11d5514b9
commit 25203934e6
26 changed files with 6393 additions and 5133 deletions
Download Patch File Download Diff File Expand all files Collapse all files

137
pages/dashboard/projects.vue Normal file
View File

@@ -0,0 +1,137 @@
<template>
<div class="content">
<h2>My projects</h2>
<div class="section-header">
<h3>Mods</h3>
<button>Create a new mod</button>
</div>
<table>
<thead>
<tr>
<th></th>
<th>Name</th>
<th>Role</th>
<th>Status</th>
<th>Downloads</th>
<th>Last updated</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<img class="rounded-md" src="~/assets/images/aof-mini.png" />
</td>
<td>Finite Water</td>
<td>Owner</td>
<td><span class="badge green">Active</span></td>
<td>274</td>
<td>Nov 4, 2019</td>
</tr>
<tr>
<td>
<img class="rounded-md" src="~/assets/images/aof-mini.png" />
</td>
<td>Vivatech</td>
<td>Contributor</td>
<td><span class="badge green">Active</span></td>
<td>2,381</td>
<td>Jul 31, 2019</td>
</tr>
</tbody>
</table>
<div class="section-header">
<h3>Modpacks</h3>
<button>Create a new modpack</button>
</div>
<table>
<thead>
<tr>
<th></th>
<th>Name</th>
<th>Role</th>
<th>Status</th>
<th>Downloads</th>
<th>Last updated</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<img class="rounded-md" src="~/assets/images/aof-mini.png" />
</td>
<td>All of Fabric Mini</td>
<td>Contributor</td>
<td><span class="badge red">Abandoned</span></td>
<td>357</td>
<td>Apr 1, 2020</td>
</tr>
</tbody>
</table>
</div>
</template>
<style lang="scss">
.section-header {
display: flex;
margin-bottom: 1rem;
& > * {
margin-right: 1rem;
}
}
table {
background: var(--color-bg);
border-collapse: collapse;
border-radius: 0.5rem;
box-shadow: 0 2px 3px 1px var(--color-grey-2);
table-layout: fixed;
width: 100%;
* {
text-align: left;
}
tr:not(:last-child),
tr:first-child {
th,
td {
border-bottom: 1px solid var(--color-grey-2);
}
}
th,
td {
&:first-child {
text-align: center;
width: 5%;
}
&:nth-child(2) {
padding-left: 0;
width: 30%;
}
}
th {
color: #718096;
font-size: 0.8rem;
letter-spacing: 0.02rem;
margin-bottom: 0.5rem;
margin-top: 1.5rem;
padding: 1rem 1rem;
text-transform: uppercase;
}
td {
padding: 0.25rem 1rem;
img {
height: 3rem;
width: 3rem;
}
}
}
</style>

44
pages/modpacks.vue Normal file
View File

@@ -0,0 +1,44 @@
<template>
<div class="content">
<h2>Modpacks</h2>
<div class="columns">
<div class="column-grow-4">
<section id="search-pagination">
<div class="iconified-input column-grow-2">
<input
id="search"
type="search"
name="search"
placeholder="Search modpacks"
/>
<svg
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<circle cx="11" cy="11" r="8" />
<line x1="21" y1="21" x2="16.65" y2="16.65" />
</svg>
</div>
<div class="pagination column-grow-1">
pagination
</div>
</section>
</div>
<section class="column-grow-1">
<h3>Filters</h3>
</section>
</div>
</div>
</template>
<style lang="scss">
#search-pagination {
align-items: center;
display: flex;
justify-content: space-between;
}
</style>