Remove sticky TOC and add "go top" link

Better posts view on smartphone
This commit is contained in:
Knah Tsaeb 2024-12-06 12:13:25 +01:00
parent 6c14601ff3
commit 2b704bf775
3 changed files with 21 additions and 2 deletions

View file

@ -363,7 +363,6 @@ article {
background-color: var(--background-secondary-color); background-color: var(--background-secondary-color);
border: 1px solid var(--primary-lighten); border: 1px solid var(--primary-lighten);
border-radius: calc(var(--default-space) * 1.2); border-radius: calc(var(--default-space) * 1.2);
position: sticky;
top: calc(var(--default-space) * 2); top: calc(var(--default-space) * 2);
font-size: 1.1rem; font-size: 1.1rem;
z-index: 1; z-index: 1;
@ -407,6 +406,18 @@ pre {
padding: calc(var(--default-space) * 4); padding: calc(var(--default-space) * 4);
} }
#backtop {
bottom: 0;
border-radius: 4px;
background-color: var(--primary);
color: var(--text-color-secondary);
display: block;
margin: .5%;
padding: 1rem 4rem;
position: fixed;
right: 0;
}
/* Smaller than 992px */ /* Smaller than 992px */
@media (max-width: 992px) { @media (max-width: 992px) {
@ -442,6 +453,13 @@ pre {
.last-pics { .last-pics {
grid-area: 6 / 1 / 7 / 2; grid-area: 6 / 1 / 7 / 2;
} }
.blog {
.card {
box-shadow: none;
width: 100%;
}
}
} }
/* Larger than 992px */ /* Larger than 992px */

View file

@ -1,7 +1,7 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="fr"> <html lang="fr">
<?php require 'head.php'; ?> <?php require 'head.php'; ?>
<body> <body id="top">
<?php require 'nav.php'; ?> <?php require 'nav.php'; ?>
<?= $content; ?> <?= $content; ?>
<?php require 'footer.php'; ?> <?php require 'footer.php'; ?>

View file

@ -1,3 +1,4 @@
<a href="#top" id="backtop">Top</a>
<footer> <footer>
Self made by <a href="/about">Knah Tsaeb</a> all detail in <a href="/colophon">/colophon</a> page <a href="/contact">/contact</a> Self made by <a href="/about">Knah Tsaeb</a> all detail in <a href="/colophon">/colophon</a> page <a href="/contact">/contact</a>
<p> <p>