summaryrefslogtreecommitdiff
path: root/src/components/Navigation.vue
diff options
context:
space:
mode:
authorgumi <git@gumi.ca>2019-07-26 11:18:20 -0400
committergumi <git@gumi.ca>2019-07-26 11:19:08 -0400
commit22cdc70221ddc7036eb29fea8e0ddcf1dc6108c8 (patch)
treeab8b297395a0ea493d17ee1d4baacd346e4a3d60 /src/components/Navigation.vue
parente24b06c72aebdb4cd3d75e83d83fcd7a39820ebb (diff)
downloadwebsite-22cdc70221ddc7036eb29fea8e0ddcf1dc6108c8.tar.gz
website-22cdc70221ddc7036eb29fea8e0ddcf1dc6108c8.tar.bz2
website-22cdc70221ddc7036eb29fea8e0ddcf1dc6108c8.tar.xz
website-22cdc70221ddc7036eb29fea8e0ddcf1dc6108c8.zip
apply webhint suggestions
Diffstat (limited to 'src/components/Navigation.vue')
-rw-r--r--src/components/Navigation.vue85
1 files changed, 45 insertions, 40 deletions
diff --git a/src/components/Navigation.vue b/src/components/Navigation.vue
index 991e8e8..749bc61 100644
--- a/src/components/Navigation.vue
+++ b/src/components/Navigation.vue
@@ -1,30 +1,34 @@
<template>
<nav class="nav" id="nav">
- <a href="#nav" class="hamburger"></a>
- <ul>
- <li><router-link :class="{ 'custom-active': isHome }" :to="{ name: 'home' }">Home</router-link></li>
- <li><router-link :to="{ name: 'registration' }">Create Account</router-link></li>
- <li><a href="https://wiki.themanaworld.org/index.php/Downloads">Download</a></li>
- <li><router-link :to="{ name: 'about' }">About</router-link></li>
- <li><a href="https://wiki.themanaworld.org/index.php/FAQ">FAQ</a></li> <!-- we might want to put FAQ under About, or put About on the wiki -->
- <li><router-link :class="{ 'custom-active': isSupport }" :to="{ name: 'support' }">Support</router-link></li>
- <li><a href="https://wiki.themanaworld.org/">Wiki</a></li>
- <li><a href="https://forums.themanaworld.org/">Forums</a></li>
- </ul>
+ <a href="#nav" class="hamburger">☰</a>
+ <div>
+ <ul>
+ <li><router-link :class="{ 'custom-active': isHome }" :to="{ name: 'home' }">Home</router-link></li>
+ <li><router-link :to="{ name: 'registration' }">Create Account</router-link></li>
+ <li><a href="https://wiki.themanaworld.org/index.php/Downloads">Download</a></li>
+ <li><router-link :to="{ name: 'about' }">About</router-link></li>
+ <li><a href="https://wiki.themanaworld.org/index.php/FAQ">FAQ</a></li> <!-- we might want to put FAQ under About, or put About on the wiki -->
+ <li><router-link :class="{ 'custom-active': isSupport }" :to="{ name: 'support' }">Support</router-link></li>
+ <li><a href="https://wiki.themanaworld.org/">Wiki</a></li>
+ <li><a href="https://forums.themanaworld.org/">Forums</a></li>
+ </ul>
+ </div>
<div class="server">
<span>Server Status</span>
<ServerStatus class="status"/>
</div>
<div class="screenshots">
- <a href="https://wiki.themanaworld.org/index.php/Screenshots"></a>
+ <a href="https://wiki.themanaworld.org/index.php/Screenshots">Screenshots</a>
</div>
- <ul>
+ <div>
<span>Source Code</span>
- <li><a href="https://github.com/themanaworld">The Mana World</a></li>
- <li><a href="https://gitlab.com/evol">Evol Online</a></li>
- <li><a href="https://gitlab.com/manaplus">ManaPlus</a></li>
- <li><a href="https://github.com/bjorn/tiled">Tiled</a></li>
- </ul>
+ <ul>
+ <li><a href="https://github.com/themanaworld">The Mana World</a></li>
+ <li><a href="https://gitlab.com/evol">Evol Online</a></li>
+ <li><a href="https://gitlab.com/manaplus">ManaPlus</a></li>
+ <li><a href="https://github.com/bjorn/tiled">Tiled</a></li>
+ </ul>
+ </div>
</nav>
</template>
@@ -45,21 +49,35 @@
color: gray(50);
z-index: 300;
display: block;
-
- &::before {
- content: "☰";
- }
}
- & ul, & div {
+ & div {
background: #CBA083;
- margin: 0px;
- padding: 0px;
+ margin: 0;
+ padding: 0;
border-radius: 5px;
border: solid 1px #2f2e32;
- list-style: none;
margin-bottom: 13px;
+ & ul {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+
+ & li {
+ margin-left: 0.8ch;
+ margin-right: 0.8ch;
+
+ &:first-of-type {
+ margin-top: 0.8ch;
+ }
+
+ &:last-of-type {
+ margin-bottom: 0.8ch;
+ }
+ }
+ }
+
& span {
text-align: center;
display: block;
@@ -82,20 +100,6 @@
}
}
- & ul li {
- margin-left: 0.8ch;
- margin-right: 0.8ch;
-
- &:first-of-type {
- margin-top: 0.8ch;
- }
-
- &:last-of-type {
- margin-bottom: 0.8ch;
- }
- }
-
-
& .server > .status {
text-align: center;
font-weight: bolder;
@@ -115,6 +119,7 @@
padding: 0;
width: 133px;
height: 100px;
+ color: rgba(0, 0, 0, 0);
&:hover {
opacity: 0.8;