@jjlmoya/utils-audiovisual 1.5.0 → 1.7.0

package/src/tool/subtitleSync/component.astro

@@ -186,7 +186,7 @@ const { ui } = Astro.props;
 </script>
 
 <style>
-.ss-root {
+:global(.ss-root) {
   --ss-bg: #fff;
   --ss-bg-elevated: #f8fafc;
   --ss-border: #e2e8f0;
@@ -202,7 +202,7 @@ const { ui } = Astro.props;
   margin: 0 auto;
 }
 
-:global(.theme-dark) .ss-root {
+:global(.theme-dark .ss-root) {
   --ss-bg: #18181b;
   --ss-bg-elevated: #27272a;
   --ss-border: #3f3f46;
@@ -214,7 +214,7 @@ const { ui } = Astro.props;
   --ss-shadow: rgba(0, 0, 0, 0.3);
 }
 
-.ss-card {
+:global(.ss-card) {
   background: var(--ss-bg);
   border: 1px solid var(--ss-border);
   border-radius: 2.5rem;
@@ -225,7 +225,7 @@ const { ui } = Astro.props;
   gap: 3rem;
 }
 
-.ss-drop {
+:global(.ss-drop) {
   border: 3px dashed var(--ss-border);
   padding: 3.5rem 2.5rem;
   border-radius: 2.25rem;
@@ -239,13 +239,13 @@ const { ui } = Astro.props;
   text-align: center;
 }
 
-.ss-drop:hover,
-.ss-drop-active {
+:global(.ss-drop:hover),
+:global(.ss-drop-active) {
   border-color: var(--ss-accent);
   background: var(--ss-accent-alpha);
 }
 
-.ss-drop-icon {
+:global(.ss-drop-icon) {
   width: 4.5rem;
   height: 4.5rem;
   background: var(--ss-accent-alpha);
@@ -256,19 +256,19 @@ const { ui } = Astro.props;
   color: var(--ss-accent);
 }
 
-.ss-drop-icon svg {
+:global(.ss-drop-icon svg) {
   width: 2.25rem;
   height: 2.25rem;
 }
 
-.ss-drop-title {
+:global(.ss-drop-title) {
   font-size: 1.75rem;
   font-weight: 950;
   color: var(--ss-text);
   margin: 0;
 }
 
-.ss-drop-sub {
+:global(.ss-drop-sub) {
   font-size: 1rem;
   color: var(--ss-text-muted);
   max-width: 320px;
@@ -276,7 +276,7 @@ const { ui } = Astro.props;
   font-weight: 700;
 }
 
-.ss-controls {
+:global(.ss-controls) {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 3rem;
@@ -284,18 +284,18 @@ const { ui } = Astro.props;
 }
 
 @media (max-width: 800px) {
-  .ss-controls {
+  :global(.ss-controls) {
     grid-template-columns: 1fr;
   }
 }
 
-.ss-control-group {
+:global(.ss-control-group) {
   display: flex;
   flex-direction: column;
   gap: 1.5rem;
 }
 
-.ss-control-label {
+:global(.ss-control-label) {
   font-size: 0.8rem;
   font-weight: 900;
   text-transform: uppercase;
@@ -303,7 +303,7 @@ const { ui } = Astro.props;
   letter-spacing: 0.1em;
 }
 
-.ss-offset-wrap {
+:global(.ss-offset-wrap) {
   display: flex;
   align-items: center;
   gap: 1rem;
@@ -313,7 +313,7 @@ const { ui } = Astro.props;
   padding: 0.75rem 1.25rem;
 }
 
-.ss-offset-btn {
+:global(.ss-offset-btn) {
   width: 2.5rem;
   height: 2.5rem;
   background: none;
@@ -327,16 +327,16 @@ const { ui } = Astro.props;
   flex-shrink: 0;
 }
 
-.ss-offset-btn:hover {
+:global(.ss-offset-btn:hover) {
   color: var(--ss-accent);
 }
 
-.ss-offset-btn svg {
+:global(.ss-offset-btn svg) {
   width: 1.5rem;
   height: 1.5rem;
 }
 
-.ss-offset-input {
+:global(.ss-offset-input) {
   flex: 1;
   background: transparent;
   border: none;
@@ -348,28 +348,28 @@ const { ui } = Astro.props;
   text-align: center;
 }
 
-.ss-stats {
+:global(.ss-stats) {
   display: flex;
   gap: 2rem;
   justify-content: center;
   margin-top: 1rem;
 }
 
-.ss-stat {
+:global(.ss-stat) {
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 0.25rem;
 }
 
-.ss-stat-value {
+:global(.ss-stat-value) {
   display: block;
   font-weight: 900;
   color: var(--ss-accent);
   font-size: 1.25rem;
 }
 
-.ss-stat-label {
+:global(.ss-stat-label) {
   font-size: 0.7rem;
   font-weight: 800;
   text-transform: uppercase;
@@ -377,33 +377,33 @@ const { ui } = Astro.props;
   letter-spacing: 0.05em;
 }
 
-.ss-status-card {
+:global(.ss-status-card) {
   display: flex;
   flex-direction: column;
   gap: 1.5rem;
 }
 
-.ss-file-row {
+:global(.ss-file-row) {
   display: flex;
   align-items: center;
   gap: 1.5rem;
 }
 
-.ss-file-icon {
+:global(.ss-file-icon) {
   width: 3rem;
   height: 3rem;
   color: var(--ss-accent);
   flex-shrink: 0;
 }
 
-.ss-file-info {
+:global(.ss-file-info) {
   display: flex;
   flex-direction: column;
   gap: 0.25rem;
   min-width: 0;
 }
 
-.ss-file-name {
+:global(.ss-file-name) {
   font-weight: 950;
   color: var(--ss-text);
   font-size: 0.95rem;
@@ -412,13 +412,13 @@ const { ui } = Astro.props;
   text-overflow: ellipsis;
 }
 
-.ss-file-times {
+:global(.ss-file-times) {
   font-size: 0.8rem;
   font-weight: 700;
   color: var(--ss-text-muted);
 }
 
-.ss-btn-primary {
+:global(.ss-btn-primary) {
   width: 100%;
   padding: 1.25rem;
   background: var(--ss-accent);
@@ -435,17 +435,17 @@ const { ui } = Astro.props;
   transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s;
 }
 
-.ss-btn-primary:hover {
+:global(.ss-btn-primary:hover) {
   transform: translateY(-4px) scale(1.02);
   box-shadow: 0 15px 35px -10px var(--ss-accent);
 }
 
-.ss-btn-primary svg {
+:global(.ss-btn-primary svg) {
   width: 1.25rem;
   height: 1.25rem;
 }
 
-.ss-previews {
+:global(.ss-previews) {
   grid-column: 1 / -1;
   display: grid;
   grid-template-columns: 1fr 1fr;
@@ -453,13 +453,13 @@ const { ui } = Astro.props;
 }
 
 @media (max-width: 800px) {
-  .ss-previews {
+  :global(.ss-previews) {
     grid-column: auto;
     grid-template-columns: 1fr;
   }
 }
 
-.ss-preview-box {
+:global(.ss-preview-box) {
   background: var(--ss-bg-elevated);
   padding: 1.5rem;
   border-radius: 1.75rem;
@@ -469,7 +469,7 @@ const { ui } = Astro.props;
   gap: 1rem;
 }
 
-.ss-preview-label {
+:global(.ss-preview-label) {
   font-size: 0.75rem;
   font-weight: 950;
   text-transform: uppercase;
@@ -478,11 +478,11 @@ const { ui } = Astro.props;
   letter-spacing: 0.05em;
 }
 
-.ss-preview-label-modified {
+:global(.ss-preview-label-modified) {
   color: var(--ss-accent);
 }
 
-.ss-preview-scroll {
+:global(.ss-preview-scroll) {
   max-height: 250px;
   overflow-y: auto;
   display: flex;
@@ -490,25 +490,25 @@ const { ui } = Astro.props;
   gap: 1rem;
 }
 
-.ss-preview-item {
+:global(.ss-preview-item) {
   font-size: 0.85rem;
   line-height: 1.5;
 }
 
-.ss-preview-time {
+:global(.ss-preview-time) {
   font-weight: 950;
   color: var(--ss-accent);
   font-size: 0.75rem;
   margin: 0 0 0.25rem;
 }
 
-.ss-preview-text {
+:global(.ss-preview-text) {
   font-weight: 700;
   color: var(--ss-text);
   margin: 0;
 }
 
-.ss-hidden {
+:global(.ss-hidden) {
   display: none;
 }
 </style>

package/src/tool/subtitleSync/i18n/en.ts

@@ -2,7 +2,7 @@ import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dt
 import type { SubtitleSyncUI, SubtitleSyncLocaleContent } from '../index';
 
 const slug = 'synchronize-srt-subtitles-online-adjust-timing-free';
-const title = 'Synchronize SRT Subtitles Online - Adjust Timing for Free';
+const title = 'Synchronize SRT Subtitles Online: Adjust Timing for Free';
 const description = 'Online tool to advance or delay SRT subtitles. Correct timing offset easily and download the synchronized file instantly.';
 
 const ui: SubtitleSyncUI = {

package/src/tool/subtitleSync/i18n/es.ts

@@ -2,7 +2,7 @@ import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dt
 import type { SubtitleSyncUI, SubtitleSyncLocaleContent } from '../index';
 
 const slug = 'sincronizar-subtitulos';
-const title = 'Sincronizar Subtítulos SRT Online - Ajusta el Tiempo Gratis';
+const title = 'Sincronizar Subtítulos SRT Online: Ajusta el Tiempo Gratis';
 const description = 'Herramienta online para adelantar o retrasar subtítulos SRT. Corrige el desfase de tiempo de forma sencilla y descarga el archivo sincronizado al instante.';
 
 const ui: SubtitleSyncUI = {

package/src/tool/subtitleSync/i18n/fr.ts

@@ -2,7 +2,7 @@ import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dt
 import type { SubtitleSyncUI, SubtitleSyncLocaleContent } from '../index';
 
 const slug = 'synchroniser-sous-titres-srt-en-ligne-ajuster-temps-gratuit';
-const title = 'Synchroniser les Sous-titres SRT en Ligne - Ajustez le Temps Gratuitement';
+const title = 'Synchronisation SRT en Ligne: Ajustez le Temps Gratuitement';
 const description = 'Outil en ligne pour avancer ou retarder les sous-titres SRT. Corrigez le décalage de temps simplement et téléchargez le fichier synchronisé instantanément.';
 
 const ui: SubtitleSyncUI = {
@@ -73,7 +73,7 @@ const bibliography: SubtitleSyncLocaleContent['bibliography'] = [
 const seo: SubtitleSyncLocaleContent['seo'] = [
     {
         type: 'summary',
-        title: 'Synchronisation de Sous-titres Professionnelle',
+        title: 'Synchronisation SRT Professionnelle',
         items: [
             'Correction instantanée des décalages audio-sous-titres',
             'Supporte les fichiers SRT (SubRip) standards',
@@ -103,7 +103,7 @@ const seo: SubtitleSyncLocaleContent['seo'] = [
     { type: 'title', text: 'Cas d\'Utilisation Courants', level: 3 },
     { type: 'comparative', items: [
         {
-            title: 'Traducteurs et Sous-titreurs',
+            title: 'Traducteurs et Professionnels SRT',
             description: 'Synchroniser des traductions après avoir travaillé avec plusieurs versions vidéo',
             icon: 'mdi:translate',
             points: [

package/src/tool/timelapseCalculator/component.astro

@@ -132,7 +132,6 @@ const { ui } = Astro.props;
     els.shutter.innerText = formatShutter(r.shutterSpeed);
   }
 
-  // eslint-disable-next-line complexity
   function recalculate() {
     const h = +(els.hours?.value || 0), m = +(els.minutes?.value || 0), s = +(els.seconds?.value || 0), f = +(els.fps?.value || 24);
     updateResultDisplay(calculateTimelapse(h * 3600 + m * 60, s, f));
@@ -147,13 +146,13 @@ const { ui } = Astro.props;
 </script>
 
 <style>
-.tlc-root {
+:global(.tlc-root) {
   width: 100%;
   max-width: 64rem;
   margin: 0 auto;
 }
 
-.tlc-grid {
+:global(.tlc-grid) {
   display: grid;
   grid-template-columns: 1fr 1fr;
   border-radius: 1.5rem;
@@ -162,7 +161,7 @@ const { ui } = Astro.props;
   box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
 }
 
-:global(.theme-dark) .tlc-grid {
+:global(.theme-dark .tlc-grid) {
   border-color: #334155;
   box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
 }
@@ -173,7 +172,7 @@ const { ui } = Astro.props;
   }
 }
 
-.tlc-inputs-panel {
+:global(.tlc-inputs-panel) {
   padding: 2rem 3rem;
   background: #f8fafc;
   display: flex;
@@ -181,17 +180,17 @@ const { ui } = Astro.props;
   gap: 2rem;
 }
 
-:global(.theme-dark) .tlc-inputs-panel {
+:global(.theme-dark .tlc-inputs-panel) {
   background: rgba(15, 23, 42, 0.5);
 }
 
 @media (max-width: 768px) {
-  .tlc-inputs-panel {
+  :global(.tlc-inputs-panel) {
     padding: 2rem;
   }
 }
 
-.tlc-panel-title {
+:global(.tlc-panel-title) {
   display: flex;
   align-items: center;
   gap: 0.5rem;
@@ -201,29 +200,29 @@ const { ui } = Astro.props;
   margin: 0;
 }
 
-:global(.theme-dark) .tlc-panel-title {
+:global(.theme-dark .tlc-panel-title) {
   color: #f8fafc;
 }
 
-.tlc-panel-icon {
+:global(.tlc-panel-icon) {
   width: 1.25rem;
   height: 1.25rem;
   color: #6366f1;
 }
 
-.tlc-fields {
+:global(.tlc-fields) {
   display: flex;
   flex-direction: column;
   gap: 1.5rem;
 }
 
-.tlc-field-group {
+:global(.tlc-field-group) {
   display: flex;
   flex-direction: column;
   gap: 0.75rem;
 }
 
-.tlc-group-label {
+:global(.tlc-group-label) {
   font-size: 0.7rem;
   font-weight: 700;
   text-transform: uppercase;
@@ -231,25 +230,25 @@ const { ui } = Astro.props;
   color: #64748b;
 }
 
-.tlc-row {
+:global(.tlc-row) {
   display: flex;
   gap: 1rem;
 }
 
-.tlc-field {
+:global(.tlc-field) {
   flex: 1;
   display: flex;
   flex-direction: column;
   gap: 0.25rem;
 }
 
-.tlc-sub-label {
+:global(.tlc-sub-label) {
   font-size: 0.7rem;
   color: #94a3b8;
   margin-left: 0.25rem;
 }
 
-.tlc-input {
+:global(.tlc-input) {
   width: 100%;
   background: #fff;
   border: 2px solid #e2e8f0;
@@ -263,41 +262,41 @@ const { ui } = Astro.props;
   box-sizing: border-box;
 }
 
-:global(.theme-dark) .tlc-input {
+:global(.theme-dark .tlc-input) {
   background: #1e293b;
   border-color: #334155;
   color: #f8fafc;
 }
 
-.tlc-input-indigo:focus {
+:global(.tlc-input-indigo:focus) {
   border-color: #6366f1;
   box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
 }
 
-:global(.theme-dark) .tlc-input-indigo:focus {
+:global(.theme-dark .tlc-input-indigo:focus) {
   box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.25);
 }
 
-.tlc-input-pink:focus {
+:global(.tlc-input-pink:focus) {
   border-color: #ec4899;
   box-shadow: 0 0 0 3px rgba(236, 72, 153, 0.15);
 }
 
-:global(.theme-dark) .tlc-input-pink:focus {
+:global(.theme-dark .tlc-input-pink:focus) {
   box-shadow: 0 0 0 3px rgba(236, 72, 153, 0.25);
 }
 
-.tlc-select-wrapper {
+:global(.tlc-select-wrapper) {
   position: relative;
 }
 
-.tlc-select {
+:global(.tlc-select) {
   appearance: none;
   cursor: pointer;
   width: 100%;
 }
 
-.tlc-select-arrow {
+:global(.tlc-select-arrow) {
   position: absolute;
   right: 1rem;
   top: 50%;
@@ -308,7 +307,7 @@ const { ui } = Astro.props;
   pointer-events: none;
 }
 
-.tlc-results-panel {
+:global(.tlc-results-panel) {
   padding: 2rem 3rem;
   background: linear-gradient(135deg, #4f46e5, #7c3aed);
   color: #fff;
@@ -319,12 +318,12 @@ const { ui } = Astro.props;
 }
 
 @media (max-width: 768px) {
-  .tlc-results-panel {
+  :global(.tlc-results-panel) {
     padding: 2rem;
   }
 }
 
-.tlc-results-title {
+:global(.tlc-results-title) {
   display: flex;
   align-items: center;
   gap: 0.5rem;
@@ -334,19 +333,19 @@ const { ui } = Astro.props;
   margin: 0;
 }
 
-.tlc-results-icon {
+:global(.tlc-results-icon) {
   width: 1.25rem;
   height: 1.25rem;
   color: #a5b4fc;
 }
 
-.tlc-interval-section {
+:global(.tlc-interval-section) {
   display: flex;
   flex-direction: column;
   gap: 0.5rem;
 }
 
-.tlc-interval-label {
+:global(.tlc-interval-label) {
   font-size: 0.7rem;
   font-weight: 700;
   text-transform: uppercase;
@@ -355,38 +354,38 @@ const { ui } = Astro.props;
   margin: 0;
 }
 
-.tlc-interval-value {
+:global(.tlc-interval-value) {
   display: flex;
   align-items: baseline;
   gap: 0.5rem;
 }
 
-.tlc-big-number {
+:global(.tlc-big-number) {
   font-size: clamp(3.5rem, 8vw, 5rem);
   font-weight: 900;
   letter-spacing: -0.03em;
   line-height: 1;
 }
 
-.tlc-big-unit {
+:global(.tlc-big-unit) {
   font-size: 1.5rem;
   font-weight: 700;
   color: #a5b4fc;
 }
 
-.tlc-stats-grid {
+:global(.tlc-stats-grid) {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 1.5rem 2rem;
 }
 
-.tlc-stat {
+:global(.tlc-stat) {
   display: flex;
   flex-direction: column;
   gap: 0.25rem;
 }
 
-.tlc-stat-label {
+:global(.tlc-stat-label) {
   font-size: 0.65rem;
   font-weight: 700;
   text-transform: uppercase;
@@ -395,7 +394,7 @@ const { ui } = Astro.props;
   margin: 0;
 }
 
-.tlc-stat-value {
+:global(.tlc-stat-value) {
   font-size: 1.875rem;
   font-weight: 700;
   font-variant-numeric: tabular-nums;
@@ -403,12 +402,12 @@ const { ui } = Astro.props;
   line-height: 1.1;
 }
 
-.tlc-stat-value-sm {
+:global(.tlc-stat-value-sm) {
   font-size: 1.25rem;
   color: #e0e7ff;
 }
 
-.tlc-rule-info {
+:global(.tlc-rule-info) {
   display: flex;
   align-items: flex-start;
   gap: 1rem;
@@ -416,7 +415,7 @@ const { ui } = Astro.props;
   border-top: 1px solid rgba(165, 180, 252, 0.3);
 }
 
-.tlc-info-icon {
+:global(.tlc-info-icon) {
   width: 1.5rem;
   height: 1.5rem;
   color: #a5b4fc;
@@ -424,7 +423,7 @@ const { ui } = Astro.props;
   margin-top: 0.1rem;
 }
 
-.tlc-info-text {
+:global(.tlc-info-text) {
   font-size: 0.8rem;
   line-height: 1.5;
   color: #c7d2fe;