add a scroll to top button, and cursor hints for clickables

This commit is contained in:
Ted Unangst 2022-05-05 16:41:07 -04:00
parent c34a17f1f2
commit 093eb20aee
3 changed files with 23 additions and 1 deletions

View File

@ -2,6 +2,8 @@ changelog
=== next
+ Some UI improvements to web interface.
+ Add atme class to mentions
+ Improvements to the mastodon importer.

View File

@ -57,7 +57,10 @@
</form>
</ul>
</details>
<p id="topspacer"></p>
<div id="topspacer">
<p>
<p class="nophone" onclick="window.scrollTo(0,0)">top
</div>
{{ else }}
<div id="topmenu">
<span><a id="homelink" href="/">home</a></span>

View File

@ -74,6 +74,7 @@ header > details {
overflow: auto;
opacity: 0.7;
overscroll-behavior: contain;
z-index: 2;
}
header > details[open] {
padding: 1em 1em 0em 1em;
@ -91,6 +92,9 @@ header > details[open] summary span {
header > details li {
margin: 1em 0em 1em 0em;
}
details summary {
cursor: pointer;
}
main {
max-width: 1200px;
margin: auto;
@ -131,6 +135,9 @@ label.button, button, select {
button a {
text-decoration: none;
}
button {
cursor: pointer;
}
form {
margin-top: 1em;
}
@ -296,6 +303,16 @@ img.emu {
margin: -2px;
object-fit: contain;
}
.nophone {
position: fixed;
opacity: 0.7;
cursor: pointer;
}
@media screen and (max-width: 1360px) {
.nophone {
display: none;
}
}
@media screen and (max-width: 740px) {
body {
font-size: 12px;