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 === next
+ Some UI improvements to web interface.
+ Add atme class to mentions + Add atme class to mentions
+ Improvements to the mastodon importer. + Improvements to the mastodon importer.

View File

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

View File

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