scroll up button arrow and hover

This commit is contained in:
ReznoRMichael 2021-02-16 23:54:50 +01:00
parent f2302d1f9b
commit 8469fdf228
4 changed files with 47 additions and 5 deletions

View file

@ -145,7 +145,8 @@
<link rel="icon" href="favicon.png"><link href="main.css" rel="stylesheet"></head>
<body>
<button class="scroll-up-button hidden">^</button>
<button class="scroll-up-button hidden"><div class="scroll-up-button-arrow"></div>
</button>
<div id="background"></div>
@ -230,15 +231,13 @@
v1.0.4. Work-In-Progress. Feedback: <a href="https://steamcommunity.com/app/367520/discussions/0/2915472677711090083/" target="_blank"><i class="simpleicon-steam"></i>Steam Discussions</a> <a href="https://steamcommunity.com/sharedfiles/filedetails/?id=2209910193" target="_blank"><i class="simpleicon-steam"></i>Steam Guide</a>.<br>
Programmed, written and created by 🉑 <a href="https://github.com/ReznoRMichael/hollow-knight-completion-check" target="_blank">rezno[R]</a> &copy; 20202021<br>
<a href="https://www.paypal.me/ReznoRMichael" target="_blank"><i class="simpleicon-paypal"></i>Support Tool (PayPal)<i class="simpleicon-paypal"></i></a>
</p>
<div style="margin-bottom: 20px;"></div>
<p class="smalltext">
Valuable Tool supporters: <b>Klaudia, David, Rohit, Dominic.</b><br>
Donate any amount and you will be immortalized here!
Donate any amount and you will get immortalized here!
</p>
</div> <!-- end content -->

View file

@ -516,6 +516,9 @@ a.button:visited {
width: 50px;
height: 50px;
text-decoration: none;
background-color: #1e4d6c;
border: 0;
outline: 0;
position: fixed;
right: 1px;
bottom: 0;
@ -524,6 +527,24 @@ a.button:visited {
transition: all 0.3s ease;
}
.scroll-up-button:hover {
background-color: #2e5d7c;
cursor: pointer;
}
.scroll-up-button-arrow {
position: relative;
left: 12px;
top: 3px;
width: 12px;
height: 12px;
border: solid #aac7d4;
border-width: 2px 0px 0px 2px;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.hidden {
display: none;
}

View file

@ -409,6 +409,9 @@ a.button:visited {
width: 50px;
height: 50px;
text-decoration: none;
background-color: #1e4d6c;
border: 0;
outline: 0;
position: fixed;
right: 1px;
bottom: 0;
@ -417,6 +420,24 @@ a.button:visited {
transition: all 0.3s ease;
}
.scroll-up-button:hover {
background-color: #2e5d7c;
cursor: pointer;
}
.scroll-up-button-arrow {
position: relative;
left: 12px;
top: 3px;
width: 12px;
height: 12px;
border: solid #aac7d4;
border-width: 2px 0px 0px 2px;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.hidden {
display: none;
}

View file

@ -30,7 +30,8 @@
</head>
<body>
<button class="scroll-up-button hidden">^</button>
<button class="scroll-up-button hidden"><div class="scroll-up-button-arrow"></div>
</button>
<div id="background"></div>