Add "view on github" ribbon
This commit is contained in:
parent
849b623f04
commit
af137c4b24
2 changed files with 30 additions and 0 deletions
|
@ -6,6 +6,10 @@
|
|||
<scroll-to-top>
|
||||
</scroll-to-top>
|
||||
|
||||
<a class="ribbon" href="https://github.com/darkwiiplayer/js">
|
||||
View on Github
|
||||
</a>
|
||||
|
||||
<h1>DarkWiiPlayer/JS</h1>
|
||||
<section>
|
||||
<p style="text-align: center;">
|
||||
|
|
|
@ -193,3 +193,29 @@ a.back::before {
|
|||
margin-right: .8em;
|
||||
transform: scale(2, 1);
|
||||
}
|
||||
|
||||
.ribbon {
|
||||
--color: var(--color-hl);
|
||||
left: 0;
|
||||
top: 0;
|
||||
position: fixed;
|
||||
transform: rotate(315deg) translate(-5.4em);
|
||||
|
||||
background-color: var(--color);
|
||||
border: .16em dashed #ffffff;
|
||||
color: #ffffff;
|
||||
font-family: sans-serif;
|
||||
font-size: .8rem;
|
||||
letter-spacing: .1em;
|
||||
line-height: 1.4em;
|
||||
padding: .2em 5em;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
|
||||
box-shadow:
|
||||
0 0 0 3px var(--color),
|
||||
0 0 20px -3px rgba(0, 0, 0, 0.5);
|
||||
text-shadow:
|
||||
0 0 0 #ffffff,
|
||||
0 0 5px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue