Update to layouts
This commit is contained in:
parent
e3477124cf
commit
50e66ba905
@ -1,5 +1,7 @@
|
|||||||
@import url('https://fonts.googleapis.com/css?family=Exo+2:300,400,500&display=swap');
|
@import url('https://fonts.googleapis.com/css?family=Exo+2:300,400,500&display=swap');
|
||||||
|
|
||||||
|
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');
|
||||||
|
|
||||||
@import 'tailwindcss/base';
|
@import 'tailwindcss/base';
|
||||||
|
|
||||||
@import 'tailwindcss/components';
|
@import 'tailwindcss/components';
|
||||||
|
@ -1,26 +1,38 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<footer>
|
<footer>
|
||||||
<div class="footer-nav">
|
<FooterNav
|
||||||
<nuxt-link to="/about"><p class="header-link">about</p></nuxt-link>
|
link="/about"
|
||||||
</div>
|
icon="person"
|
||||||
<div class="footer-nav">
|
text="about"
|
||||||
<nuxt-link to="/games"><p class="header-link">game profile</p></nuxt-link>
|
/>
|
||||||
</div>
|
<FooterNav
|
||||||
<div class="footer-nav">
|
link="/games"
|
||||||
<nuxt-link to="/sns"><p class="header-link">social media</p></nuxt-link>
|
icon="videogame_asset"
|
||||||
</div>
|
text="game profile"
|
||||||
<div class="footer-nav">
|
/>
|
||||||
<a href="//blog.nanao.moe"><p class="header-link">blog</p></a>
|
<FooterNav
|
||||||
</div>
|
link="/sns"
|
||||||
|
icon="contacts"
|
||||||
|
text="social media"
|
||||||
|
/>
|
||||||
|
<FooterNav
|
||||||
|
link="//blog.nanao.moe"
|
||||||
|
icon="rss_feed"
|
||||||
|
text="blog"
|
||||||
|
external="true"
|
||||||
|
/>
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
import FooterNav from "./FooterNav";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
FooterNav
|
||||||
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@ -28,7 +40,9 @@ export default {
|
|||||||
footer {
|
footer {
|
||||||
@apply h-16 w-full flex flex-row justify-start items-center;
|
@apply h-16 w-full flex flex-row justify-start items-center;
|
||||||
}
|
}
|
||||||
.footer-nav {
|
@screen md {
|
||||||
@apply w-1/4 flex flex-row justify-center items-end;
|
.footer-nav p {
|
||||||
|
@apply text-base;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
39
components/FooterNav.vue
Normal file
39
components/FooterNav.vue
Normal file
@ -0,0 +1,39 @@
|
|||||||
|
<template>
|
||||||
|
<div :class="getCurrentClasses()">
|
||||||
|
<a :href="link" v-if="external">
|
||||||
|
<i class="material-icons md-24">{{ icon }}</i>
|
||||||
|
<p class="header-link">{{ text }}</p>
|
||||||
|
</a>
|
||||||
|
<nuxt-link :to="link" v-else>
|
||||||
|
<i class="material-icons md-24">{{ icon }}</i>
|
||||||
|
<p class="header-link">{{ text }}</p>
|
||||||
|
</nuxt-link>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: [ 'link', 'text','external', 'icon' ],
|
||||||
|
methods: {
|
||||||
|
getCurrentClasses() {
|
||||||
|
if(this.link == this.$nuxt.$route.path) {
|
||||||
|
return ['footer-nav','selected'];
|
||||||
|
}
|
||||||
|
return ['footer-nav'];
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style>
|
||||||
|
.footer-nav {
|
||||||
|
@apply w-1/4 transition-bg;
|
||||||
|
}
|
||||||
|
.footer-nav a {
|
||||||
|
@apply w-full h-full flex flex-col justify-end items-center py-2;
|
||||||
|
}
|
||||||
|
.footer-nav p {
|
||||||
|
@apply text-xs;
|
||||||
|
}
|
||||||
|
.footer-nav.selected {
|
||||||
|
background-color: rgba(0,0,0,0.5);
|
||||||
|
}
|
||||||
|
</style>
|
@ -8,59 +8,78 @@
|
|||||||
<ul>
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
<p><a href="https://p.eagate.573.jp/game/sdvx/v/">SOUND VOLTEX VIVID WAVE</a></p>
|
<p><a href="https://p.eagate.573.jp/game/sdvx/v/">SOUND VOLTEX VIVID WAVE</a></p>
|
||||||
|
<p>Player Name: YUIKA283</p>
|
||||||
<p>ID: SV-6457-6694</p>
|
<p>ID: SV-6457-6694</p>
|
||||||
</li>
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><a href="https://maimai.sega.com">maimai DX</a></p>
|
||||||
|
<p>Player Name: YUIKA283</p>
|
||||||
|
<p>ID: 6027059823123</p>
|
||||||
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<p><a href="https://millionlive.idolmaster.jp/theaterdays/">THE IDOLM@STER Million Live: Theater Days</a></p>
|
<p><a href="https://millionlive.idolmaster.jp/theaterdays/">THE IDOLM@STER Million Live: Theater Days</a></p>
|
||||||
|
<p>Player Name: Damillora</p>
|
||||||
<p>ID: CGTEDUQ4</p>
|
<p>ID: CGTEDUQ4</p>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<p><a href="https://arcaea.lowiro.com">Arcaea</a></p>
|
<p><a href="https://arcaea.lowiro.com">Arcaea</a></p>
|
||||||
|
<p>Player Name: Damillora</p>
|
||||||
<p>ID: 264202217</p>
|
<p>ID: 264202217</p>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<p><a href="http://t7s.jp">Tokyo 7th Sisters</a></p>
|
<p><a href="http://t7s.jp">Tokyo 7th Sisters</a></p>
|
||||||
|
<p>Player Name: Damillora</p>
|
||||||
<p>ID: M2mXkWk</p>
|
<p>ID: M2mXkWk</p>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<p><a href="https://bang-dream.bushimo.jp/">BanG Dream! Girls Band Party (JP)</a></p>
|
<p><a href="https://bang-dream.bushimo.jp/">BanG Dream! Girls Band Party (JP)</a></p>
|
||||||
|
<p>Player Name: Damillora</p>
|
||||||
<p>ID: 106205253</p>
|
<p>ID: 106205253</p>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<p><a href="https://lovelive-sif.bushimo.jp/">Love Live! School Idol Festival (JP)</a></p>
|
<p><a href="https://lovelive-sif.bushimo.jp/">Love Live! School Idol Festival (JP)</a></p>
|
||||||
|
<p>Player Name: Damillora</p>
|
||||||
<p>ID: 755897396</p>
|
<p>ID: 755897396</p>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<p><a href="https://www.en.revuestarlight-relive.com/">Revue Starlight Re LIVE (EN)</a></p>
|
<p><a href="https://www.en.revuestarlight-relive.com/">Revue Starlight Re LIVE (EN)</a></p>
|
||||||
|
<p>Player Name: [RS]Damillora</p>
|
||||||
<p>ID: 2490812618</p>
|
<p>ID: 2490812618</p>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<p><a href="https://shadowverse.com/">Shadowverse</a></p>
|
<p><a href="https://shadowverse.com/">Shadowverse</a></p>
|
||||||
|
<p>Player Name: Damillora</p>
|
||||||
<p>ID: 778908673</p>
|
<p>ID: 778908673</p>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<p><a href="https://nogikoi.jp/">Nogikoi</a></p>
|
<p><a href="https://nogikoi.jp/">Nogikoi</a></p>
|
||||||
|
<p>Player Name: -</p>
|
||||||
<p>ID: 1673068678</p>
|
<p>ID: 1673068678</p>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<p><a href="https://shinycolors.idolmaster.jp">THE IDOLM@STER: Shiny Colors</a></p>
|
<p><a href="https://shinycolors.idolmaster.jp">THE IDOLM@STER: Shiny Colors</a></p>
|
||||||
|
<p>Player Name: Damillora</p>
|
||||||
<p>ID: ePmtJyTwzn</p>
|
<p>ID: ePmtJyTwzn</p>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<p><a href="https://keyahina-unisonair.com/">UNI'S ON AIR</a></p>
|
<p><a href="https://keyahina-unisonair.com/">UNI'S ON AIR</a></p>
|
||||||
|
<p>Player Name: Damillora</p>
|
||||||
<p>ID: y2medy4d</p>
|
<p>ID: y2medy4d</p>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<p><a href="https://www.cue-liber.jp/">CUE!</a></p>
|
<p><a href="https://www.cue-liber.jp/">CUE!</a></p>
|
||||||
|
<p>Player Name: Damillora</p>
|
||||||
<p>ID: 37132287893</p>
|
<p>ID: 37132287893</p>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<p><a href="https://lovelive-as.bushimo.jp/">Love Live ! School idol festival ALL STARS</a></p>
|
<p><a href="https://lovelive-as.bushimo.jp/">Love Live ! School idol festival ALL STARS</a></p>
|
||||||
|
<p>Player Name: -</p>
|
||||||
<p>ID: (soon)</p>
|
<p>ID: (soon)</p>
|
||||||
</li>
|
</li>
|
||||||
<!--
|
<!--
|
||||||
<li>
|
<li>
|
||||||
<p><a href=""></a></p>
|
<p><a href=""></a></p>
|
||||||
|
<p>Player Name: </p>
|
||||||
<p>ID: </p>
|
<p>ID: </p>
|
||||||
</li>
|
</li>
|
||||||
-->
|
-->
|
||||||
|
@ -7,12 +7,10 @@
|
|||||||
<li>
|
<li>
|
||||||
<p>YouTube:</p>
|
<p>YouTube:</p>
|
||||||
<p><a href="/channel">Damillora</a></p>
|
<p><a href="/channel">Damillora</a></p>
|
||||||
<p><a href="/ArchivesOfAYurikoP">Archives of a YurikoP</a></p>
|
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<p>Twitter:</p>
|
<p>Twitter:</p>
|
||||||
<p><a href="/twitter">Damillora</a></p>
|
<p><a href="/twitter">Damillora</a></p>
|
||||||
<p><a href="/twittermitsumine">mitsumine_dmi</a></p>
|
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</p>
|
</p>
|
||||||
|
Loading…
Reference in New Issue
Block a user