mirror_css/nes.css
1
0
Fork 0
mirror of https://github.com/nostalgic-css/NES.css.git synced 2025-08-29 16:59:58 +02:00
Code Issues Releases Wiki Activity

docs: fix fab and github-link

Browse Source
This commit is contained in:
BcRikko
2019-02-25 22:00:18 +09:00
parent b342405bb3
commit f24949c36f
2 changed files with 13 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
docs/index.html
View File

@@ -66,7 +66,7 @@
<div class="container"> <div class="container">
<main class="main-content"> <main class="main-content">
<a class="github-link" href="https://github.com/nostalgic-css/NES.css" target="_blank" rel="noopener" @mouseover="startAnimate" @mouseout="stopAnimate"> <a class="github-link" :class="{ active: scrollPos < 200 }" href="https://github.com/nostalgic-css/NES.css" target="_blank" rel="noopener" @mouseover="startAnimate" @mouseout="stopAnimate">
<p class="nes-balloon from-right">Fork me<br />on GitHub</p> <p class="nes-balloon from-right">Fork me<br />on GitHub</p>
<i class="nes-octocat" :class="animateOctocat ? 'animate' : ''"></i> <i class="nes-octocat" :class="animateOctocat ? 'animate' : ''"></i>
</a> </a>
@@ -199,7 +199,7 @@
</div> </div>
<!-- FAB Button --> <!-- FAB Button -->
<button type="button" class="nes-btn is-error scroll-btn" v-show="scrollPos > 500" @click="toTop"><span>&lt;</span></button> <button type="button" class="nes-btn is-error scroll-btn" :class="{ active: scrollPos > 500 }" @click="toTop"><span>&lt;</span></button>
</div> </div>
</div> </div>
</body> </body>

14
docs/style.css
View File

@@ -96,13 +96,17 @@ h2 > a {
/* github link */ /* github link */
.github-link { .github-link {
position: fixed; position: fixed;
top: 10px; top: 100px;
right: 10px; right: -240px;
z-index: 999; z-index: 999;
display: flex; display: flex;
height: 100px; height: 100px;
color: #333; color: #333;
text-decoration: none; text-decoration: none;
transition: all 0.3s ease;
}
.github-link.active {
right: 10px;
} }
.github-link:hover { .github-link:hover {
text-decoration: none; text-decoration: none;
@@ -269,9 +273,13 @@ h3.topic-title > i {
/* Scroll back to top */ /* Scroll back to top */
.scroll-btn { .scroll-btn {
position: fixed; position: fixed;
bottom: 2rem; bottom: -60px;
right: 2rem; right: 2rem;
box-shadow: 0 5px 20px rgba(0,0,0,.6); box-shadow: 0 5px 20px rgba(0,0,0,.6);
transition: all 0.3s ease;
}
.scroll-btn.active {
bottom: 25px;
} }
.scroll-btn > span { .scroll-btn > span {
display: block; display: block;