style: ✨ add HTMX
This commit is contained in:
parent
a2c6842b71
commit
b8e449006b
16 changed files with 299 additions and 84 deletions
|
@ -1,11 +1,16 @@
|
|||
<?php
|
||||
|
||||
$FONT_AWESOME_ARRAY=[
|
||||
'markdown' => '<svg xmlns="http://www.w3.org/2000/svg" height="16" width="20" viewBox="0 0 640 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d="M593.8 59.1H46.2C20.7 59.1 0 79.8 0 105.2v301.5c0 25.5 20.7 46.2 46.2 46.2h547.7c25.5 0 46.2-20.7 46.1-46.1V105.2c0-25.4-20.7-46.1-46.2-46.1zM338.5 360.6H277v-120l-61.5 76.9-61.5-76.9v120H92.3V151.4h61.5l61.5 76.9 61.5-76.9h61.5v209.2zm135.3 3.1L381.5 256H443V151.4h61.5V256H566z"/></svg>',
|
||||
'image' => '<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d="M0 96C0 60.7 28.7 32 64 32H448c35.3 0 64 28.7 64 64V416c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V96zM323.8 202.5c-4.5-6.6-11.9-10.5-19.8-10.5s-15.4 3.9-19.8 10.5l-87 127.6L170.7 297c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h96 32H424c8.9 0 17.1-4.9 21.2-12.8s3.6-17.4-1.4-24.7l-120-176zM112 192a48 48 0 1 0 0-96 48 48 0 1 0 0 96z"/></svg>',
|
||||
'images' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M160 32c-35.3 0-64 28.7-64 64V320c0 35.3 28.7 64 64 64H512c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H160zM396 138.7l96 144c4.9 7.4 5.4 16.8 1.2 24.6S480.9 320 472 320H328 280 200c-9.2 0-17.6-5.3-21.6-13.6s-2.9-18.2 2.9-25.4l64-80c4.6-5.7 11.4-9 18.7-9s14.2 3.3 18.7 9l17.3 21.6 56-84C360.5 132 368 128 376 128s15.5 4 20 10.7zM192 128a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zM48 120c0-13.3-10.7-24-24-24S0 106.7 0 120V344c0 75.1 60.9 136 136 136H456c13.3 0 24-10.7 24-24s-10.7-24-24-24H136c-48.6 0-88-39.4-88-88V120z"/></svg>',
|
||||
'folder' => '<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d="M64 480H448c35.3 0 64-28.7 64-64V160c0-35.3-28.7-64-64-64H288c-10.1 0-19.6-4.7-25.6-12.8L243.2 57.6C231.1 41.5 212.1 32 192 32H64C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64z"/></svg>',
|
||||
'rss' => '<svg xmlns="http://www.w3.org/2000/svg" height="16" width="14" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d="M64 32C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64zM96 136c0-13.3 10.7-24 24-24c137 0 248 111 248 248c0 13.3-10.7 24-24 24s-24-10.7-24-24c0-110.5-89.5-200-200-200c-13.3 0-24-10.7-24-24zm0 96c0-13.3 10.7-24 24-24c83.9 0 152 68.1 152 152c0 13.3-10.7 24-24 24s-24-10.7-24-24c0-57.4-46.6-104-104-104c-13.3 0-24-10.7-24-24zm0 120a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z"/></svg>'
|
||||
'bars' => '<svg xmlns="http://www.w3.org/2000/svg" class="fa-icn" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M0 96C0 78.3 14.3 64 32 64H416c17.7 0 32 14.3 32 32s-14.3 32-32 32H32C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32H416c17.7 0 32 14.3 32 32s-14.3 32-32 32H32c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32H32c-17.7 0-32-14.3-32-32s14.3-32 32-32H416c17.7 0 32 14.3 32 32z"/></svg>',
|
||||
'markdown' => '<svg xmlns="http://www.w3.org/2000/svg" height="16" width="20" class="fa-icn" viewBox="0 0 640 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d="M593.8 59.1H46.2C20.7 59.1 0 79.8 0 105.2v301.5c0 25.5 20.7 46.2 46.2 46.2h547.7c25.5 0 46.2-20.7 46.1-46.1V105.2c0-25.4-20.7-46.1-46.2-46.1zM338.5 360.6H277v-120l-61.5 76.9-61.5-76.9v120H92.3V151.4h61.5l61.5 76.9 61.5-76.9h61.5v209.2zm135.3 3.1L381.5 256H443V151.4h61.5V256H566z"/></svg>',
|
||||
'image' => '<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16" class="fa-icn" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d="M0 96C0 60.7 28.7 32 64 32H448c35.3 0 64 28.7 64 64V416c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V96zM323.8 202.5c-4.5-6.6-11.9-10.5-19.8-10.5s-15.4 3.9-19.8 10.5l-87 127.6L170.7 297c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h96 32H424c8.9 0 17.1-4.9 21.2-12.8s3.6-17.4-1.4-24.7l-120-176zM112 192a48 48 0 1 0 0-96 48 48 0 1 0 0 96z"/></svg>',
|
||||
'images' => '<svg xmlns="http://www.w3.org/2000/svg" class="fa-icn" viewBox="0 0 576 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M160 32c-35.3 0-64 28.7-64 64V320c0 35.3 28.7 64 64 64H512c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H160zM396 138.7l96 144c4.9 7.4 5.4 16.8 1.2 24.6S480.9 320 472 320H328 280 200c-9.2 0-17.6-5.3-21.6-13.6s-2.9-18.2 2.9-25.4l64-80c4.6-5.7 11.4-9 18.7-9s14.2 3.3 18.7 9l17.3 21.6 56-84C360.5 132 368 128 376 128s15.5 4 20 10.7zM192 128a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zM48 120c0-13.3-10.7-24-24-24S0 106.7 0 120V344c0 75.1 60.9 136 136 136H456c13.3 0 24-10.7 24-24s-10.7-24-24-24H136c-48.6 0-88-39.4-88-88V120z"/></svg>',
|
||||
'turn-up' => '<svg xmlns="http://www.w3.org/2000/svg" class="fa-icn" viewBox="0 0 384 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M350 177.5c3.8-8.8 2-19-4.6-26l-136-144C204.9 2.7 198.6 0 192 0s-12.9 2.7-17.4 7.5l-136 144c-6.6 7-8.4 17.2-4.6 26s12.5 14.5 22 14.5h88l0 192c0 17.7-14.3 32-32 32H32c-17.7 0-32 14.3-32 32v32c0 17.7 14.3 32 32 32l80 0c70.7 0 128-57.3 128-128l0-192h88c9.6 0 18.2-5.7 22-14.5z"/></svg>',
|
||||
'rectangle-list' => '<svg xmlns="http://www.w3.org/2000/svg" class="fa-icn" viewBox="0 0 576 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M64 80c-8.8 0-16 7.2-16 16V416c0 8.8 7.2 16 16 16H512c8.8 0 16-7.2 16-16V96c0-8.8-7.2-16-16-16H64zM0 96C0 60.7 28.7 32 64 32H512c35.3 0 64 28.7 64 64V416c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V96zm96 64a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm104 0c0-13.3 10.7-24 24-24H448c13.3 0 24 10.7 24 24s-10.7 24-24 24H224c-13.3 0-24-10.7-24-24zm0 96c0-13.3 10.7-24 24-24H448c13.3 0 24 10.7 24 24s-10.7 24-24 24H224c-13.3 0-24-10.7-24-24zm0 96c0-13.3 10.7-24 24-24H448c13.3 0 24 10.7 24 24s-10.7 24-24 24H224c-13.3 0-24-10.7-24-24zm-72-64a32 32 0 1 1 0-64 32 32 0 1 1 0 64zM96 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z"/></svg>',
|
||||
'folder-tree' => '<svg xmlns="http://www.w3.org/2000/svg" class="fa-icn" viewBox="0 0 576 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M64 32C64 14.3 49.7 0 32 0S0 14.3 0 32v96V384c0 35.3 28.7 64 64 64H256V384H64V160H256V96H64V32zM288 192c0 17.7 14.3 32 32 32H544c17.7 0 32-14.3 32-32V64c0-17.7-14.3-32-32-32H445.3c-8.5 0-16.6-3.4-22.6-9.4L409.4 9.4c-6-6-14.1-9.4-22.6-9.4H320c-17.7 0-32 14.3-32 32V192zm0 288c0 17.7 14.3 32 32 32H544c17.7 0 32-14.3 32-32V352c0-17.7-14.3-32-32-32H445.3c-8.5 0-16.6-3.4-22.6-9.4l-13.3-13.3c-6-6-14.1-9.4-22.6-9.4H320c-17.7 0-32 14.3-32 32V480z"/></svg>',
|
||||
'folder' => '<svg xmlns="http://www.w3.org/2000/svg" class="fa-icn" height="16" width="16" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d="M64 480H448c35.3 0 64-28.7 64-64V160c0-35.3-28.7-64-64-64H288c-10.1 0-19.6-4.7-25.6-12.8L243.2 57.6C231.1 41.5 212.1 32 192 32H64C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64z"/></svg>',
|
||||
'folder-open' => '<svg xmlns="http://www.w3.org/2000/svg" class="fa-icn" viewBox="0 0 576 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M88.7 223.8L0 375.8V96C0 60.7 28.7 32 64 32H181.5c17 0 33.3 6.7 45.3 18.7l26.5 26.5c12 12 28.3 18.7 45.3 18.7H416c35.3 0 64 28.7 64 64v32H144c-22.8 0-43.8 12.1-55.3 31.8zm27.6 16.1C122.1 230 132.6 224 144 224H544c11.5 0 22 6.1 27.7 16.1s5.7 22.2-.1 32.1l-112 192C453.9 474 443.4 480 432 480H32c-11.5 0-22-6.1-27.7-16.1s-5.7-22.2 .1-32.1l112-192z"/></svg>',
|
||||
'rss' => '<svg xmlns="http://www.w3.org/2000/svg" height="16" class="fa-icn" width="14" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d="M64 32C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64zM96 136c0-13.3 10.7-24 24-24c137 0 248 111 248 248c0 13.3-10.7 24-24 24s-24-10.7-24-24c0-110.5-89.5-200-200-200c-13.3 0-24-10.7-24-24zm0 96c0-13.3 10.7-24 24-24c83.9 0 152 68.1 152 152c0 13.3-10.7 24-24 24s-24-10.7-24-24c0-57.4-46.6-104-104-104c-13.3 0-24-10.7-24-24zm0 120a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z"/></svg>'
|
||||
];
|
||||
|
||||
?>
|
|
@ -133,6 +133,25 @@ function render_twig($template, $args = []) {
|
|||
echo $twig->render($template, $args);
|
||||
}
|
||||
|
||||
function try_render_ajax($SURI) {
|
||||
global $adapter;
|
||||
|
||||
$match = null;
|
||||
preg_match('/^\/ajax\/([^\/]+)(.*)$/', $SURI, $match);
|
||||
|
||||
if(!isset($match)) {
|
||||
die();
|
||||
}
|
||||
|
||||
$post = $adapter->get_post_by_path($match[2]);
|
||||
$subposts = $adapter->get_subposts_by_path($match[2]);
|
||||
|
||||
echo render_twig('ajax/' . $match[1] . '.html', [
|
||||
"post" => $post,
|
||||
"subposts" => $subposts
|
||||
]);
|
||||
}
|
||||
|
||||
function try_render_post($SURI) {
|
||||
global $adapter;
|
||||
|
||||
|
@ -281,6 +300,8 @@ function generate_website($SURI) {
|
|||
header('Content-Type: application/json');
|
||||
echo json_encode($adapter->perform_post_search($_GET['search_query']));
|
||||
}
|
||||
} elseif(preg_match('/^\/ajax\//', $SURI)) {
|
||||
try_render_ajax($SURI);
|
||||
} elseif(preg_match('/^\/feed(?:\/(rss|atom)(.*))?$/', $SURI, $match)) {
|
||||
$feed = $adapter->get_laminas_feed($match[2] ?? '/', $match[1] ?? 'rss');
|
||||
|
||||
|
@ -289,7 +310,7 @@ function generate_website($SURI) {
|
|||
header('Etag: W/"' . $SURI . '/' . strtotime($feed['feed_ts']) . '"');
|
||||
|
||||
echo $feed['feed'];
|
||||
} elseif(true) {
|
||||
} else {
|
||||
try_render_post($SURI);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -3,9 +3,9 @@ Allow from all
|
|||
Options +Indexes
|
||||
|
||||
<filesMatch ".(flv|gif|ico|jpg|jpeg|mp4|mpeg|png|svg|swf|webp)$">
|
||||
Header set Cache-Control "max-age=315360, public"
|
||||
Header set Cache-Control "max-age=60, public"
|
||||
</filesMatch>
|
||||
|
||||
<filesMatch ".(js)$">
|
||||
Header set Cache-Control "max-age=315360, public"
|
||||
Header set Cache-Control "max-age=60, public"
|
||||
</filesMatch>
|
|
@ -61,6 +61,8 @@ class BannerHandler {
|
|||
}
|
||||
|
||||
updateTranslation() {
|
||||
this.bannerContainerDOM = document.getElementById("main_header")
|
||||
|
||||
const bannerTranslateMax = -this.bannerDOM.clientHeight + this.bannerContainerDOM.clientHeight
|
||||
|
||||
const bannerPercentageFrom = this.currentBannerData.from || 0;
|
||||
|
@ -120,7 +122,7 @@ class BannerHandler {
|
|||
}
|
||||
|
||||
updateTick() {
|
||||
console.log("tick")
|
||||
|
||||
|
||||
const nextPhase = this.getPhase() % 1;
|
||||
|
||||
|
@ -150,11 +152,17 @@ class BannerHandler {
|
|||
}
|
||||
}
|
||||
|
||||
var bannerHandler = new BannerHandler(
|
||||
document.getElementById("main_header"),
|
||||
document.getElementById("main_banner_img"),
|
||||
document.getElementById("main_banner_img_link"))
|
||||
let bannerHandler = null;
|
||||
|
||||
bannerHandler.start()
|
||||
function startBanner() {
|
||||
if(bannerHandler !== null) {
|
||||
return;
|
||||
}
|
||||
|
||||
// addEventListener("resize", () => update_banner(banner, banner_container));
|
||||
bannerHandler = new BannerHandler(
|
||||
document.getElementById("main_header"),
|
||||
document.getElementById("main_banner_img"),
|
||||
document.getElementById("main_banner_img_link"))
|
||||
|
||||
bannerHandler.start()
|
||||
}
|
||||
|
|
|
@ -6,9 +6,11 @@
|
|||
padding: 0;
|
||||
}
|
||||
|
||||
svg {
|
||||
.fa-icn {
|
||||
fill: var(--text_1);
|
||||
padding-top: 0.1rem;
|
||||
height: 1em;
|
||||
vertical-align: -0.125em;
|
||||
}
|
||||
|
||||
body {
|
||||
|
@ -175,6 +177,35 @@ a:hover {
|
|||
background: var(--bg_2);
|
||||
}
|
||||
|
||||
body::before {
|
||||
content: '';
|
||||
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
background-image: url('/static/three-dots.svg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
|
||||
opacity: 0;
|
||||
|
||||
z-index: 10;
|
||||
pointer-events: none;
|
||||
|
||||
transition: opacity 0.2s;
|
||||
}
|
||||
body.htmx-request::before {
|
||||
opacity: 1;
|
||||
|
||||
transition-delay: 0.5s;
|
||||
}
|
||||
|
||||
#post_file_bar {
|
||||
position: sticky;
|
||||
|
||||
|
@ -196,35 +227,14 @@ a:hover {
|
|||
padding: 0px;
|
||||
}
|
||||
|
||||
#post_file_titles li {
|
||||
#post_file_titles > li {
|
||||
padding: 0.2rem 0.8rem;
|
||||
|
||||
font-style: bold;
|
||||
font-size: 1.3rem;
|
||||
font-size: 1.5rem;
|
||||
|
||||
background: var(--highlight_1);
|
||||
}
|
||||
#post_file_titles li:hover {
|
||||
background: var(--highlight_0) !important;
|
||||
}
|
||||
|
||||
#post_file_bar_dirbtn {
|
||||
margin-left: 0.15rem;
|
||||
background: var(--bg_2) !important;
|
||||
}
|
||||
#post_file_bar #dir_collapse {
|
||||
display: none;
|
||||
}
|
||||
#post_file_bar #dir_collapse:checked + #post_file_bar_dirbtn {
|
||||
background: var(--highlight_1) !important;
|
||||
}
|
||||
|
||||
.directory {
|
||||
display: none;
|
||||
}
|
||||
#dir_collapse:checked ~ .directory {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#post_file_path {
|
||||
width: 100%;
|
||||
|
@ -232,6 +242,8 @@ a:hover {
|
|||
padding-left: 0.5rem;
|
||||
|
||||
background: var(--highlight_1);
|
||||
|
||||
font-size: 1.1rem;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
@ -247,6 +259,76 @@ a:hover {
|
|||
padding-right: 0.2rem;
|
||||
}
|
||||
|
||||
.navbar-expand {
|
||||
background-color: var(--bg_3);
|
||||
|
||||
border: 0.15rem solid var(--highlight_1);
|
||||
border-top: none;
|
||||
|
||||
border-radius: 0 0 0.2rem 0.2rem;
|
||||
overflow: clip;
|
||||
|
||||
padding-bottom: 0.2rem;
|
||||
padding-left: 0.3rem;
|
||||
|
||||
max-height: 80vh;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.navbar-full-path {
|
||||
width: 100%;
|
||||
font-style: italic;
|
||||
padding-left: 0.2rem;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
list-style-type: none;
|
||||
|
||||
overflow-x: scroll;
|
||||
overflow-y: hidden;
|
||||
|
||||
white-space: nowrap;
|
||||
}
|
||||
.navbar-full-path li {
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.navbar-folder-list span, .navbar-folder-list label {
|
||||
width: 1rem;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
}
|
||||
.navbar-folder-list ul, .navbar-folder-list {
|
||||
list-style: none;
|
||||
padding-left: 0.4rem;
|
||||
margin-left: 0.4rem;
|
||||
|
||||
border-left: 1px solid var(--text_border);
|
||||
}
|
||||
.navbar-folder-list a:hover {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
.folder-listing input {
|
||||
display: none;
|
||||
}
|
||||
.folder-listing input + ul {
|
||||
display: none;
|
||||
}
|
||||
.folder-listing input:checked + ul {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#navbar-expand-label {
|
||||
cursor: pointer;
|
||||
}
|
||||
#navbar-expander, .navbar-expand {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#navbar-expander:checked + .navbar-expand {
|
||||
display: block;
|
||||
}
|
||||
|
||||
article {
|
||||
background: var(--bg_3);
|
||||
|
||||
|
|
1
www/static/htmx.min.js
vendored
Normal file
1
www/static/htmx.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
15
www/static/three-dots.svg
Normal file
15
www/static/three-dots.svg
Normal file
|
@ -0,0 +1,15 @@
|
|||
<!-- By Sam Herbert (@sherb), for everyone. More @ http://goo.gl/7AJzbL -->
|
||||
<svg width="120" height="30" viewBox="0 0 120 30" xmlns="http://www.w3.org/2000/svg" fill="#fff">
|
||||
<circle cx="15" cy="15" r="15">
|
||||
<animate attributeName="r" from="15" to="15" begin="0s" dur="0.8s" values="15;9;15" calcMode="linear" repeatCount="indefinite"/>
|
||||
<animate attributeName="fill-opacity" from="1" to="1" begin="0s" dur="0.8s" values="1;.5;1" calcMode="linear" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle cx="60" cy="15" r="9" fill-opacity="0.3">
|
||||
<animate attributeName="r" from="9" to="9" begin="0s" dur="0.8s" values="9;15;9" calcMode="linear" repeatCount="indefinite"/>
|
||||
<animate attributeName="fill-opacity" from="0.5" to="0.5" begin="0s" dur="0.8s" values=".5;1;.5" calcMode="linear" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle cx="105" cy="15" r="15">
|
||||
<animate attributeName="r" from="15" to="15" begin="0s" dur="0.8s" values="15;9;15" calcMode="linear" repeatCount="indefinite"/>
|
||||
<animate attributeName="fill-opacity" from="1" to="1" begin="0s" dur="0.8s" values="1;.5;1" calcMode="linear" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
</svg>
|
After Width: | Height: | Size: 1.2 KiB |
13
www/templates/ajax/closed_folder_listing.html
Normal file
13
www/templates/ajax/closed_folder_listing.html
Normal file
|
@ -0,0 +1,13 @@
|
|||
|
||||
<li class="folder-listing">
|
||||
<span hx-boost="false"
|
||||
hx-get="/ajax/open_folder_listing{{ post.post_path }}"
|
||||
hx-target="closest li"
|
||||
hx-swap="outerHTML">
|
||||
{{ fa[post.post_metadata.icon] | raw }}
|
||||
</span>
|
||||
|
||||
<a href={{post.post_path}}>
|
||||
{{ post.post_metadata.title }}
|
||||
</a>
|
||||
</li>
|
4
www/templates/ajax/folder_listing.html
Normal file
4
www/templates/ajax/folder_listing.html
Normal file
|
@ -0,0 +1,4 @@
|
|||
|
||||
{% for post in subposts %}
|
||||
{{ include('ajax/folder_listing_entry.html') }}
|
||||
{% endfor %}
|
26
www/templates/ajax/folder_listing_entry.html
Normal file
26
www/templates/ajax/folder_listing_entry.html
Normal file
|
@ -0,0 +1,26 @@
|
|||
|
||||
|
||||
<li class="folder-listing">
|
||||
{% set folder_key = random() %}
|
||||
|
||||
<label for="folder-open-{{folder_key}}"
|
||||
hx-trigger="click once queue:all"
|
||||
hx-get="/ajax/folder_listing{{post.post_path}}"
|
||||
hx-target="next ul">
|
||||
|
||||
{{ fa[post.post_metadata.icon] | raw }}
|
||||
</label>
|
||||
|
||||
<a href={{post.post_path}}>
|
||||
{{ post.post_metadata.title }}
|
||||
</a>
|
||||
|
||||
<input type="checkbox" id="folder-open-{{folder_key}}">
|
||||
<ul class="folder-listing">
|
||||
<li>
|
||||
<span>
|
||||
Loading...
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
20
www/templates/ajax/open_folder_listing.html
Normal file
20
www/templates/ajax/open_folder_listing.html
Normal file
|
@ -0,0 +1,20 @@
|
|||
|
||||
|
||||
<li class="folder-listing">
|
||||
<span hx-boost="false"
|
||||
hx-get="/ajax/closed_folder_listing{{ post.post_path }}"
|
||||
hx-target="closest li"
|
||||
hx-swap="outerHTML">
|
||||
{{ fa[post.post_metadata.icon] | raw }}
|
||||
</span>
|
||||
|
||||
<a href={{post.post_path}}>
|
||||
{{ post.post_metadata.title }}
|
||||
</a>
|
||||
|
||||
<ul class="folder-listing">
|
||||
{% for post in subposts %}
|
||||
{{ include('ajax/closed_folder_listing.html') }}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</li>
|
|
@ -17,17 +17,53 @@
|
|||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
|
||||
|
||||
|
||||
<li class="hsmol_hide" style="margin-left: auto;">
|
||||
<a href="/raw{{post.post_path}}">raw</a>
|
||||
<a href="/api/posts{{post.post_path}}">api</a>
|
||||
</li>
|
||||
<li class="hsmol_hide">
|
||||
<li style="margin-left: auto;">
|
||||
<label for="navbar-expander" id="navbar-expand-label"> {{ fa['bars'] | raw }} </label>
|
||||
<a rel="alternate" type="application/rss+xml" target="_blank"
|
||||
style="padding-left: 0.3rem;" href="/feed/rss{{post.post_path}}">
|
||||
style="padding-left: 0.3rem;" href="/feed/rss{{post.post_path}}">
|
||||
{{ fa['rss']|raw }}
|
||||
</a>
|
||||
</li>
|
||||
</menu>
|
||||
</div>
|
||||
|
||||
<input id="navbar-expander" class="navbar-expand" type="checkbox" hx-preserve>
|
||||
<div class="navbar-expand">
|
||||
Full path:
|
||||
<ul class="navbar-full-path">
|
||||
{% set split_post = post.post_path |split('/') %}
|
||||
{% for i in range(0, split_post|length - 1) %}
|
||||
<li>
|
||||
{% if i != 0 %}
|
||||
<a href="{{split_post|slice(0,i+1)|join('/')}}">
|
||||
/ {{ split_post[i] }}
|
||||
</a>
|
||||
{% else %}
|
||||
<a href="/">root</a>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
|
||||
Dev links:
|
||||
<a hx-boost="false" href="/raw{{post.post_path}}">raw</a>
|
||||
<a hx-boost="false" href="/api/posts{{post.post_path}}">api</a>
|
||||
|
||||
<h4>Folder browser: </h4>
|
||||
|
||||
<ul class="navbar-folder-list">
|
||||
<li class="folder-listing">
|
||||
<span>
|
||||
{{ fa['turn-up'] | raw}}
|
||||
</span>
|
||||
|
||||
<a href={{post.parent_path}}>..</a>
|
||||
</li>
|
||||
|
||||
{% for post in subposts %}
|
||||
{{ include('ajax/folder_listing_entry.html') }}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -17,7 +17,7 @@
|
|||
|
||||
{{ include('fragments/filepath_bar.html') }}
|
||||
|
||||
<article>
|
||||
<article id="content_article">
|
||||
{%block content_article %}
|
||||
{%endblock%}
|
||||
|
||||
|
|
|
@ -8,34 +8,6 @@
|
|||
{%endblock%}
|
||||
|
||||
{%block content_article%}
|
||||
{% if subposts|length > 0 %}
|
||||
<table class="directory">
|
||||
<h3>Art Subfolders:</h3>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th class="hsmol_hide">Name</th>
|
||||
<th>Title</th>
|
||||
<th class="entry_update_time hsmol_hide">Modified</th>
|
||||
</tr>
|
||||
{% for subpost in subposts %}
|
||||
<tr class="entry">
|
||||
<td>
|
||||
{{ fa[subpost.post_metadata.icon] | raw }}
|
||||
</td>
|
||||
<td class="hsmol_hide">
|
||||
<a href={{subpost.post_path}}>{{subpost.post_basename}}</a>
|
||||
</td>
|
||||
<td class="entry_title">
|
||||
<a href={{subpost.post_path}}>{{ subpost.post_metadata.title }}</a>
|
||||
</td>
|
||||
<td class="entry_update_time hsmol_hide">
|
||||
{{ subpost.post_update_time }}
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
{% endif %}
|
||||
|
||||
{{ content_html|raw }}
|
||||
|
||||
{% if blog_posts|length > 0 %}
|
||||
|
|
|
@ -38,6 +38,6 @@
|
|||
<span>This shouldn't happen, sorry!</span>
|
||||
{% endif %}
|
||||
|
||||
{{ post.post_content|markdown_to_html }}
|
||||
{{ content_html|raw }}
|
||||
|
||||
{%endblock%}
|
||||
|
|
|
@ -2,14 +2,24 @@
|
|||
<html>
|
||||
<head>
|
||||
<title>{{og.site_name}} - {{og.title}}</title>
|
||||
|
||||
<link rel="stylesheet" href="/static/dergstyle.css">
|
||||
|
||||
<link rel="stylesheet" href="/static/modest.css">
|
||||
<link rel="stylesheet" href="/static/solarized-dark.css">
|
||||
|
||||
<link rel="stylesheet" href="/static/directorystyle.css">
|
||||
<link rel="stylesheet" href="/static/article_blop.css">
|
||||
<link rel="stylesheet" href="/static/gallerystyle.css">
|
||||
|
||||
|
||||
<link rel="icon" type="image/x-icon" href="/static/icon.jpeg">
|
||||
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||
|
||||
<script src="/static/htmx.min.js"></script>
|
||||
<script id="main_banner_script" src="/static/banner.js"></script>
|
||||
|
||||
{% block feed_links %}
|
||||
<link rel="alternate" type="application/rss+xml" title="{{og.site_name}} Global Feed" href="{{site_config.uri_prefix}}/feed">
|
||||
{% endblock %}
|
||||
|
@ -38,11 +48,9 @@
|
|||
<meta property="al:android:app_name" content="Medium" />
|
||||
{% endblock %}
|
||||
|
||||
<script type="text/javascript">
|
||||
window.dergBannerOptions = JSON.parse('{{banner|raw}}');
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<body id="main_body" hx-sync="a:replace img:drop" hx-boost="true" hx-indicator="#main_body">
|
||||
|
||||
{%if age_gate %}
|
||||
|
||||
<div id="age_gate_block">
|
||||
|
@ -59,10 +67,14 @@
|
|||
{% endif %}
|
||||
|
||||
<header id="main_header">
|
||||
<img id="main_banner_img"></img>
|
||||
<a id="main_banner_img_link" href="/gallery"> full picture</a>
|
||||
<img id="main_banner_img" hx-preserve></img>
|
||||
<a id="main_banner_img_link" href="/gallery" hx-preserve> full picture</a>
|
||||
|
||||
<script type="text/javascript">
|
||||
window.dergBannerOptions = JSON.parse('{{banner|raw}}');
|
||||
|
||||
<script src="/static/banner.js"></script>
|
||||
startBanner();
|
||||
</script>
|
||||
|
||||
<h1 id="big_title">{% block big_title %}{{og.site_name}}{%endblock%}</h1>
|
||||
{% block second_title %}{% endblock %}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue