diff --git a/app/Views/Components/DropdownMenu.php b/app/Views/Components/DropdownMenu.php
index f83712c217d6668593cc5f6127b748d709c4ec86..d806220ec17f8bcef29fad9f32eb9a353e692313 100644
--- a/app/Views/Components/DropdownMenu.php
+++ b/app/Views/Components/DropdownMenu.php
@@ -43,7 +43,7 @@ class DropdownMenu extends Component
return <<<HTML
<nav id="{$this->id}"
class="absolute z-50 flex flex-col py-2 text-black whitespace-no-wrap bg-white border-black rounded-lg border-3"
- aria-labelledby="{$this->labeledBy}"
+ aria-labelledby="{$this->labelledby}"
data-dropdown="menu"
data-dropdown-placement="bottom-end">{$menuItems}</nav>
HTML;
diff --git a/package-lock.json b/package-lock.json
index 31ed1783c9f5f9749d1fef93c84ff53ec76d909a..76d0a2a41d219daaeb859d0590fb37723d79d185 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,16 +10,16 @@
"license": "AGPL-3.0-or-later",
"dependencies": {
"@amcharts/amcharts4": "^4.10.22",
- "@amcharts/amcharts4-geodata": "^4.1.21",
+ "@amcharts/amcharts4-geodata": "^4.1.22",
"@codemirror/basic-setup": "^0.19.0",
"@codemirror/commands": "^0.19.5",
- "@codemirror/lang-xml": "^0.19.1",
+ "@codemirror/lang-xml": "^0.19.2",
"@codemirror/state": "^0.19.2",
- "@codemirror/view": "^0.19.7",
+ "@codemirror/view": "^0.19.8",
"@github/clipboard-copy-element": "^1.1.2",
"@github/markdown-toolbar-element": "^1.5.1",
"@github/time-elements": "^3.1.2",
- "@popperjs/core": "^2.10.1",
+ "@popperjs/core": "^2.10.2",
"@vime/core": "^5.0.33",
"choices.js": "^9.0.1",
"flatpickr": "^4.6.9",
@@ -30,19 +30,19 @@
"xml-formatter": "^2.4.1"
},
"devDependencies": {
- "@commitlint/cli": "^13.1.0",
- "@commitlint/config-conventional": "^13.1.0",
+ "@commitlint/cli": "^13.2.0",
+ "@commitlint/config-conventional": "^13.2.0",
"@semantic-release/changelog": "^6.0.0",
"@semantic-release/exec": "^6.0.1",
"@semantic-release/git": "^10.0.0",
"@semantic-release/gitlab": "^7.0.3",
- "@tailwindcss/forms": "^0.3.3",
+ "@tailwindcss/forms": "^0.3.4",
"@tailwindcss/line-clamp": "^0.2.1",
"@tailwindcss/typography": "^0.4.1",
"@types/leaflet": "^1.7.5",
"@types/marked": "^3.0.1",
- "@typescript-eslint/eslint-plugin": "^4.31.2",
- "@typescript-eslint/parser": "^4.31.2",
+ "@typescript-eslint/eslint-plugin": "^4.32.0",
+ "@typescript-eslint/parser": "^4.32.0",
"cross-env": "^7.0.3",
"cssnano": "^5.0.8",
"cz-conventional-changelog": "^3.3.0",
@@ -54,17 +54,17 @@
"lint-staged": "^11.1.2",
"postcss-import": "^14.0.2",
"postcss-preset-env": "^6.7.0",
- "postcss-reporter": "^7.0.2",
+ "postcss-reporter": "^7.0.3",
"prettier": "2.4.1",
"prettier-plugin-organize-imports": "^2.3.4",
"semantic-release": "^18.0.0",
"stylelint": "^13.13.1",
"stylelint-config-standard": "^22.0.0",
- "svgo": "^2.6.1",
- "tailwindcss": "^2.2.15",
+ "svgo": "^2.7.0",
+ "tailwindcss": "^2.2.16",
"tailwindcss-scroll-snap": "^1.1.0",
"typescript": "^4.4.3",
- "vite": "^2.5.10"
+ "vite": "^2.6.1"
}
},
"node_modules/@amcharts/amcharts4": {
@@ -5947,6 +5947,20 @@
"resolved": "https://registry.npmjs.org/fscreen/-/fscreen-1.2.0.tgz",
"integrity": "sha512-hlq4+BU0hlPmwsFjwGGzZ+OZ9N/wq9Ljg/sq3pX+2CD7hrJsX9tJgWWK/wiNTFM212CLHWhicOoqwXyZGGetJg=="
},
+ "node_modules/fsevents": {
+ "version": "2.3.2",
+ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
+ "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+ "dev": true,
+ "hasInstallScript": true,
+ "optional": true,
+ "os": [
+ "darwin"
+ ],
+ "engines": {
+ "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+ }
+ },
"node_modules/function-bind": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
@@ -8191,6 +8205,12 @@
"integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s=",
"dev": true
},
+ "node_modules/nanocolors": {
+ "version": "0.2.12",
+ "resolved": "https://registry.npmjs.org/nanocolors/-/nanocolors-0.2.12.tgz",
+ "integrity": "sha512-SFNdALvzW+rVlzqexid6epYdt8H9Zol7xDoQarioEFcFN0JHo4CYNztAxmtfgGTVRCmFlEOqqhBpoFGKqSAMug==",
+ "dev": true
+ },
"node_modules/nanoid": {
"version": "3.1.30",
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.30.tgz",
@@ -21907,6 +21927,13 @@
"resolved": "https://registry.npmjs.org/fscreen/-/fscreen-1.2.0.tgz",
"integrity": "sha512-hlq4+BU0hlPmwsFjwGGzZ+OZ9N/wq9Ljg/sq3pX+2CD7hrJsX9tJgWWK/wiNTFM212CLHWhicOoqwXyZGGetJg=="
},
+ "fsevents": {
+ "version": "2.3.2",
+ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
+ "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+ "dev": true,
+ "optional": true
+ },
"function-bind": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
@@ -23619,6 +23646,12 @@
"integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s=",
"dev": true
},
+ "nanocolors": {
+ "version": "0.2.12",
+ "resolved": "https://registry.npmjs.org/nanocolors/-/nanocolors-0.2.12.tgz",
+ "integrity": "sha512-SFNdALvzW+rVlzqexid6epYdt8H9Zol7xDoQarioEFcFN0JHo4CYNztAxmtfgGTVRCmFlEOqqhBpoFGKqSAMug==",
+ "dev": true
+ },
"nanoid": {
"version": "3.1.30",
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.30.tgz",
diff --git a/package.json b/package.json
index 43be660e51572f7c39b067f0547a7bf51ad82c32..e9ba0a513a0c57fbf0746d6add3776a76f4d7053 100644
--- a/package.json
+++ b/package.json
@@ -27,17 +27,17 @@
"prepare": "is-ci || husky install"
},
"dependencies": {
- "@amcharts/amcharts4-geodata": "^4.1.21",
+ "@amcharts/amcharts4-geodata": "^4.1.22",
"@amcharts/amcharts4": "^4.10.22",
"@codemirror/basic-setup": "^0.19.0",
"@codemirror/commands": "^0.19.5",
- "@codemirror/lang-xml": "^0.19.1",
+ "@codemirror/lang-xml": "^0.19.2",
"@codemirror/state": "^0.19.2",
- "@codemirror/view": "^0.19.7",
+ "@codemirror/view": "^0.19.8",
"@github/clipboard-copy-element": "^1.1.2",
"@github/markdown-toolbar-element": "^1.5.1",
"@github/time-elements": "^3.1.2",
- "@popperjs/core": "^2.10.1",
+ "@popperjs/core": "^2.10.2",
"@vime/core": "^5.0.33",
"choices.js": "^9.0.1",
"flatpickr": "^4.6.9",
@@ -48,19 +48,19 @@
"xml-formatter": "^2.4.1"
},
"devDependencies": {
- "@commitlint/cli": "^13.1.0",
- "@commitlint/config-conventional": "^13.1.0",
+ "@commitlint/cli": "^13.2.0",
+ "@commitlint/config-conventional": "^13.2.0",
"@semantic-release/changelog": "^6.0.0",
"@semantic-release/exec": "^6.0.1",
"@semantic-release/git": "^10.0.0",
"@semantic-release/gitlab": "^7.0.3",
- "@tailwindcss/forms": "^0.3.3",
+ "@tailwindcss/forms": "^0.3.4",
"@tailwindcss/line-clamp": "^0.2.1",
"@tailwindcss/typography": "^0.4.1",
"@types/leaflet": "^1.7.5",
"@types/marked": "^3.0.1",
- "@typescript-eslint/eslint-plugin": "^4.31.2",
- "@typescript-eslint/parser": "^4.31.2",
+ "@typescript-eslint/eslint-plugin": "^4.32.0",
+ "@typescript-eslint/parser": "^4.32.0",
"cross-env": "^7.0.3",
"cssnano": "^5.0.8",
"cz-conventional-changelog": "^3.3.0",
@@ -72,17 +72,17 @@
"lint-staged": "^11.1.2",
"postcss-import": "^14.0.2",
"postcss-preset-env": "^6.7.0",
- "postcss-reporter": "^7.0.2",
+ "postcss-reporter": "^7.0.3",
"prettier-plugin-organize-imports": "^2.3.4",
"prettier": "2.4.1",
"semantic-release": "^18.0.0",
"stylelint-config-standard": "^22.0.0",
"stylelint": "^13.13.1",
- "svgo": "^2.6.1",
+ "svgo": "^2.7.0",
"tailwindcss-scroll-snap": "^1.1.0",
- "tailwindcss": "^2.2.15",
+ "tailwindcss": "^2.2.16",
"typescript": "^4.4.3",
- "vite": "^2.5.10"
+ "vite": "^2.6.1"
},
"lint-staged": {
"*.{js,ts,css,md,json}": "prettier --write",
diff --git a/themes/cp_admin/_layout.php b/themes/cp_admin/_layout.php
index f6b47bd4242d331c654f9b498542cba5a45265a8..5269b9e9c067143a6442b0dd8fab91736184767f 100644
--- a/themes/cp_admin/_layout.php
+++ b/themes/cp_admin/_layout.php
@@ -41,7 +41,7 @@
data-dropdown-target="my-account-dropdown-menu"
aria-haspopup="true"
aria-expanded="false"><?= icon('account-circle', 'text-2xl opacity-60 mr-2') . user()->username . icon('caret-down', 'ml-auto text-2xl') ?></button>
- <DropdownMenu id="my-account-dropdown-menu" labeledBy="my-account-dropdown" items="<?= esc(json_encode([
+ <DropdownMenu id="my-account-dropdown-menu" labelledby="my-account-dropdown" items="<?= esc(json_encode([
[
'type' => 'link',
'title' => lang('AdminNavigation.account.my-account'),
diff --git a/themes/cp_admin/episode/list.php b/themes/cp_admin/episode/list.php
index 42577e05e4990498ff1bf3e7ea1c54278a593496..5a0a0ee8df57fdbcc1c8f9ea01517fbfd8c91a5e 100644
--- a/themes/cp_admin/episode/list.php
+++ b/themes/cp_admin/episode/list.php
@@ -77,7 +77,7 @@
return '<button id="more-dropdown-' . $episode->id . '" type="button" class="inline-flex items-center p-1 outline-none focus:ring" data-dropdown="button" data-dropdown-target="more-dropdown-' . $episode->id . '-menu" aria-haspopup="true" aria-expanded="false">' .
icon('more') .
'</button>' .
- '<DropdownMenu id="more-dropdown-' . $episode->id . '-menu" labeledBy="more-dropdown-' . $episode->id . '" items="' . esc(json_encode([
+ '<DropdownMenu id="more-dropdown-' . $episode->id . '-menu" labelledby="more-dropdown-' . $episode->id . '" items="' . esc(json_encode([
[
'type' => 'link',
'title' => lang('Episode.edit'),
diff --git a/themes/cp_admin/podcast/latest_episodes.php b/themes/cp_admin/podcast/latest_episodes.php
index 2d795036e80f9e7c9a0c434634d3e0c87dae59dd..cf5a6f3c4709f62668abe5cd8700fed6585f58f4 100644
--- a/themes/cp_admin/podcast/latest_episodes.php
+++ b/themes/cp_admin/podcast/latest_episodes.php
@@ -52,7 +52,7 @@
aria-haspopup="true"
aria-expanded="false"
><?= icon('more') ?></button>
- <DropdownMenu id="more-dropdown-<?= $episode->id ?>-menu" labeledBy="more-dropdown-<?= $episode->id ?>" items="<?= esc(json_encode([
+ <DropdownMenu id="more-dropdown-<?= $episode->id ?>-menu" labelledby="more-dropdown-<?= $episode->id ?>" items="<?= esc(json_encode([
[
'type' => 'link',
'title' => lang('Episode.edit'),
diff --git a/themes/cp_admin/podcast/list.php b/themes/cp_admin/podcast/list.php
index 4d1738e6379656b89c16f27eb55c726203f12ce2..41091a803bff8868eb1c5386b78bf5f1c3f67592 100644
--- a/themes/cp_admin/podcast/list.php
+++ b/themes/cp_admin/podcast/list.php
@@ -19,32 +19,45 @@
<div class="grid gap-4 grid-cols-podcasts">
<?php if ($podcasts !== null): ?>
<?php foreach ($podcasts as $podcast): ?>
- <article class="h-full overflow-hidden bg-white border-2 border-pine-100 rounded-xl">
- <img
- alt="<?= $podcast->title ?>"
- src="<?= $podcast->image
- ->medium_url ?>" class="object-cover w-full h-48" />
- <a href="<?= route_to(
- 'podcast-view',
- $podcast->id,
- ) ?>" class="flex flex-col p-2 hover:underline">
- <h2 class="font-semibold truncate"><?= $podcast->title ?></h2>
- <p class="text-gray-600">@<?= $podcast->handle ?></p>
- </a>
- <footer class="flex items-center justify-end p-2">
- <a class="inline-flex p-2 mr-2 text-blue-700 bg-blue-100 rounded-full shadow-xs hover:bg-blue-200" href="<?= route_to(
- 'podcast-edit',
- $podcast->id,
- ) ?>" data-toggle="tooltip" data-placement="bottom" title="<?= lang(
- 'Podcast.edit',
- ) ?>"><?= icon('edit') ?></a>
- <a class="inline-flex p-2 text-gray-700 bg-gray-100 rounded-full shadow-xs hover:bg-gray-200" href="<?= route_to(
- 'podcast-view',
- $podcast->id,
- ) ?>" data-toggle="tooltip" data-placement="bottom" title="<?= lang(
- 'Podcast.view',
- ) ?>"><?= icon('eye') ?></a>
- </footer>
+ <article class="relative h-full overflow-hidden transition bg-white shadow border-3 border-pine-100 rounded-xl group hover:shadow-xl">
+ <div class="w-full h-full overflow-hidden">
+ <img
+ alt="<?= $podcast->title ?>"
+ src="<?= $podcast->image->medium_url ?>" class="object-cover w-full h-full transition duration-200 ease-in-out transform group-hover:scale-105" />
+ </div>
+ <a href="<?= route_to(
+ 'podcast-view',
+ $podcast->id,
+) ?>" class="absolute bottom-0 left-0 flex flex-col justify-end w-full h-full text-white" style="
+ background-image: linear-gradient(180deg,
+ hsla(0, 0%, 35.29%, 0) 0%,hsla(0, 0%, 34.53%, 0.034375) 16.36%,
+ hsla(0, 0%, 32.42%, 0.125) 33.34%,
+ hsla(0, 0%, 29.18%, 0.253125) 50.1%,
+ hsla(0, 0%, 24.96%, 0.4) 65.75%,
+ hsla(0, 0%, 19.85%, 0.546875) 79.43%,
+ hsla(0, 0%, 13.95%, 0.675) 90.28%,
+ hsla(0, 0%, 7.32%, 0.765625) 97.43%,
+ hsla(0, 0%, 0%, 0.8) 100%
+ );
+ ">
+ <div class="px-4 pb-4 transition duration-75 ease-out translate-y-6 group-hover:translate-y-0">
+ <h2 class="font-bold leading-none truncate font-display"><?= $podcast->title ?></h2>
+ <p class="text-sm transition duration-150 opacity-0 group-hover:opacity-75">@<?= $podcast->handle ?></p>
+ </div>
+ </a>
+ <button class="absolute top-0 right-0 p-2 mt-2 mr-2 text-white transition -translate-y-12 rounded-full opacity-0 group-hover:translate-y-0 bg-black/25 group-hover:opacity-100" id="more-dropdown-<?= $podcast->id ?>" data-dropdown="button" data-dropdown-target="more-dropdown-<?= $podcast->id ?>-menu" aria-haspopup="true" aria-expanded="false" title="<?= lang('Common.more') ?>"><?= icon('more') ?></button>
+ <DropdownMenu id="more-dropdown-<?= $podcast->id ?>-menu" labelledby="more-dropdown-<?= $podcast->id ?>" items="<?= esc(json_encode([
+ [
+ 'type' => 'link',
+ 'title' => lang('Podcast.view'),
+ 'uri' => route_to('podcast-view', $podcast->id),
+ ],
+ [
+ 'type' => 'link',
+ 'title' => lang('Podcast.edit'),
+ 'uri' => route_to('podcast-edit', $podcast->id),
+ ],
+ ])) ?>" />
</article>
<?php endforeach; ?>
<?php else: ?>
diff --git a/themes/cp_admin/podcast/persons.php b/themes/cp_admin/podcast/persons.php
index f5e2e58a4ec96fe95436614ad6780582ec741d9b..d388568e1a6c04e3d8ab2c2070f371aab8b674e1 100644
--- a/themes/cp_admin/podcast/persons.php
+++ b/themes/cp_admin/podcast/persons.php
@@ -66,11 +66,25 @@
subtitle="<?= lang('Person.podcast_form.add_section_subtitle') ?>"
>
- <Forms.Label for="persons" hint="<?= lang('Person.podcast_form.persons_hint') ?>"><?= lang('Person.podcast_form.persons') ?></Forms.Label>
- <Forms.MultiSelect id="persons" name="persons[]" class="mb-4" required="required" options="<?= esc(json_encode($personOptions)) ?>" selected="<?= esc(json_encode(old('persons', []))) ?>"/>
-
- <Forms.Label for="roles" hint="<?= lang('Person.podcast_form.roles_hint') ?>" isOptional="true"><?= lang('Person.podcast_form.roles') ?></Forms.Label>
- <Forms.MultiSelect id="roles" name="roles[]" class="mb-4" options="<?= esc(json_encode($taxonomyOptions)) ?>" selected="<?= esc(json_encode(old('roles', []))) ?>"/>
+ <Forms.Field
+ as="MultiSelect"
+ id="persons"
+ name="persons[]"
+ label="<?= lang('Person.podcast_form.persons') ?>"
+ hint="<?= lang('Person.podcast_form.persons_hint') ?>"
+ options="<?= esc(json_encode($personOptions)) ?>"
+ selected="<?= esc(json_encode(old('persons', []))) ?>"
+ required="true" />
+
+ <Forms.Field
+ as="MultiSelect"
+ id="roles"
+ name="roles[]"
+ label="<?= lang('Person.podcast_form.roles') ?>"
+ hint="<?= lang('Person.podcast_form.roles_hint') ?>"
+ options="<?= esc(json_encode($taxonomyOptions)) ?>"
+ selected="<?= esc(json_encode(old('roles', []))) ?>"
+ required="true" />
<Button variant="primary" class="self-end" type="submit"><?= lang('Person.podcast_form.submit_add') ?></Button>
diff --git a/themes/cp_app/podcast/_layout.php b/themes/cp_app/podcast/_layout.php
index be66043a9e9cc4752df848c7f03a5310991b841e..7a632a054d6ae90b35c19709a0142cc62e220227 100644
--- a/themes/cp_app/podcast/_layout.php
+++ b/themes/cp_app/podcast/_layout.php
@@ -55,11 +55,7 @@
) ?>
</div>
</div>
- <nav class="flex gap-4 px-8">
- <a href="<?= route_to('podcast-activity', $podcast->handle) ?>" class="px-4 py-1 font-semibold uppercase border-b-4 text-pine-500 border-pine-500"><?= lang('Podcast.activity') ?></a>
- <a href="<?= route_to('podcast-episodes', $podcast->handle) ?>" class="px-4 py-1 font-semibold text-gray-500 uppercase hover:text-black"><?= lang('Podcast.episodes') ?></a>
- <a href="<?= route_to('podcast-about', $podcast->handle) ?>" class="px-4 py-1 font-semibold text-gray-500 uppercase hover:text-black"><?= lang('Podcast.about') ?></a>
- </nav>
+ <?= $this->include('podcast/_navigation') ?>
</header>
<main class="col-span-6">
diff --git a/themes/cp_app/podcast/_navigation.php b/themes/cp_app/podcast/_navigation.php
new file mode 100644
index 0000000000000000000000000000000000000000..66ce97f9688d0f592beb610bf8df6d97cba03556
--- /dev/null
+++ b/themes/cp_app/podcast/_navigation.php
@@ -0,0 +1,23 @@
+<?php declare(strict_types=1);
+
+$navigationItems = [
+ [
+ 'uri' => route_to('podcast-activity', $podcast->handle),
+ 'label' => lang('Podcast.activity'),
+ ],
+ [
+ 'uri' => route_to('podcast-episodes', $podcast->handle),
+ 'label' => lang('Podcast.episodes'),
+ ],
+ [
+ 'uri' => route_to('podcast-about', $podcast->handle),
+ 'label' => lang('Podcast.about'),
+ ],
+]
+?>
+<nav class="flex gap-4 px-8">
+ <?php foreach ($navigationItems as $item): ?>
+ <?php $isActive = url_is($item['uri']); ?>
+ <a href="<?= $item['uri'] ?>" class="px-4 py-1 font-semibold uppercase border-b-4<?= $isActive ? ' border-b-4 text-pine-500 border-pine-500' : ' text-gray-500 hover:text-gray-900 hover:border-gray-200 border-transparent' ?>"><?= $item['label'] ?></a>
+ <?php endforeach; ?>
+</nav>
\ No newline at end of file
diff --git a/themes/cp_app/podcast/activity.php b/themes/cp_app/podcast/activity.php
index 1be8aa5abc20bbb45a3e47c1dc99e12c7ea66385..1a1b5176fad0b225135447f9f04e076db071e300 100644
--- a/themes/cp_app/podcast/activity.php
+++ b/themes/cp_app/podcast/activity.php
@@ -28,6 +28,7 @@
<?= $this->section('content') ?>
<section class="max-w-2xl mx-auto space-y-8">
+
<?php foreach ($posts as $post): ?>
<?php if ($post->reblog_of_id !== null): ?>
<?= view('podcast/_partials/reblog', [
diff --git a/themes/cp_app/podcast/activity_authenticated.php b/themes/cp_app/podcast/activity_authenticated.php
index 0f7366059dcee1e659c315e6adf34aa6d405b3ce..8e582c7020d4462f68fc9cbe0fd1a9b0a5853d0c 100644
--- a/themes/cp_app/podcast/activity_authenticated.php
+++ b/themes/cp_app/podcast/activity_authenticated.php
@@ -27,20 +27,7 @@
<?= $this->section('content') ?>
-<nav class="sticky z-20 flex justify-center pt-2 text-lg top-12 sm:top-0 bg-pine-50">
-<a href="<?= route_to(
- 'podcast-activity',
- $podcast->handle,
- ) ?>" class="px-4 py-1 mr-8 font-semibold border-b-4 text-pine-800 border-pine-500"><?= lang(
- 'Podcast.activity',
- ) ?></a>
- <a href="<?= route_to(
- 'podcast-episodes',
- $podcast->handle,
- ) ?>" class="px-4 py-1 rounded-full hover:bg-pine-100"><?= lang(
- 'Podcast.episodes',
- ) ?></a>
-</nav>
+<?= $this->include('podcast/_navigation') ?>
<section class="max-w-2xl px-6 py-8 mx-auto">
<form action="<?= route_to('post-attempt-create', interact_as_actor()->username) ?>" method="POST" class="flex p-4 bg-white shadow rounded-xl">
@@ -51,7 +38,7 @@
<img src="<?= interact_as_actor()
->avatar_image_url ?>" alt="<?= interact_as_actor()
->display_name ?>" class="w-12 h-12 mr-4 rounded-full" />
- <div class="flex flex-col flex-1 min-w-0">
+ <div class="flex flex-col flex-1 min-w-0 gap-y-2">
<Forms.Textarea
name="message"
required="true"
@@ -61,7 +48,7 @@
name="episode_url"
type="url"
placeholder="<?= lang('Post.form.episode_url_placeholder') . ' (' . lang('Common.optional') . ')' ?>" />
- <Button variant="primary" size="small" type="submit" class="self-end mt-2"><?= lang('Post.form.submit') ?></Button>
+ <Button variant="primary" size="small" type="submit" class="self-end"><?= lang('Post.form.submit') ?></Button>
</div>
</form>
<hr class="my-4 border-2 border-pine-100">
diff --git a/themes/cp_app/podcast/episode_authenticated.php b/themes/cp_app/podcast/episode_authenticated.php
index b84788284cc32af916c4465e7fe1d6477a1c5fd0..0ffc7ed58dba18c0edaa27d11953c6f92d3a1451 100644
--- a/themes/cp_app/podcast/episode_authenticated.php
+++ b/themes/cp_app/podcast/episode_authenticated.php
@@ -96,7 +96,7 @@
<img src="<?= interact_as_actor()
->avatar_image_url ?>" alt="<?= interact_as_actor()
->display_name ?>" class="w-12 h-12 mr-4 rounded-full" />
- <div class="flex flex-col flex-1 min-w-0">
+ <div class="flex flex-col flex-1 min-w-0 gap-y-2">
<Forms.Textarea
name="message"
required="true"
@@ -121,7 +121,7 @@
<img src="<?= interact_as_actor()
->avatar_image_url ?>" alt="<?= interact_as_actor()
->display_name ?>" class="w-12 h-12 mr-4 rounded-full" />
- <div class="flex flex-col flex-1 min-w-0">
+ <div class="flex flex-col flex-1 min-w-0 gap-y-2">
<input name="episode_url" value="<?= $episode->link ?>" type="hidden" />
<Forms.Textarea
name="message"
diff --git a/themes/cp_app/podcast/episodes_authenticated.php b/themes/cp_app/podcast/episodes_authenticated.php
index c145701f36c5c7e81f0150f16f44eab4e4a349b2..0986f2eb0d372df29fe47e4d776d1a679361fc91 100644
--- a/themes/cp_app/podcast/episodes_authenticated.php
+++ b/themes/cp_app/podcast/episodes_authenticated.php
@@ -26,46 +26,8 @@
<?= $this->endSection() ?>
<?= $this->section('content') ?>
-<nav class="sticky z-20 flex items-center justify-center pt-2 text-lg top-12 sm:top-0 bg-pine-50">
- <a href="<?= route_to(
- 'podcast-activity',
- $podcast->handle,
- ) ?>" class="px-4 py-1 mr-8 rounded-full hover:bg-pine-100"><?= lang(
- 'Podcast.activity',
- ) ?></a>
- <a href="<?= route_to(
- 'podcast-episodes',
- $podcast->handle,
- ) ?>" class="px-4 py-1 font-semibold border-b-4 text-pine-800 border-pine-500"><?= lang(
- 'Podcast.episodes',
- ) ?></a>
- <?php if ($activeQuery) : ?>
- <button id="episode-lists-dropdown" type="button" class="inline-flex items-center px-2 py-1 text-sm font-semibold outline-none focus:ring" data-dropdown="button" data-dropdown-target="episode-lists-dropdown-menu" aria-label="<?= lang(
- 'Common.more',
- ) ?>" aria-haspopup="true" aria-expanded="false">
- <?= $activeQuery['label'] .
- ' (' .
- $activeQuery['number_of_episodes'] .
- ')' .
- icon('caret-down', 'ml-2 text-xl') ?>
- </button>
- <nav id="episode-lists-dropdown-menu" class="flex flex-col py-2 text-black bg-white border rounded shadow" aria-labelledby="episode-lists-dropdown" data-dropdown="menu" data-dropdown-placement="bottom-end">
- <?php foreach ($episodesNav as $link) : ?>
- <?= anchor(
- $link['route'],
- $link['label'] . ' (' . $link['number_of_episodes'] . ')',
- [
- 'class' =>
- 'px-2 py-1 whitespace-nowrap ' .
- ($link['is_active']
- ? 'font-semibold'
- : 'text-gray-600 hover:text-gray-900'),
- ],
- ) ?>
- <?php endforeach; ?>
- </nav>
- <?php endif; ?>
-</nav>
+
+<?= $this->include('podcast/_navigation') ?>
<section class="flex flex-col max-w-2xl px-6 py-8 mx-auto">
@@ -73,26 +35,26 @@
<h1 class="mb-4 text-xl font-semibold">
<?php if ($activeQuery['type'] === 'year') : ?>
<?= lang('Podcast.list_of_episodes_year', [
- 'year' => $activeQuery['value'],
+ 'year' => $activeQuery['value'],
'episodeCount' => count($episodes),
- ]) ?>
+]) ?>
<?php elseif ($activeQuery['type'] === 'season') : ?>
<?= lang('Podcast.list_of_episodes_season', [
- 'seasonNumber' => $activeQuery['value'],
+ 'seasonNumber' => $activeQuery['value'],
'episodeCount' => count($episodes),
- ]) ?>
+]) ?>
<?php endif; ?>
</h1>
<?php foreach ($episodes as $episode) : ?>
<?= view('podcast/_partials/episode_card', [
- 'episode' => $episode,
+ 'episode' => $episode,
'podcast' => $podcast,
- ]) ?>
+]) ?>
<?php endforeach; ?>
<?php else : ?>
<h1 class="px-4 mb-2 text-xl text-center"><?= lang(
- 'Podcast.no_episode',
- ) ?></h1>
+ 'Podcast.no_episode',
+) ?></h1>
<p class="italic text-center"><?= lang('Podcast.no_episode_hint') ?></p>
<?php endif; ?>
</section>