@jjlmoya/utils-developer 1.13.0 → 1.15.0

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@jjlmoya/utils-developer",
-    "version": "1.13.0",
+    "version": "1.15.0",
     "type": "module",
     "main": "./src/index.ts",
     "types": "./src/index.ts",

package/src/category/i18n/fr.ts

@@ -4,7 +4,7 @@ export const content: CategoryLocaleContent = {
   slug: 'developpement-web',
   title: 'Développement Web',
   description:
-    "Outils gratuits de développement web : formateurs, calculatrices CSS, générateurs et utilitaires pour développeurs frontend et backend.",
+    "Outils gratuits de développement web: formateurs, calculatrices CSS, générateurs et utilitaires pour développeurs frontend et backend.",
   seo: [
     {
       type: 'summary',

package/src/category/i18n/ru.ts

@@ -23,7 +23,7 @@ export const content: CategoryLocaleContent = {
     },
     {
       type: 'paragraph',
-      html: 'Коллекция инструментов, разработанных для ускорения рабочего процесса веб-разработчиков. От валидации JSON до калькуляторов специфичности CSS — каждая утилита создана для решения реальных повседневных задач разработки.',
+      html: 'Коллекция инструментов, разработанных для ускорения рабочего процесса веб-разработчиков. От валидации JSON до калькуляторов специфичности CSS - каждая утилита создана для решения реальных повседневных задач разработки.',
     },
     {
       type: 'tip',

package/src/layouts/PreviewLayout.astro

@@ -78,6 +78,7 @@ const { title, currentLocale = "es", localeUrls = {}, hasSidebar = false } = Ast
     transition:
       background-color 0.3s ease,
       color 0.3s ease;
+    font-family: Inter, sans-serif;
   }
 
   main {

package/src/pages/[locale]/[slug].astro

@@ -34,18 +34,28 @@ export async function getStaticPaths() {
       ]),
     ) as Partial<Record<KnownLocale, string>>;
 
+    const firstLoader = entry.i18n.en ?? Object.values(entry.i18n)[0];
+    const englishSlug = firstLoader ? (await firstLoader()).slug : entry.id;
+
     for (const { locale, content } of localeContents) {
-      const allToolsNav = await Promise.all(
-        ALL_TOOLS.map(async ({ entry: navEntry }) => ({
-          id: navEntry.id,
-          title: (await navEntry.i18n[locale]!()).title,
-          href: `/${locale}/${(await navEntry.i18n[locale]!()).slug}`,
-          isActive: navEntry.id === entry.id,
-        })),
-      );
+      const allToolsNav = (
+        await Promise.all(
+          ALL_TOOLS.map(async ({ entry: navEntry }) => {
+            const loader = navEntry.i18n[locale] ?? navEntry.i18n.en;
+            if (!loader) return null;
+            const navContent = await loader();
+            return {
+              id: navEntry.id,
+              title: navContent.title,
+              href: `/${locale}/${navContent.slug}`,
+              isActive: navEntry.id === entry.id,
+            };
+          }),
+        )
+      ).filter(Boolean) as NavItem[];
       paths.push({
         params: { locale, slug: content.slug },
-        props: { Component, locale, content, localeUrls, allToolsNav },
+        props: { Component, locale, content, localeUrls, allToolsNav, englishSlug },
       });
     }
   }
@@ -66,11 +76,17 @@ interface Props {
   content: ToolLocaleContent;
   localeUrls: Partial<Record<KnownLocale, string>>;
   allToolsNav: NavItem[];
+  englishSlug: string;
 }
 
-const { Component, locale, content, localeUrls, allToolsNav } = Astro.props;
+const { Component, locale, content, localeUrls, allToolsNav, englishSlug } = Astro.props;
+
+const cssFiles = import.meta.glob("../../tool/*/*.css", { query: "?raw", import: "default" });
+const cssKey = Object.keys(cssFiles).find((k) => k.endsWith(`/${englishSlug}.css`));
+const cssLoader = cssKey ? cssFiles[cssKey] : undefined;
+const toolCss = cssLoader ? await cssLoader() as string : "";
 
-const seoContent: UtilitySEOContent = { locale, sections: content.seo };
+const seoContent: UtilitySEOContent = { locale, sections: content.seo ?? [] };
 
 const words = content.title.split(" ");
 const titleHighlight = words[0] || "";
@@ -89,8 +105,9 @@ const titleBase = words.slice(1).join(" ") || "";
     tools={allToolsNav}
   />
   <Fragment slot="head">
+    {toolCss ? <Fragment set:html={`<style is:inline>${toolCss}</style>`} /> : null}
     {
-      content.schemas.map((schema: unknown) => (
+      ( content.schemas ?? []).map((schema: unknown) => (
         <script
           is:inline
           type="application/ld+json"

package/src/tests/diacritics_density.test.ts

@@ -0,0 +1,118 @@
+import { describe, expect, it } from 'vitest';
+import { ALL_TOOLS } from '../tools';
+
+type LocaleWithDiacritics = keyof typeof DIACRITIC_RULES;
+
+const DIACRITIC_RULES = {
+  de: {
+    language: 'German',
+    expectedCharacters: 'ä ö ü ß',
+    characters: /[äöüÄÖÜß]/g,
+    minPerThousandLetters: 0.1,
+  },
+  es: {
+    language: 'Spanish',
+    expectedCharacters: 'á é í ó ú ü ñ',
+    characters: /[áéíóúüñÁÉÍÓÚÜÑ]/g,
+    minPerThousandLetters: 0.1,
+  },
+  fr: {
+    language: 'French',
+    expectedCharacters: 'à â æ ç é è ê ë î ï ô œ ù û ü ÿ',
+    characters: /[àâæçéèêëîïôœùûüÿÀÂÆÇÉÈÊËÎÏÔŒÙÛÜŸ]/g,
+    minPerThousandLetters: 0.1,
+  },
+  it: {
+    language: 'Italian',
+    expectedCharacters: 'à è é ì í î ò ó ù ú',
+    characters: /[àèéìíîòóùúÀÈÉÌÍÎÒÓÙÚ]/g,
+    minPerThousandLetters: 0.1,
+  },
+  pl: {
+    language: 'Polish',
+    expectedCharacters: 'ą ć ę ł ń ó ś ź ż',
+    characters: /[ąćęłńóśźżĄĆĘŁŃÓŚŹŻ]/g,
+    minPerThousandLetters: 0.1,
+  },
+  pt: {
+    language: 'Portuguese',
+    expectedCharacters: 'á â ã à ç é ê í ó ô õ ú ü',
+    characters: /[áâãàçéêíóôõúüÁÂÃÀÇÉÊÍÓÔÕÚÜ]/g,
+    minPerThousandLetters: 0.1,
+  },
+  sv: {
+    language: 'Swedish',
+    expectedCharacters: 'å ä ö',
+    characters: /[åäöÅÄÖ]/g,
+    minPerThousandLetters: 0.1,
+  },
+  tr: {
+    language: 'Turkish',
+    expectedCharacters: 'ç ğ ı İ ö ş ü',
+    characters: /[çğıöşüÇĞİÖŞÜ]/g,
+    minPerThousandLetters: 0.1,
+  },
+} as const;
+
+const LETTERS = /\p{L}/gu;
+const TRANSLATABLE_KEYS = ['title', 'description', 'ui', 'seo', 'faq', 'howTo'] as const;
+
+function collectStrings(value: unknown): string[] {
+  if (typeof value === 'string') return [value];
+  if (!value || typeof value !== 'object') return [];
+  if (Array.isArray(value)) return value.flatMap(collectStrings);
+  return Object.values(value).flatMap(collectStrings);
+}
+
+function normalizeText(value: unknown): string {
+  return collectStrings(value).join(' ').normalize('NFC');
+}
+
+function translatableContent(content: Record<string, unknown>) {
+  return TRANSLATABLE_KEYS.map((key) => content[key]);
+}
+
+function letterCount(text: string): number {
+  return text.match(LETTERS)?.length ?? 0;
+}
+
+function diacriticCount(text: string, locale: LocaleWithDiacritics): number {
+  return text.match(DIACRITIC_RULES[locale].characters)?.length ?? 0;
+}
+
+function diacriticsPerThousandLetters(text: string, locale: LocaleWithDiacritics): number {
+  const letters = letterCount(text);
+  if (letters === 0) return 0;
+  return diacriticCount(text, locale) / letters * 1000;
+}
+
+describe('Diacritics density validation', () => {
+  ALL_TOOLS.forEach((tool) => {
+    describe(`Tool: ${tool.entry.id}`, () => {
+      Object.keys(DIACRITIC_RULES).forEach((locale) => {
+        it(`${locale} keeps the expected accent and special-letter set`, async () => {
+          const typedLocale = locale as LocaleWithDiacritics;
+          const loader = tool.entry.i18n[typedLocale];
+          if (!loader) return;
+
+          const content = await loader();
+          const text = normalizeText(translatableContent(content as Record<string, unknown>));
+          const rule = DIACRITIC_RULES[typedLocale];
+          const letters = letterCount(text);
+          const matches = diacriticCount(text, typedLocale);
+          const density = diacriticsPerThousandLetters(text, typedLocale);
+
+          expect(
+            density,
+            [
+              `Possible spelling or encoding issue detected in ${tool.entry.id}/${typedLocale} (${rule.language}).`,
+              `The text has ${matches} special characters (${density.toFixed(2)} per 1000 letters, ${letters} letters analyzed).`,
+              `This locale should include some of these characters: ${rule.expectedCharacters}.`,
+              'If the count is 0 or near 0, accents, tildes, or special letters were probably stripped by encoding or normalization.',
+            ].join(' '),
+          ).toBeGreaterThanOrEqual(rule.minPerThousandLetters);
+        });
+      });
+    });
+  });
+});

package/src/tests/inverted_punctuation.test.ts

@@ -0,0 +1,113 @@
+import { describe, expect, it } from 'vitest';
+import { ALL_TOOLS } from '../tools';
+
+const INVERTED_PUNCTUATION_LOCALES = {
+  es: {
+    language: 'Spanish',
+    questionStart: '¿',
+    questionEnd: '?',
+    exclamationStart: '¡',
+    exclamationEnd: '!',
+  },
+} as const;
+
+type InvertedPunctuationLocale = keyof typeof INVERTED_PUNCTUATION_LOCALES;
+
+const TRANSLATABLE_KEYS = ['title', 'description', 'ui', 'seo', 'faq', 'howTo'] as const;
+
+function collectStrings(value: unknown): string[] {
+  if (typeof value === 'string') return [value];
+  if (!value || typeof value !== 'object') return [];
+  if (Array.isArray(value)) return value.flatMap(collectStrings);
+  return Object.values(value).flatMap(collectStrings);
+}
+
+function translatableStrings(content: Record<string, unknown>): string[] {
+  return TRANSLATABLE_KEYS.flatMap((key) => collectStrings(content[key]));
+}
+
+function sentenceStart(text: string, endIndex: number): string {
+  const beforeMark = text.slice(0, endIndex).trimEnd();
+
+  const boundaries = [
+    ...[...beforeMark.matchAll(/\.(?=\s|$)/g)].map((m) => m.index ?? 0),
+    ...[...beforeMark.matchAll(/:(?=\s|$)/g)].map((m) => m.index ?? 0),
+    ...[...beforeMark.matchAll(/;(?=\s|$)/g)].map((m) => m.index ?? 0),
+  ];
+
+  const lastBoundary = boundaries.length > 0
+    ? Math.max(...boundaries)
+    : -1;
+
+  const nlBoundary = beforeMark.lastIndexOf('\n');
+  const boundary = Math.max(lastBoundary, nlBoundary);
+
+  return beforeMark.slice(boundary + 1).trimStart();
+}
+
+function isCodeContext(text: string, index: number, mark: string): boolean {
+  if (mark === '!') {
+    const after = text.slice(index + 1, index + 10);
+    return /^important\b/.test(after);
+  }
+  if (mark === '?') {
+    const before = text.slice(Math.max(0, index - 2), index);
+    return /[,#\/&+=]/.test(before) || / y $/.test(text.slice(0, index));
+  }
+  return false;
+}
+
+function findMissingInvertedMarks(
+  text: string,
+  startMark: string,
+  endMark: string,
+  _toolId: string,
+): string[] {
+  const cleaned = text.replace(/<code>.*?<\/code>/g, '');
+
+  return [...cleaned.matchAll(new RegExp(`\\${endMark}`, 'g'))]
+    .filter((match) => !isCodeContext(cleaned, match.index ?? 0, endMark))
+    .map((match) => sentenceStart(cleaned, match.index ?? 0))
+    .filter((segment) => {
+      if (segment.length === 0) return false;
+      if (segment.includes(startMark)) return false;
+      if (endMark === '?' && /:\/\//.test(segment)) return false;
+      return true;
+    })
+    .map((segment) => `${segment}${endMark}`);
+}
+
+describe('Inverted punctuation validation', () => {
+  ALL_TOOLS.forEach((tool) => {
+    describe(`Tool: ${tool.entry.id}`, () => {
+      Object.keys(INVERTED_PUNCTUATION_LOCALES).forEach((locale) => {
+        it(`${locale} uses opening punctuation marks for questions and exclamations`, async () => {
+          const typedLocale = locale as InvertedPunctuationLocale;
+          const loader = tool.entry.i18n[typedLocale];
+          if (!loader) return;
+
+          const rule = INVERTED_PUNCTUATION_LOCALES[typedLocale];
+          const content = await loader();
+          const strings = translatableStrings(content as Record<string, unknown>);
+          const toolId = tool.entry.id;
+          const missingQuestions = strings.flatMap((text) =>
+            findMissingInvertedMarks(text, rule.questionStart, rule.questionEnd, toolId)
+          );
+          const missingExclamations = strings.flatMap((text) =>
+            findMissingInvertedMarks(text, rule.exclamationStart, rule.exclamationEnd, toolId)
+          );
+          const failures = [...missingQuestions, ...missingExclamations];
+
+          expect(
+            failures,
+            [
+              `Missing opening punctuation marks in ${tool.entry.id}/${typedLocale} (${rule.language}).`,
+              `Questions must use ${rule.questionStart}...${rule.questionEnd} and exclamations must use ${rule.exclamationStart}...${rule.exclamationEnd}.`,
+              `Examples: ${failures.slice(0, 5).join(' | ')}`,
+            ].join(' '),
+          ).toHaveLength(0);
+        });
+      });
+    });
+  });
+});

package/src/tests/no_en_dash.test.ts

@@ -0,0 +1,73 @@
+import { describe, it, expect } from 'vitest';
+import fs from 'node:fs';
+import path from 'node:path';
+
+function getFiles(dir: string): string[] {
+  const results: string[] = [];
+  if (!fs.existsSync(dir)) {
+    return results;
+  }
+  const list = fs.readdirSync(dir);
+  for (const file of list) {
+    const fullPath = path.join(dir, file);
+    const stat = fs.statSync(fullPath);
+    if (stat && stat.isDirectory()) {
+      if (file !== 'tests' && file !== 'node_modules' && file !== '.astro') {
+        results.push(...getFiles(fullPath));
+      }
+    } else {
+      results.push(fullPath);
+    }
+  }
+  return results;
+}
+
+function isContentFile(filePath: string): boolean {
+  return /\\i18n\\/.test(filePath) || filePath.endsWith('bibliography.ts');
+}
+
+const srcDir = path.join(process.cwd(), 'src');
+const scriptsDir = path.join(process.cwd(), 'scripts');
+const filesToTest = [
+  ...getFiles(srcDir).filter(isContentFile),
+  ...getFiles(scriptsDir).filter(isContentFile),
+];
+
+const aiTypographyGarbage = [
+  '\u2013',
+  '\u2014',
+  '\u2026',
+  '\u201C',
+  '\u201D',
+  '\u2018',
+  '\u2019',
+  '\u00AB',
+  '\u00BB',
+  '\u200B',
+  '\u201E',
+];
+
+describe('Typography Garbage Character Validation', () => {
+  filesToTest.forEach((filePath) => {
+    const relativePath = path.relative(process.cwd(), filePath);
+    it(`should not contain typography garbage characters in ${relativePath}`, () => {
+      const content = fs.readFileSync(filePath, 'utf-8');
+      const hasAiPatterns = aiTypographyGarbage.some(char => content.includes(char));
+      expect(hasAiPatterns).toBe(false);
+    });
+
+    it(`should not contain space before colon in ${relativePath}`, () => {
+      const content = fs.readFileSync(filePath, 'utf-8');
+      const spaceBeforeColon = / : /.test(content);
+      expect(spaceBeforeColon).toBe(false);
+    });
+
+    it(`should not contain double hyphen in ${relativePath}`, () => {
+      const content = fs.readFileSync(filePath, 'utf-8');
+      const sanitized = content
+        .replace(/-----(BEGIN|END) [A-Z ]+-----/g, '')
+        .replace(/--step-\w+/g, '');
+      expect(sanitized).not.toContain('--');
+    });
+  });
+});

package/src/tests/script_density.test.ts

@@ -0,0 +1,94 @@
+import { describe, expect, it } from 'vitest';
+import { ALL_TOOLS } from '../tools';
+
+type ScriptLocale = keyof typeof SCRIPT_RULES;
+
+const SCRIPT_RULES = {
+  ja: {
+    language: 'Japanese',
+    scriptName: 'kana/kanji',
+    scriptCharacters: /[\p{Script=Hiragana}\p{Script=Katakana}\p{Script=Han}]/gu,
+    minScriptRatio: 0.45,
+  },
+  ko: {
+    language: 'Korean',
+    scriptName: 'hangul',
+    scriptCharacters: /\p{Script=Hangul}/gu,
+    minScriptRatio: 0.55,
+  },
+  ru: {
+    language: 'Russian',
+    scriptName: 'cyrillic',
+    scriptCharacters: /\p{Script=Cyrillic}/gu,
+    minScriptRatio: 0.65,
+  },
+  zh: {
+    language: 'Chinese',
+    scriptName: 'han',
+    scriptCharacters: /\p{Script=Han}/gu,
+    minScriptRatio: 0.45,
+  },
+} as const;
+
+const LETTERS = /\p{L}/gu;
+const TRANSLATABLE_KEYS = ['title', 'description', 'ui', 'seo', 'faq', 'howTo'] as const;
+
+function collectStrings(value: unknown): string[] {
+  if (typeof value === 'string') return [value];
+  if (!value || typeof value !== 'object') return [];
+  if (Array.isArray(value)) return value.flatMap(collectStrings);
+  return Object.values(value).flatMap(collectStrings);
+}
+
+function normalizeText(value: unknown): string {
+  return collectStrings(value).join(' ').normalize('NFC');
+}
+
+function translatableContent(content: Record<string, unknown>) {
+  return TRANSLATABLE_KEYS.map((key) => content[key]);
+}
+
+function letterCount(text: string): number {
+  return text.match(LETTERS)?.length ?? 0;
+}
+
+function scriptCount(text: string, locale: ScriptLocale): number {
+  return text.match(SCRIPT_RULES[locale].scriptCharacters)?.length ?? 0;
+}
+
+function scriptRatio(text: string, locale: ScriptLocale): number {
+  const letters = letterCount(text);
+  if (letters === 0) return 0;
+  return scriptCount(text, locale) / letters;
+}
+
+describe('Native script density validation', () => {
+  ALL_TOOLS.forEach((tool) => {
+    describe(`Tool: ${tool.entry.id}`, () => {
+      Object.keys(SCRIPT_RULES).forEach((locale) => {
+        it(`${locale} keeps most translated text in its native script`, async () => {
+          const typedLocale = locale as ScriptLocale;
+          const loader = tool.entry.i18n[typedLocale];
+          if (!loader) return;
+
+          const content = await loader();
+          const rule = SCRIPT_RULES[typedLocale];
+          const text = normalizeText(translatableContent(content as Record<string, unknown>));
+          const letters = letterCount(text);
+          const matches = scriptCount(text, typedLocale);
+          const ratio = scriptRatio(text, typedLocale);
+
+          expect(
+            ratio,
+            [
+              `Possible broken translation detected in ${tool.entry.id}/${typedLocale} (${rule.language}).`,
+              `The text has ${matches} ${rule.scriptName} characters out of ${letters} analyzed letters (${(ratio * 100).toFixed(1)}%).`,
+              `Most translatable content should be written in ${rule.scriptName} script.`,
+              'Non-translatable fields such as slug, bibliography, and schemas are ignored to avoid false positives.',
+            ].join(' '),
+          ).toBeGreaterThanOrEqual(rule.minScriptRatio);
+        });
+      });
+    });
+  });
+});

package/src/tests/shared-test-helpers.ts

@@ -0,0 +1,56 @@
+import type { ToolDefinition } from '../types';
+
+export interface ToolExportValidationResult {
+  passed: boolean;
+  failures: string[];
+}
+
+function validateComponentType(
+  toolId: string,
+  componentName: string,
+  component: unknown,
+  failures: string[],
+): void {
+  if (typeof component !== 'function') {
+    failures.push(`${toolId}: ${componentName} is not a function (${typeof component})`);
+  }
+}
+
+async function validateComponentExecution(
+  toolId: string,
+  componentName: string,
+  fn: () => Promise<unknown>,
+  failures: string[],
+): Promise<void> {
+  try {
+    const result = await fn();
+    if (!result || typeof result !== 'object') {
+      failures.push(`${toolId}: ${componentName} import returned invalid result`);
+    }
+  } catch (error) {
+    failures.push(`${toolId}: ${componentName} execution error - ${error instanceof Error ? error.message : 'unknown'}`);
+  }
+}
+
+export async function validateToolExports(tools: ToolDefinition[]): Promise<ToolExportValidationResult> {
+  const failures: string[] = [];
+
+  for (const tool of tools) {
+    validateComponentType(tool.entry.id, 'Component', tool.Component, failures);
+    validateComponentType(tool.entry.id, 'SEOComponent', tool.SEOComponent, failures);
+    validateComponentType(tool.entry.id, 'BibliographyComponent', tool.BibliographyComponent, failures);
+
+    const componentFn = tool.Component as () => Promise<unknown>;
+    const seoFn = tool.SEOComponent as () => Promise<unknown>;
+    const bibFn = tool.BibliographyComponent as () => Promise<unknown>;
+
+    await validateComponentExecution(tool.entry.id, 'Component', componentFn, failures);
+    await validateComponentExecution(tool.entry.id, 'SEOComponent', seoFn, failures);
+    await validateComponentExecution(tool.entry.id, 'BibliographyComponent', bibFn, failures);
+  }
+
+  return {
+    passed: failures.length === 0,
+    failures,
+  };
+}

package/src/tests/tool_exports.test.ts

@@ -0,0 +1,34 @@
+import { describe, it, expect } from 'vitest';
+import { ALL_TOOLS } from '../tools';
+import { validateToolExports } from './shared-test-helpers';
+
+describe('Tool Exports Pattern Validation', () => {
+  describe('Component Exports Format', () => {
+    ALL_TOOLS.forEach((tool) => {
+      it(`${tool.entry.id}: Component should be a lazy-loaded function`, () => {
+        expect(typeof tool.Component).toBe('function');
+        expect(tool.Component).toBeInstanceOf(Function);
+      });
+
+      it(`${tool.entry.id}: SEOComponent should be a lazy-loaded function`, () => {
+        expect(typeof tool.SEOComponent).toBe('function');
+        expect(tool.SEOComponent).toBeInstanceOf(Function);
+      });
+
+      it(`${tool.entry.id}: BibliographyComponent should be a lazy-loaded function`, () => {
+        expect(typeof tool.BibliographyComponent).toBe('function');
+        expect(tool.BibliographyComponent).toBeInstanceOf(Function);
+      });
+    });
+  });
+
+  describe('Dynamic Import Validation', () => {
+    it('all tools must have functional dynamic imports', async () => {
+      const result = await validateToolExports(ALL_TOOLS);
+      if (!result.passed) {
+        throw new Error(`Tool export validation failed:\n${result.failures.join('\n')}`);
+      }
+      expect(result.passed).toBe(true);
+    });
+  });
+});

package/src/tool/aspectRatio/aspect-ratio-calculator.css

@@ -16,7 +16,7 @@
     color: var(--arc-text);
   }
 
-  :global(.theme-dark) .arc-container {
+  .theme-dark .arc-container {
     --arc-bg: #0f172a;
     --arc-card-bg: #1e293b;
     --arc-text: #f8fafc;

package/src/tool/aspectRatio/i18n/de.ts

@@ -137,7 +137,7 @@ export const content: ToolLocaleContent<AspectRatioUI> = {
     },
     {
       type: 'paragraph',
-      html: 'Falsch gehandhabte Seitenverhältnisse sind eine häufige Ursache für gestauchte Fotos, Videos mit unerwartetem Beschnitt (Letterboxing) oder Webkomponenten, deren Layout beim Betrachten auf unterschiedlichen Geräten – vom Smartphone bis hin zu Ultra-Wide-Monitoren – fehlerhaft dargestellt wird.',
+      html: 'Falsch gehandhabte Seitenverhältnisse sind eine häufige Ursache für gestauchte Fotos, Videos mit unerwartetem Beschnitt (Letterboxing) oder Webkomponenten, deren Layout beim Betrachten auf unterschiedlichen Geräten - vom Smartphone bis hin zu Ultra-Wide-Monitoren - fehlerhaft dargestellt wird.',
     },
     {
       type: 'title',

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

@@ -21,7 +21,7 @@ const faqData = [
   {
     question: "Comment calculer la hauteur à partir de la largeur avec un ratio donné ?",
     answer:
-      "La formule est : Hauteur = Largeur × (Ratio Hauteur / Ratio Largeur). Par exemple, pour une largeur de 1280px avec un ratio 16:9, la hauteur serait : 1280 × (9/16) = 720px.",
+      "La formule est: Hauteur = Largeur × (Ratio Hauteur / Ratio Largeur). Par exemple, pour une largeur de 1280px avec un ratio 16:9, la hauteur serait: 1280 × (9/16) = 720px.",
   },
   {
     question: "Quel est le Ratio de Format standard pour les vidéos YouTube ?",

package/src/tool/aspectRatio/i18n/pl.ts

@@ -42,7 +42,7 @@ const howToData = [
   },
   {
     name: 'Dostosuj skalę',
-    text: 'Zmień wartość szerokości lub wysokości w sekcji „Rzeczywista skala”. Narzędzie automatycznie obliczy drugą wartość, aby zachować proporcje.',
+    text: 'Zmień wartość szerokości lub wysokości w sekcji "Rzeczywista skala". Narzędzie automatycznie obliczy drugą wartość, aby zachować proporcje.',
   },
   {
     name: 'Sprawdź podgląd',
@@ -137,7 +137,7 @@ export const content: ToolLocaleContent<AspectRatioUI> = {
     },
     {
       type: 'paragraph',
-      html: 'Błędne zarządzanie proporcjami jest częstą przyczyną spłaszczonych zdjęć, filmów z nieoczekiwanym przycięciem (letterboxing) lub komponentów stron internetowych, które tracą swój układ przy przeglądaniu na różnych urządzeniach – od telefonów po monitory panoramiczne.',
+      html: 'Błędne zarządzanie proporcjami jest częstą przyczyną spłaszczonych zdjęć, filmów z nieoczekiwanym przycięciem (letterboxing) lub komponentów stron internetowych, które tracą swój układ przy przeglądaniu na różnych urządzeniach - od telefonów po monitory panoramiczne.',
     },
     {
       type: 'title',