Bommels05/Modrinth
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Visual fixes

Browse Source
This commit is contained in:
Geometrically 2021-01-29 20:49:13 -07:00
parent 9d62931af9
commit 01703aff43
No known key found for this signature in database
GPG Key ID: 90C056FDC8FC9FF0
3 changed files with 92 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

136
layouts/default.vue
View File

@ -17,77 +17,81 @@
<NuxtLink to="/mods" class="tab"> <NuxtLink to="/mods" class="tab">
<span>Mods</span> <span>Mods</span>
</NuxtLink> </NuxtLink>
<div v-if="this.$auth.loggedIn" class="section"> <client-only>
<NuxtLink to="/dashboard/projects" class="tab"> <div v-if="this.$auth.loggedIn" class="section">
<span>Dashboard</span> <NuxtLink to="/dashboard/projects" class="tab">
</NuxtLink> <span>Dashboard</span>
</div> </NuxtLink>
</div>
</client-only>
</div> </div>
</section> </section>
<section class="column-grow"> <section class="column-grow">
<template v-if="this.$auth.loggedIn"> <client-only>
<section class="user-controls"> <template v-if="this.$auth.loggedIn">
<div <section class="user-controls">
v-click-outside="hideDropdown" <div
class="dropdown" v-click-outside="hideDropdown"
:class="{ open: isDropdownOpen }" class="dropdown"
> :class="{ open: isDropdownOpen }"
<button class="control" @click="toggleDropdown"> >
<div class="avatar"> <button class="control" @click="toggleDropdown">
<span>{{ this.$auth.user.username }}</span> <div class="avatar">
<img :src="this.$auth.user.avatar_url" class="icon" /> <span>{{ this.$auth.user.username }}</span>
</div> <img :src="this.$auth.user.avatar_url" class="icon" />
<DropdownIcon class="dropdown-icon" /> </div>
</button> <DropdownIcon class="dropdown-icon" />
<div class="content"> </button>
<ul v-if="isDropdownOpen" @click="hideDropdown"> <div class="content">
<li> <ul v-if="isDropdownOpen" @click="hideDropdown">
<NuxtLink :to="userUrl"> <li>
<UserIcon /> <NuxtLink :to="userUrl">
<span>Profile</span> <UserIcon />
</NuxtLink> <span>Profile</span>
</li> </NuxtLink>
<li> </li>
<NuxtLink to="/dashboard/notifications"> <li>
<NotificationIcon /> <NuxtLink to="/dashboard/notifications">
<span>Notifications</span> <NotificationIcon />
</NuxtLink> <span>Notifications</span>
</li> </NuxtLink>
<!--<li v-tooltip="'Not implemented yet'" class="hidden"> </li>
<NuxtLink :to="userTeamsUrl" disabled> <!--<li v-tooltip="'Not implemented yet'" class="hidden">
<UsersIcon /> <NuxtLink :to="userTeamsUrl" disabled>
<span>Teams</span> <UsersIcon />
</NuxtLink> <span>Teams</span>
</li>--> </NuxtLink>
<li> </li>-->
<button @click="changeTheme"> <li>
<MoonIcon v-if="$colorMode.value === 'light'" /> <button @click="changeTheme">
<SunIcon v-else /> <MoonIcon v-if="$colorMode.value === 'light'" />
<span v-if="$colorMode.value === 'light'"> <SunIcon v-else />
<span v-if="$colorMode.value === 'light'">
Dark Mode</span Dark Mode</span
> >
<span v-else>Light Mode</span> <span v-else>Light Mode</span>
</button> </button>
</li> </li>
<hr /> <hr />
<li> <li>
<button @click="logout"> <button @click="logout">
<LogOutIcon /> <LogOutIcon />
<span>Log Out</span> <span>Log Out</span>
</button> </button>
</li> </li>
</ul> </ul>
</div>
</div> </div>
</div> </section>
</section> </template>
</template> <template v-else>
<template v-else> <section class="auth-prompt">
<section class="auth-prompt"> <a :href="authUrl" class="log-in-button"
<a :href="authUrl" class="log-in-button" ><GitHubIcon aria-hidden="true" />Sign In with GitHub</a
><GitHubIcon aria-hidden="true" />Sign In with GitHub</a >
> </section>
</section> </template>
</template> </client-only>
</section> </section>
</section> </section>
</header> </header>

19
pages/dashboard/settings.vue
View File

@ -93,12 +93,9 @@
will be removed from our servers. This cannot be reversed, so be will be removed from our servers. This cannot be reversed, so be
careful!</span careful!</span
> >
<input <div type="button" class="button" @click="deleteAccount">
type="button" Delete Account
class="button" </div>
value="Delete Account"
@click="deleteAccount"
/>
</label> </label>
</section> </section>
</DashboardPage> </DashboardPage>
@ -257,5 +254,15 @@ label {
input[type='button']:hover { input[type='button']:hover {
cursor: pointer; cursor: pointer;
} }
div,
a {
text-align: center;
height: fit-content;
flex: 1;
}
div:hover {
cursor: pointer;
}
} }
</style> </style>

14
pages/mod/_id/versions.vue
View File

@ -68,9 +68,11 @@
</tr> </tr>
</tbody> </tbody>
</table> </table>
<nuxt-link v-if="currentMember" to="newversion" class="button"> <div class="new-version">
New Version <nuxt-link v-if="currentMember" to="newversion" class="button">
</nuxt-link> New Version
</nuxt-link>
</div>
</ModPage> </ModPage>
</template> </template>
<script> <script>
@ -294,8 +296,10 @@ table {
} }
} }
.button { .new-version {
float: right; width: 100%;
text-align: right;
margin-bottom: var(--spacing-card-md);
} }
@media screen and (max-width: 400px) { @media screen and (max-width: 400px) {