root
4101d98a41
Design system overhaul using DaisyUI v5 on Tailwind CSS v4: - Custom 'ohmstream' dark theme with orange primary (#FF9F1C), magenta secondary, gold accent matching existing palette - Tailwind CSS-first config (input.css source, style.css built output) - DaisyUI components: navbar, drawer, cards, badges, alerts, tables, progress bars, tabs, toggles, stats, form controls, tooltips - Mobile-first responsive layout with drawer navigation - Eliminated ~500+ lines of embedded CSS across 15+ template files - Removed all inline style spam from admin_panel and settings_section - Preserved all HTMX triggers, Alpine.js state, and Jinja2 logic - Updated auth-ui.js for DaisyUI tab-active class compatibility Build: npm run build:css (minified) / npm run watch:css (dev)
39 lines
1.6 KiB
HTML
39 lines
1.6 KiB
HTML
<div class="bg-black rounded-lg border border-base-300 overflow-hidden my-5 p-4"
|
|
x-data="{
|
|
initPlayer() {
|
|
if (!this.$refs.player) return;
|
|
const player = new Plyr(this.$refs.player, {
|
|
captions: { active: true, update: true, language: 'auto' },
|
|
speed: { selected: 1, options: [0.5, 0.75, 1, 1.25, 1.5, 2] }
|
|
});
|
|
console.log('Plyr initialized');
|
|
}
|
|
}"
|
|
x-init="initPlayer()">
|
|
|
|
{% if is_iframe %}
|
|
<div class="relative w-full" style="padding-bottom: 56.25%; height: 0; overflow: hidden;">
|
|
<iframe src="{{ video_url }}"
|
|
allowfullscreen
|
|
webkitallowfullscreen
|
|
mozallowfullscreen
|
|
class="absolute top-0 left-0 w-full h-full border-0 rounded-t-lg"></iframe>
|
|
</div>
|
|
<div class="text-xs text-base-content/40 mt-3 text-center">
|
|
<i class="fa-solid fa-lightbulb"></i> Lecteur externe utilisé. Les contrôles dépendent de l'hébergeur.
|
|
</div>
|
|
{% else %}
|
|
<div class="w-full rounded-lg overflow-hidden">
|
|
<video x-ref="player" playsinline controls preload="metadata" class="w-full rounded-lg">
|
|
<source src="{{ video_url }}" type="video/mp4">
|
|
</video>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="flex justify-center mt-4">
|
|
<a href="{{ video_url }}" class="btn btn-sm btn-ghost" target="_blank">
|
|
<i class="fas fa-external-link-alt"></i> Ouvrir sur l'hébergeur
|
|
</a>
|
|
</div>
|
|
</div>
|