diff --git a/site/index.html b/site/index.html index f672115..a9c1748 100644 --- a/site/index.html +++ b/site/index.html @@ -4,7 +4,7 @@ iPX - + @@ -21,7 +21,7 @@

iPX

-

It checks your feeds, downloads new episodes, and gives everyone at home a list of their own to listen from in the browser.

+

iPX checks your podcasts, downloads new episodes, and gives everyone at home their own account to listen from in the browser. It runs on your own server.

Browse the directory

@@ -62,34 +62,34 @@

An account for everyone at home

Each person has their own shows, sees what they have and have not heard, and picks up where they left off.

-
The feed list: Directory, Currently Listening and All Subscriptions, then each show with its cover and how many of its episodes are unread.
-

It does the fetching

-

Feeds are checked on a schedule and new episodes download on their own, filtered by keyword, media type or explicit content. Old files are cleared to stay within the disk space you give it, never one somebody pinned.

+

New episodes, ready to play

+

iPX checks your podcasts through the day and downloads new episodes as they come out. Skip the ones you don't want by keyword, or leave out explicit ones. Old episodes are cleared to stay within the space you give it, but never one someone has pinned.

99% Invisible's episodes in a table with each one's size and date, and the downloaded one's file beside it, ready to play, save, share or delete.
-
+

Pick up where you left off

The player keeps your place in every episode, on every device.

-
The player along the bottom of the page: the episode playing, back and forward, how far in it is, its speed and the volume.
+
The player along the bottom of the page: the episode playing, back and forward, and how far in it is.
-

DeadAir

-

Turn it on for a show and long silences shrink to a short pause, so episodes finish sooner while every voice keeps its own pace. You choose how much of a pause to leave.

+

Cut the dead air

+

Turn on DeadAir for a show and its long silences shrink to a short pause, so episodes finish sooner without anyone talking faster. You choose how long a pause to leave.

Sign in your way
-
Each person signs in with a password, or Cloudflare Access or Authentik signs them in for you. An admin adds people and decides who else is one.
+
Everyone signs in with a password, or with the single sign-on you already use, Cloudflare Access or Authentik. An admin adds people and decides who else is one.
Blogs too
-
Any RSS or Atom feed works, so the blogs you read sit beside the shows you listen to, each with its own read and unread.
+
Any RSS or Atom feed works, so the blogs you read sit beside the shows you listen to, and iPX keeps track of what you have read.

Since 2004

-

iPodderX was one of the first podcatchers, a Mac app by Ray Slakinski and August Trometer, from the year podcasts got their name. iPX is its engine rewritten in Rust for a server, with a page modelled on the original window: the feed list down the side, the episodes in a table, the player along the bottom.

+

iPodderX was one of the first podcatchers, a Mac app by Ray Slakinski and August Trometer, from the year podcasts got their name. iPX is that app rebuilt to run on your own server, with a page modelled on the original window: the feed list down the side, the episodes in a table, the player along the bottom.

diff --git a/site/shots/directory.webp b/site/shots/directory.webp index 1c92e55..d5b214f 100644 Binary files a/site/shots/directory.webp and b/site/shots/directory.webp differ diff --git a/site/shots/feeds.webp b/site/shots/feeds.webp index a3f62af..9de4faa 100644 Binary files a/site/shots/feeds.webp and b/site/shots/feeds.webp differ diff --git a/site/shots/player.webp b/site/shots/player.webp index ab38c6e..b51db01 100644 Binary files a/site/shots/player.webp and b/site/shots/player.webp differ diff --git a/site/site.css b/site/site.css index 80dc228..8010b0a 100644 --- a/site/site.css +++ b/site/site.css @@ -62,11 +62,9 @@ h1{margin:0;color:var(--navy);font-weight:900;font-size:clamp(6.5rem,24vw,15rem) h2{margin:0 0 1.5rem;color:var(--navy);font-weight:800;font-size:clamp(1.75rem,4vw,2.4rem);line-height:1.1;letter-spacing:-.02em} .does,.then{padding-block:4rem 0} -/* Each feature beside the part of the app that shows it, framed in the dial's navy at no more - than its own size; the player, a long thin bar, takes the full width under its text. */ -.feature{display:grid;grid-template-columns:minmax(0,19rem) minmax(0,1fr);gap:clamp(1.5rem,5vw,4rem);align-items:center;padding-block:2.5rem} -.feature.wide{grid-template-columns:minmax(0,1fr)} -.feature.wide .say{max-width:40rem} +/* Each feature on one row: what it does on the left, beside the part of the app that shows it, + framed in the dial's navy at no more than its own size. */ +.feature{display:grid;grid-template-columns:minmax(0,22rem) minmax(0,1fr);gap:clamp(1.5rem,5vw,4rem);align-items:center;padding-block:2.5rem} .feature h3{margin:0 0 .5rem;color:var(--navy);font-weight:750;font-size:1.35rem;line-height:1.25} .feature p{margin:0;max-width:34rem} .frame{margin:0;justify-self:start;max-width:100%;padding:clamp(.6rem,1.6vw,1.1rem);background:var(--navy);border-radius:1.1rem} @@ -101,6 +99,7 @@ footer p{margin:0} /* A wide crop at this width is too small to read: its left part, larger. */ .frame img.cut{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:0 0} .frame img.cut.player{aspect-ratio:2.4/1} + .frame img.cut.half{aspect-ratio:2.6/1} /* the directory's left column */ .also{grid-template-columns:minmax(0,1fr);gap:1.75rem} .dial{margin-inline:-1rem} .scale{border-radius:0}