Revisit and activate the playlist context interface widget

This commit is contained in:
Simon Repp
2025-07-18 11:02:14 +02:00
parent 5fefc6e8c5
commit 7ae0853768
6 changed files with 62 additions and 40 deletions
-4
View File
@@ -199,10 +199,6 @@ img {
.reading_width { max-width: 32rem; }
.right_playback_controls { position: relative; }
#speed .x { font-size: .8em; }
.split {
display: flex;
row-gap: 1rem;
}
.selector_control {
align-items: center;
display: flex;
+14 -14
View File
@@ -45,7 +45,6 @@ button {
}
.center {
margin: 0 auto;
max-width: 64rem;
padding: 0 1rem 4rem;
}
.center .banner {
@@ -138,6 +137,11 @@ img {
height: 100dvh;
}
.layout .growing { flex-grow: 1; }
.layout_split {
display: flex;
flex-direction: column;
gap: 1rem;
}
.links {
margin-bottom: 1rem;
margin-top: 1rem;
@@ -288,7 +292,6 @@ img {
}
.player_wrapper {
color: var(--l-2);
margin-top: 4rem;
position: relative;
}
.player_wrapper a,
@@ -436,10 +439,6 @@ img {
font-size: 1.17rem;
}
#speed .x { font-size: .8em; }
.split {
display: flex;
row-gap: 1rem;
}
.selector_control {
align-items: center;
display: flex;
@@ -614,6 +613,10 @@ video {
@media (min-width: 53rem) {
.feed_grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 55rem) {
.layout_split { flex-direction: row; }
.layout_split > :nth-child(1) { flex-grow: 1; }
}
@media (min-width: 58rem) {
.videos_grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@@ -621,22 +624,19 @@ video {
.feed_grid { gap: 2rem; }
}
@media (min-width: 80rem) {
/* .layout.with_sidebar { width: calc(100vw - 28rem); } width + padding of .outline */
/* .outline {
.outline {
max-height: calc(100dvh - 4rem);
overflow-y: auto;
position: absolute;
right: 2rem;
top: 2rem;
width: 24rem;
}*/
}
}
@media (max-width: 66rem) {
footer { width: calc(100% - 2rem); }
}
@media (min-width: 100rem) {
.center { max-width: 64vw; }
footer { width: 64vw; }
.center { max-width: 80vw; }
footer { width: 80vw; }
.layout_split { gap: 2rem; }
}
@media (min-width: 110rem) {
.videos_grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
+1 -3
View File
@@ -137,8 +137,6 @@ impl Layout {
let version_display = env!("HYPER8_VERSION_DISPLAY");
let with_sidebar = if traversal.steps.len() > 1 { "with_sidebar" } else { "" };
let e_site_title = html_escape_outside_attribute(site.title());
let mut templates = String::new();
@@ -153,7 +151,7 @@ impl Layout {
let body = formatdoc!(r##"
<body>
<div class="layout {with_sidebar}">
<div class="layout">
<header>
<div class="breadcrumbs">
{breadcrumbs}
+1 -1
View File
@@ -638,7 +638,7 @@ impl TraversalStep<'_> {
"#)
}
fn crumb_playlist(
pub fn crumb_playlist(
playlist: &Playlist,
prefix: &str,
site: &Site,
+42 -15
View File
@@ -15,7 +15,7 @@ use crate::{
Video
};
use crate::build::{AssetHashes, Layout};
use crate::build::outline::Traversal;
use crate::build::outline::{Traversal, TraversalStep};
use crate::build::widgets::{copy_button, links, player, unlisted_badge};
use crate::icons;
use crate::util::{
@@ -23,6 +23,9 @@ use crate::util::{
localized_date_d_mmmm_yyyy
};
/// Renders a video page. If the video is part of a playlist, the layout is
/// split in two columns (respectively rows, on mobile), to additionally
/// display the playlist sidebar.
pub fn video_html(
asset_hashes: &AssetHashes,
context: &Context,
@@ -147,25 +150,49 @@ pub fn video_html(
let links_rendered = links(&site.language, &video.links);
let body = formatdoc!(r#"
{player_rendered}
<div class="video_info">
<div class="align apart flex" style="margin-top: 2rem;">
<div>
<h1 class="video_title">{e_title} {r_unlisted_badge}</h1>
{release_date}
</div>
<div class="actions align flex space">
{copy_link_button}
{r_embed}
{r_downloads}
let video_content = formatdoc!(r#"
<div>
{player_rendered}
<div class="video_info">
<div class="align apart flex" style="margin-top: 2rem;">
<div>
<h1 class="video_title">{e_title} {r_unlisted_badge}</h1>
{release_date}
</div>
<div class="actions align flex space">
{copy_link_button}
{r_embed}
{r_downloads}
</div>
</div>
{description}
{links_rendered}
</div>
{description}
{links_rendered}
</div>
"#);
let body = match playlist {
Some(playlist) => {
let prefix = "../";
let playlist_context = TraversalStep::crumb_playlist(
playlist,
&prefix,
site,
Some(video)
);
formatdoc!(r#"
<div class="layout_split">
{video_content}
<div class="outline">
{playlist_context}
</div>
</div>
"#)
}
None => video_content
};
let platform_integration = video.platform_integration();
if platform_integration.enabled() {
if let Some(video_url) = site.absolute_url_index(&video.site_path) {
+4 -3
View File
@@ -948,6 +948,7 @@ fn order_sync_actions_quality_approach(actions: &mut Vec<SyncAction>) {
})
}
// TODO: Implement
// Tight storage quota strategy (prioritize keeping used storage as low as possible at every point of the deployment)
// "Prioritize avoidance of storage quota overflows during deployment"
//
@@ -956,9 +957,9 @@ fn order_sync_actions_quality_approach(actions: &mut Vec<SyncAction>) {
// 3. Delete all directories (recursively - going from deepest to shallowest path)
// 4. Replace updated files, going from biggest to smallest
// 5. Upload all completely NEW files, going from biggest to smallest
fn order_sync_actions_survival_approach(actions: &mut Vec<SyncAction>) {
unimplemented!()
}
// fn order_sync_actions_survival_approach(actions: &mut Vec<SyncAction>) {
// unimplemented!()
// }
pub fn perform_deploy(
context_ref: &Arc<Context>,