feat(video): add video format family, resolution control, and marquee pair

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

frontend/src/components/FileConfigCard.jsx

@@ -9,6 +9,8 @@ const DEFAULT_ICON_SIZE = 256;
 const ARCHIVE_COMPRESSION_FORMATS = ['zip', 'tar.gz', 'tar.bz2', '7z', 'tar.7z'];
 const AUDIO_BITRATE_FORMATS = ['mp3', 'ogg', 'aac', 'm4a'];
 const AUDIO_BITRATES = [128, 192, 256, 320];
+const VIDEO_RESOLUTION_FORMATS = ['mp4', 'webm', 'mov', 'avi', 'mkv'];
+const VIDEO_RESOLUTIONS = [480, 720, 1080];
 
 function rangeProgress(value, min, max) {
   return `${((value - min) / (max - min)) * 100}%`;
@@ -122,6 +124,33 @@ export function FileConfigCard({ item, index, t, onTargetFormatChange, onQuality
             </div>
           )}
 
+          {VIDEO_RESOLUTION_FORMATS.includes(item.targetFormat) && (
+            <div className="chip-field">
+              <span>{t('quality.resolution')}</span>
+              <div className="chip-group" role="group" aria-label={t('quality.resolution')}>
+                <button
+                  type="button"
+                  className={`chip${item.quality === null ? ' chip-active' : ''}`}
+                  aria-pressed={item.quality === null}
+                  onClick={() => onQualityChange(index, null)}
+                >
+                  {t('quality.original')}
+                </button>
+                {VIDEO_RESOLUTIONS.map((resolution) => (
+                  <button
+                    key={resolution}
+                    type="button"
+                    className={`chip${item.quality === resolution ? ' chip-active' : ''}`}
+                    aria-pressed={item.quality === resolution}
+                    onClick={() => onQualityChange(index, resolution)}
+                  >
+                    {resolution}p
+                  </button>
+                ))}
+              </div>
+            </div>
+          )}
+
           {item.targetFormat === 'ico' && (
             <div className="chip-field">
               <span>{t('quality.iconSize')}</span>

frontend/src/components/FormatMarquee.jsx

@@ -8,6 +8,7 @@ const PAIRS = [
   ['epub', 'mobi'],
   ['rar', 'zip'],
   ['wav', 'mp3'],
+  ['mov', 'mp4'],
 ];
 
 function Pill({ from, to }) {

frontend/src/components/FormatsGrid.jsx

@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next';
-import { Image, FileText, TextAa, BookOpen, Archive, MusicNotes } from '@phosphor-icons/react';
+import { Image, FileText, TextAa, BookOpen, Archive, MusicNotes, VideoCamera } from '@phosphor-icons/react';
 import { FORMAT_FAMILIES } from '../data/formats.js';
 
 const FAMILY_ICONS = {
@@ -9,6 +9,7 @@ const FAMILY_ICONS = {
   ebooks: BookOpen,
   archives: Archive,
   audio: MusicNotes,
+  video: VideoCamera,
 };
 
 export function FormatsGrid() {

frontend/src/data/formats.js

@@ -23,4 +23,8 @@ export const FORMAT_FAMILIES = [
     key: 'audio',
     formats: ['mp3', 'wav', 'ogg', 'flac', 'aac', 'm4a'],
   },
+  {
+    key: 'video',
+    formats: ['mp4', 'webm', 'mov', 'avi', 'mkv'],
+  },
 ];

frontend/src/index.css

@@ -25,6 +25,7 @@
   --color-family-ebooks: #10b981;
   --color-family-archives: #64748b;
   --color-family-audio: #ec4899;
+  --color-family-video: #38bdf8;
 
   --font-sans: 'Plus Jakarta Sans', system-ui, 'Segoe UI', Roboto, sans-serif;
   --font-display: 'Bricolage Grotesque', var(--font-sans);
@@ -55,6 +56,7 @@
   --color-family-ebooks: #34d399;
   --color-family-archives: #94a3b8;
   --color-family-audio: #f472b6;
+  --color-family-video: #7dd3fc;
 }
 
 *, *::before, *::after {

frontend/src/locales/en.json

@@ -23,7 +23,9 @@
     "compression": "Compression",
     "iconSize": "Icon size",
     "compressPdf": "Compress as JPEG",
-    "bitrate": "Bitrate"
+    "bitrate": "Bitrate",
+    "resolution": "Resolution",
+    "original": "Original"
   },
   "job": {
     "converting": "Converting...",
@@ -43,7 +45,8 @@
     "fonts": "Fonts",
     "ebooks": "Ebooks",
     "archives": "Archives",
-    "audio": "Audio"
+    "audio": "Audio",
+    "video": "Video"
   },
   "footer": {
     "rights": "Ombrora Convert — Online file conversion"

frontend/src/locales/fr.json

@@ -23,7 +23,9 @@
     "compression": "Compression",
     "iconSize": "Taille de l'icône",
     "compressPdf": "Compresser en JPEG",
-    "bitrate": "Bitrate"
+    "bitrate": "Bitrate",
+    "resolution": "Résolution",
+    "original": "Original"
   },
   "job": {
     "converting": "Conversion en cours...",
@@ -43,7 +45,8 @@
     "fonts": "Polices",
     "ebooks": "Ebooks",
     "archives": "Archives",
-    "audio": "Audio"
+    "audio": "Audio",
+    "video": "Vidéo"
   },
   "footer": {
     "rights": "Ombrora Convert — Conversion de fichiers en ligne"

frontend/src/utils/fileFamily.js

@@ -1,4 +1,4 @@
-import { Image, FileText, TextAa, BookOpen, Archive, MusicNotes, File as FileIcon } from '@phosphor-icons/react';
+import { Image, FileText, TextAa, BookOpen, Archive, MusicNotes, VideoCamera, File as FileIcon } from '@phosphor-icons/react';
 import { FORMAT_FAMILIES } from '../data/formats.js';
 
 const FAMILY_ICONS = {
@@ -8,6 +8,7 @@ const FAMILY_ICONS = {
   ebooks: BookOpen,
   archives: Archive,
   audio: MusicNotes,
+  video: VideoCamera,
 };
 
 export function familyForExtension(extension) {