thepaperpilot/chromatic-lattice
1
0
Fork 0
Code Issues Pull requests Releases Activity Actions

Added forums link to nav bar

Browse source
This commit is contained in:
thepaperpilot 2021-09-19 21:06:56 -05:00
parent 16467bb0d9
commit bc8622f219
1 changed files with 30 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
src/components/system/Nav.vue
View file

@ -27,43 +27,57 @@
</li> </li>
</ul> </ul>
</div> </div>
<div>
<a href="https://forums.moddingtree.com/" target="_blank">
<tooltip display="Forums" bottom yoffset="5px">
<span class="material-icons">forum</span>
</tooltip>
</a>
</div>
<div @click="openDialog('Info')"> <div @click="openDialog('Info')">
<tooltip display="Info" bottom class="info"> <tooltip display="Info" bottom class="info">
<span class="material-icons">info</span> <span class="material-icons">info</span>
</tooltip> </tooltip>
</div> </div>
<div @click="openDialog('Saves')"> <div @click="openDialog('Saves')">
<tooltip display="Saves" bottom class="saves" xoffset="-20px"> <tooltip display="Saves" bottom xoffset="-20px">
<span class="material-icons">library_books</span> <span class="material-icons">library_books</span>
</tooltip> </tooltip>
</div> </div>
<div @click="openDialog('Options')"> <div @click="openDialog('Options')">
<tooltip display="Options" bottom class="options" xoffset="-70px"> <tooltip display="Options" bottom xoffset="-66px">
<span class="material-icons">settings</span> <span class="material-icons">settings</span>
</tooltip> </tooltip>
</div> </div>
</div> </div>
<div v-else class="overlay-nav" v-bind="$attrs"> <div v-else class="overlay-nav" v-bind="$attrs">
<div @click="openDialog('Changelog')" class="version-container"> <div @click="openDialog('Changelog')" class="version-container">
<tooltip display="Changelog" right xoffset="25%" class="version" <tooltip display="Changelog" right xoffset="25%" class="version">
><span>v{{ version }}</span></tooltip <span>v{{ version }}</span>
> </tooltip>
</div> </div>
<div @click="openDialog('Saves')"> <div @click="openDialog('Saves')">
<tooltip display="Saves" right class="saves" <tooltip display="Saves" right>
><span class="material-icons">library_books</span></tooltip <span class="material-icons">library_books</span>
> </tooltip>
</div> </div>
<div @click="openDialog('Options')"> <div @click="openDialog('Options')">
<tooltip display="Options" right class="options"> <tooltip display="Options" right>
<span class="material-icons">settings</span> <span class="material-icons">settings</span>
</tooltip> </tooltip>
</div> </div>
<div @click="openDialog('Info')"> <div @click="openDialog('Info')">
<tooltip display="Info" right class="info"> <tooltip display="Info" right>
<span class="material-icons">info</span> <span class="material-icons">info</span>
</tooltip> </tooltip>
</div> </div>
<div>
<a href="https://forums.moddingtree.com/" target="_blank">
<tooltip display="Forums" right xoffset="7px">
<span class="material-icons">forum</span>
</tooltip>
</a>
</div>
<div class="discord"> <div class="discord">
<span @click="openDialog('Info')" class="material-icons">discord</span> <span @click="openDialog('Info')" class="material-icons">discord</span>
<ul class="discord-links"> <ul class="discord-links">
@ -259,8 +273,12 @@ export default defineComponent({
} }
.version:hover span { .version:hover span {
transform-origin: 0% 50%;
transform: scale(1.2, 1.2);
text-shadow: 5px 0 10px var(--points), -3px 0 12px var(--points); text-shadow: 5px 0 10px var(--points), -3px 0 12px var(--points);
} }
.nav a,
.overlay-nav a {
color: var(--foreground);
text-shadow: none;
}
</style> </style>