summaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/components/Navigation.vue85
-rw-r--r--src/components/ServerStatus.vue5
2 files changed, 48 insertions, 42 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;
diff --git a/src/components/ServerStatus.vue b/src/components/ServerStatus.vue
index c35e916..cb4c2e6 100644
--- a/src/components/ServerStatus.vue
+++ b/src/components/ServerStatus.vue
@@ -1,7 +1,7 @@
<template>
<aside>
- <a v-if="Online && Players" target="_blank" href="https://server.themanaworld.org">Online: {{Players}} players</a>
- <a v-if="Online && !Players" target="_blank" href="https://server.themanaworld.org">Online</a>
+ <a v-if="Online && Players" target="_blank" rel="noopener" href="https://server.themanaworld.org">Online: {{Players}} players</a>
+ <a v-if="Online && !Players" target="_blank" rel="noopener" href="https://server.themanaworld.org">Online</a>
<a v-if="!Online" class="offline" target="_blank" rel="noopener" href="https://www.youtube.com/watch?v=ILVfzx5Pe-A">Offline</a>
</aside>
</template>
@@ -9,6 +9,7 @@
<style scoped>
aside :any-link {
text-decoration: none;
+ text-shadow: 0 0 1ch #e1d6cf;
color: green;
display: block;
padding: 8px;