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

Temporary nav revert

Browse Source
This commit is contained in:
Prospector 2024-08-21 14:08:56 -07:00
parent 161fc6bb68
commit aaf125cfca
1 changed files with 83 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

141
apps/frontend/src/layouts/default.vue
View File

@ -64,81 +64,101 @@
<div <div
class="col-span-2 row-start-2 flex flex-wrap justify-center gap-1 sm:col-span-1 sm:row-start-auto" class="col-span-2 row-start-2 flex flex-wrap justify-center gap-1 sm:col-span-1 sm:row-start-auto"
> >
<ButtonStyled type="transparent"> <div class="hidden xl:contents">
<OverflowMenu <ButtonStyled type="transparent">
class="btn-dropdown-animation flex items-center gap-1 rounded-xl bg-transparent px-2 py-1" <nuxt-link to="/mods" class="temp-nav-buttons"> Mods </nuxt-link>
:options="[ </ButtonStyled>
{ <ButtonStyled type="transparent">
id: 'mods', <nuxt-link to="/resourcepacks" class="temp-nav-buttons"> Resource Packs </nuxt-link>
link: '/mods', </ButtonStyled>
}, <ButtonStyled type="transparent">
{ <nuxt-link to="/datapacks" class="temp-nav-buttons"> Data Packs </nuxt-link>
id: 'resourcepacks', </ButtonStyled>
link: '/resourcepacks', <ButtonStyled type="transparent">
}, <nuxt-link to="/modpacks" class="temp-nav-buttons"> Modpacks </nuxt-link>
{ </ButtonStyled>
id: 'datapacks', <ButtonStyled type="transparent">
link: '/datapacks', <nuxt-link to="/shaders" class="temp-nav-buttons"> Shaders </nuxt-link>
}, </ButtonStyled>
{ <ButtonStyled type="transparent">
id: 'plugins', <nuxt-link to="/plugins" class="temp-nav-buttons"> Plugins </nuxt-link>
link: '/plugins', </ButtonStyled>
}, </div>
{ <div class="contents xl:hidden">
id: 'shaders',
link: '/shaders',
},
{
id: 'modpacks',
link: '/modpacks',
},
]"
>
<CompassIcon aria-hidden="true" /> Browse
<DropdownIcon aria-hidden="true" class="h-5 w-5 text-secondary" />
<template #mods> <BoxIcon aria-hidden="true" /> Mods </template>
<template #resourcepacks>
<PaintBrushIcon aria-hidden="true" /> Resource Packs
</template>
<template #datapacks> <BracesIcon aria-hidden="true" /> Data Packs </template>
<template #plugins> <ServerIcon aria-hidden="true" /> Plugins </template>
<template #shaders> <GlassesIcon aria-hidden="true" /> Shaders </template>
<template #modpacks> <PackageOpenIcon aria-hidden="true" /> Modpacks </template>
</OverflowMenu>
</ButtonStyled>
<div class="contents lg:hidden">
<ButtonStyled type="transparent"> <ButtonStyled type="transparent">
<OverflowMenu <OverflowMenu
v-if="auth.user"
class="btn-dropdown-animation flex items-center gap-1 rounded-xl bg-transparent px-2 py-1" class="btn-dropdown-animation flex items-center gap-1 rounded-xl bg-transparent px-2 py-1"
:options="[ :options="[
{ {
id: 'servers', id: 'mods',
link: 'https://bisecthosting.com/modrinth', link: '/mods',
shown: false,
}, },
{ {
id: 'app', id: 'resourcepacks',
link: '/app', link: '/resourcepacks',
}, },
{ {
id: 'plus', id: 'datapacks',
color: 'purple', link: '/datapacks',
link: '/plus', },
{
id: 'plugins',
link: '/plugins',
},
{
id: 'shaders',
link: '/shaders',
},
{
id: 'modpacks',
link: '/modpacks',
}, },
]" ]"
> >
<HamburgerIcon aria-hidden="true" /> More <CompassIcon aria-hidden="true" /> Browse
<DropdownIcon aria-hidden="true" class="h-5 w-5 text-secondary" /> <DropdownIcon aria-hidden="true" class="h-5 w-5 text-secondary" />
<template #servers> <ServerIcon aria-hidden="true" /> Host a server </template> <template #mods> <BoxIcon aria-hidden="true" /> Mods </template>
<template #app> <DownloadIcon aria-hidden="true" /> Get Modrinth App </template> <template #resourcepacks>
<template #plus> <PaintBrushIcon aria-hidden="true" /> Resource Packs
<ArrowBigUpDashIcon aria-hidden="true" /> Upgrade to Modrinth+
</template> </template>
<template #datapacks> <BracesIcon aria-hidden="true" /> Data Packs </template>
<template #plugins> <ServerIcon aria-hidden="true" /> Plugins </template>
<template #shaders> <GlassesIcon aria-hidden="true" /> Shaders </template>
<template #modpacks> <PackageOpenIcon aria-hidden="true" /> Modpacks </template>
</OverflowMenu> </OverflowMenu>
</ButtonStyled> </ButtonStyled>
</div> </div>
<div class="hidden lg:contents"> <ButtonStyled type="transparent">
<OverflowMenu
v-if="auth.user"
class="btn-dropdown-animation flex items-center gap-1 rounded-xl bg-transparent px-2 py-1"
:options="[
{
id: 'servers',
link: 'https://bisecthosting.com/modrinth',
shown: false,
},
{
id: 'app',
link: '/app',
},
{
id: 'plus',
color: 'purple',
link: '/plus',
},
]"
>
<HamburgerIcon aria-hidden="true" /> More
<DropdownIcon aria-hidden="true" class="h-5 w-5 text-secondary" />
<template #servers> <ServerIcon aria-hidden="true" /> Host a server </template>
<template #app> <DownloadIcon aria-hidden="true" /> Get Modrinth App </template>
<template #plus>
<ArrowBigUpDashIcon aria-hidden="true" /> Upgrade to Modrinth+
</template>
</OverflowMenu>
</ButtonStyled>
<div v-if="false" class="hidden lg:contents">
<ButtonStyled v-if="false" type="transparent"> <ButtonStyled v-if="false" type="transparent">
<a href="https://bisecthosting.com/modrinth"> <a href="https://bisecthosting.com/modrinth">
<ServerIcon aria-hidden="true" /> Host a server <ServerIcon aria-hidden="true" /> Host a server
@ -1297,5 +1317,10 @@ function hideStagingBanner() {
padding-top: 0.75rem; padding-top: 0.75rem;
} }
} }
.temp-nav-buttons.router-link-exact-active {
color: var(--color-contrast) !important;
background-color: var(--color-brand-highlight) !important;
}
</style> </style>
<style src="vue-multiselect/dist/vue-multiselect.css"></style> <style src="vue-multiselect/dist/vue-multiselect.css"></style>