@jjlmoya/utils-alcohol 1.12.0 → 1.14.0

package/package.json

@@ -1,60 +1,60 @@
 {
-  "name": "@jjlmoya/utils-alcohol",
-  "version": "1.12.0",
-  "type": "module",
-  "main": "./src/index.ts",
-  "types": "./src/index.ts",
-  "exports": {
-    ".": "./src/index.ts",
-    "./data": "./src/data.ts"
-  },
-  "files": [
-    "src"
-  ],
-  "publishConfig": {
-    "access": "public"
-  },
-  "scripts": {
-    "dev": "astro dev",
-    "start": "astro dev",
-    "build": "astro build",
-    "preview": "astro preview",
-    "astro": "astro",
-    "lint": "eslint src/ --max-warnings 0 && stylelint \"src/**/*.{css,astro}\"",
-    "check": "astro check",
-    "type-check": "astro check",
-    "test": "vitest run",
-    "preversion": "npm run lint && npm run test",
-    "postversion": "git push && git push --tags",
-    "patch": "npm version patch",
-    "minor": "npm version minor",
-    "major": "npm version major"
-  },
-  "lint-staged": {
-    "*.{ts,tsx,astro}": [
-      "eslint --fix"
-    ]
-  },
-  "dependencies": {
-    "@iconify-json/mdi": "^1.2.3",
-    "@jjlmoya/utils-shared": "^1.1.0",
-    "astro": "^6.1.2",
-    "astro-icon": "^1.1.0"
-  },
-  "devDependencies": {
-    "@astrojs/check": "^0.9.8",
-    "eslint": "^9.39.4",
-    "eslint-plugin-astro": "^1.6.0",
-    "eslint-plugin-no-comments": "^1.1.10",
-    "husky": "^9.1.7",
-    "lint-staged": "^16.4.0",
-    "postcss-html": "^1.8.1",
-    "schema-dts": "^1.1.2",
-    "stylelint": "^17.6.0",
-    "stylelint-config-standard": "^40.0.0",
-    "stylelint-declaration-strict-value": "^1.11.1",
-    "typescript": "^5.4.0",
-    "typescript-eslint": "^8.58.0",
-    "vitest": "^4.1.2"
-  }
+    "name": "@jjlmoya/utils-alcohol",
+    "version": "1.14.0",
+    "type": "module",
+    "main": "./src/index.ts",
+    "types": "./src/index.ts",
+    "exports": {
+        ".": "./src/index.ts",
+        "./data": "./src/data.ts"
+    },
+    "files": [
+        "src"
+    ],
+    "publishConfig": {
+        "access": "public"
+    },
+    "scripts": {
+        "dev": "astro dev",
+        "start": "astro dev",
+        "build": "astro build",
+        "preview": "astro preview",
+        "astro": "astro",
+        "lint": "eslint src/ --max-warnings 0 && stylelint \"src/**/*.{css,astro}\"",
+        "check": "astro check",
+        "type-check": "astro check",
+        "test": "vitest run",
+        "preversion": "npm run lint && npm run test",
+        "postversion": "git push && git push --tags",
+        "patch": "npm version patch",
+        "minor": "npm version minor",
+        "major": "npm version major"
+    },
+    "lint-staged": {
+        "*.{ts,tsx,astro}": [
+            "eslint --fix"
+        ]
+    },
+    "dependencies": {
+        "@iconify-json/mdi": "^1.2.3",
+        "@jjlmoya/utils-shared": "1.2.0",
+        "astro": "^6.1.2",
+        "astro-icon": "^1.1.0"
+    },
+    "devDependencies": {
+        "@astrojs/check": "^0.9.8",
+        "eslint": "^9.39.4",
+        "eslint-plugin-astro": "^1.6.0",
+        "eslint-plugin-no-comments": "^1.1.10",
+        "husky": "^9.1.7",
+        "lint-staged": "^16.4.0",
+        "postcss-html": "^1.8.1",
+        "schema-dts": "^1.1.2",
+        "stylelint": "^17.6.0",
+        "stylelint-config-standard": "^40.0.0",
+        "stylelint-declaration-strict-value": "^1.11.1",
+        "typescript": "^5.4.0",
+        "typescript-eslint": "^8.58.0",
+        "vitest": "^4.1.2"
+    }
 }

package/src/tests/schemas_fulfillment.test.ts

@@ -0,0 +1,23 @@
+import { describe, it, expect } from 'vitest';
+import { ALL_TOOLS } from '../tools';
+import type { ToolLocaleContent } from '../types';
+
+describe('Schemas Fulfillment Validation', () => {
+  ALL_TOOLS.forEach((tool) => {
+    describe(`Tool: ${tool.entry.id}`, () => {
+      Object.keys(tool.entry.i18n).forEach((locale) => {
+        it(`Locale: ${locale} should have faqSchema, appSchema and howToSchema`, async () => {
+          const loader = tool.entry.i18n[locale as keyof typeof tool.entry.i18n];
+          if (!loader) return;
+          const content = (await loader()) as ToolLocaleContent;
+
+          const schemaTypes = content.schemas.map((s: any) => s['@type']);
+
+          expect(schemaTypes, `Tool "${tool.entry.id}" locale "${locale}" is missing FAQPage schema`).toContain('FAQPage');
+          expect(schemaTypes, `Tool "${tool.entry.id}" locale "${locale}" is missing SoftwareApplication schema`).toContain('SoftwareApplication');
+          expect(schemaTypes, `Tool "${tool.entry.id}" locale "${locale}" is missing HowTo schema`).toContain('HowTo');
+        });
+      });
+    });
+  });
+});

package/src/tests/title_quality.test.ts

@@ -0,0 +1,55 @@
+import { describe, it } from 'vitest';
+import fs from 'node:fs';
+import path from 'node:path';
+
+function getFiles(dir: string, ext: 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()) {
+      results.push(...getFiles(fullPath, ext));
+    } else if (ext.some((e) => file.endsWith(e))) {
+      results.push(fullPath);
+    }
+  }
+  return results;
+}
+
+const SRC_DIR = path.join(process.cwd(), 'src');
+
+describe('Project Titles - Separator Validation', () => {
+  const files = [
+    ...getFiles(path.join(SRC_DIR, 'tool'), ['.ts']),
+    ...getFiles(path.join(SRC_DIR, 'category'), ['.ts']),
+  ].filter(f => f.includes('i18n'));
+
+  it.each(files)('Verify that titles in %s do not contain | or -', (filePath) => {
+    const content = fs.readFileSync(filePath, 'utf-8');
+    const relativePath = path.relative(process.cwd(), filePath);
+
+    const titlePatterns = [
+      /const\s+title\s*=\s*['"]([^'"]+)['"]/g,
+      /title\s*:\s*['"]([^'"]+)['"]/g,
+    ];
+
+    const findings: string[] = [];
+
+    for (const pattern of titlePatterns) {
+      let match;
+      while ((match = pattern.exec(content)) !== null) {
+        const title = match[1];
+        if (title.includes('|') || title.includes('-')) {
+          findings.push(title);
+        }
+      }
+    }
+
+    if (findings.length > 0) {
+      const list = findings.map((f) => `  - "${f}"`).join('\n');
+      throw new Error(`Forbidden separators (| or -) found in titles in ${relativePath}:\n${list}`);
+    }
+  });
+});

package/src/tool/alcoholClearance/component.astro

@@ -438,6 +438,68 @@ const { ui } = Astro.props;
         border-radius: 10px;
     }
 
+    :global(.drink-list-row) {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        padding: 0.75rem;
+        background: #f8fafc;
+        border-radius: 0.75rem;
+        border: 1px solid #e2e8f0;
+    }
+    :global(.theme-dark) :global(.drink-list-row) {
+        background: #1e293b;
+        border-color: #334155;
+    }
+
+    :global(.drink-row-info) {
+        display: flex;
+        align-items: center;
+        gap: 0.75rem;
+    }
+
+    :global(.drink-row-name) {
+        font-weight: 700;
+        color: #334155;
+    }
+    :global(.theme-dark) :global(.drink-row-name) {
+        color: #e2e8f0;
+    }
+
+    :global(.drink-row-qty) {
+        font-size: 0.75rem;
+        background: #e0e7ff;
+        color: #4f46e5;
+        padding: 0.125rem 0.5rem;
+        border-radius: 0.25rem;
+        font-weight: 700;
+    }
+    :global(.theme-dark) :global(.drink-row-qty) {
+        background: #312e81;
+        color: #a5b4fc;
+    }
+
+    :global(.drink-row-del) {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 2rem;
+        height: 2rem;
+        padding: 0;
+        background: none;
+        border: none;
+        color: #ef4444;
+        cursor: pointer;
+        transition: background 0.2s;
+    }
+    :global(.drink-row-del:hover) {
+        background: #fef2f2;
+        border-radius: 0.5rem;
+    }
+    :global(.theme-dark) :global(.drink-row-del:hover) {
+        background: rgba(239,68,68,0.1);
+    }
+
     .alc-results-panel {
         display: flex;
         flex-direction: column;

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

@@ -1,4 +1,4 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { AlcoholClearanceUI, AlcoholClearanceLocaleContent } from '../index';
 
 const slug = 'alcohol-clearance-calculator';
@@ -158,6 +158,27 @@ const seo: AlcoholClearanceLocaleContent['seo'] = [
 ];
 
 const schemas: AlcoholClearanceLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',

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

@@ -1,4 +1,4 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { AlcoholClearanceUI, AlcoholClearanceLocaleContent } from '../index';
 
 const slug = 'calculadora-alcohol-resaca';
@@ -167,6 +167,27 @@ const seo: AlcoholClearanceLocaleContent['seo'] = [
 ];
 
 const schemas: AlcoholClearanceLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',

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

@@ -1,4 +1,4 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { AlcoholClearanceUI, AlcoholClearanceLocaleContent } from '../index';
 
 const slug = 'calculateur-elimination-alcohol';
@@ -149,6 +149,27 @@ const seo: AlcoholClearanceLocaleContent['seo'] = [
 ];
 
 const schemas: AlcoholClearanceLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',

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

@@ -1,4 +1,4 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { BeerCoolerUI, BeerCoolerLocaleContent } from '../index';
 
 const slug = 'beer-cooler';
@@ -135,7 +135,7 @@ const seo: BeerCoolerLocaleContent['seo'] = [
   },
   {
     type: 'tip',
-    title: 'Pro Tip: Pre-chill the Glass',
+    title: 'Pro Tip: Prechill the Glass',
     html: 'The glass you serve beer into has a significant thermal mass. A warm glass can raise the temperature of a perfectly cold beer by 2-3°C instantly on contact. Place your serving glass in the freezer for 5 minutes before pouring, or rinse it with cold water. This simple step extends the window where your beer tastes exactly as intended.'
   },
   {
@@ -150,11 +150,32 @@ const seo: BeerCoolerLocaleContent['seo'] = [
 ];
 
 const schemas: BeerCoolerLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',
-    name: "Beer Cooling Calculator – Newton's Law of Cooling",
-    description: 'Applied thermodynamics tool that uses Newton\'s Law of Cooling to calculate the exact time for your beer to reach the ideal serving temperature in a fridge or freezer.',
+    name: title,
+    description: description,
     applicationCategory: 'UtilityApplication',
     operatingSystem: 'Web',
     offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },

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

@@ -1,4 +1,4 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { BeerCoolerUI, BeerCoolerLocaleContent } from '../index';
 
 const slug = 'calculadora-enfriamiento-cerveza';
@@ -135,7 +135,7 @@ const seo: BeerCoolerLocaleContent['seo'] = [
   },
   {
     type: 'tip',
-    title: 'Consejo Pro: Pre-enfría el Vaso',
+    title: 'Consejo Pro: Preenfría el Vaso',
     html: 'El vaso en el que sirves la cerveza tiene una masa térmica significativa. Un vaso caliente puede subir la temperatura de una cerveza perfectamente fría en 2-3°C al instante. Mete el vaso de servicio en el congelador 5 minutos antes de servir, o enjuágalo con agua fría. Este simple paso prolonga la ventana en que tu cerveza sabe exactamente como debe.'
   },
   {
@@ -163,11 +163,32 @@ const seo: BeerCoolerLocaleContent['seo'] = [
 ];
 
 const schemas: BeerCoolerLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',
-    name: 'Calculadora de Enfriamiento de Cerveza – Ley de Newton',
-    description: 'Herramienta de termodinámica aplicada que calcula con la Ley de Enfriamiento de Newton el tiempo exacto para que tu cerveza alcance la temperatura de servicio ideal en nevera o congelador.',
+    name: title,
+    description: description,
     applicationCategory: 'UtilityApplication',
     operatingSystem: 'Web',
     offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },

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

@@ -1,4 +1,4 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { BeerCoolerUI, BeerCoolerLocaleContent } from '../index';
 
 const slug = 'refroidisseur-biere';
@@ -135,7 +135,7 @@ const seo: BeerCoolerLocaleContent['seo'] = [
   },
   {
     type: 'tip',
-    title: 'Conseil Pro : Pré-refroidir le Verre',
+    title: 'Conseil Pro : Prérefroidir le Verre',
     html: 'Le verre dans lequel vous servez la bière possède une masse thermique significative. Un verre chaud peut augmenter la température d\'une bière parfaitement froide de 2 à 3°C instantanément au contact. Placez votre verre de service au congélateur 5 minutes avant de verser, ou rincez-le à l\'eau froide. Cette simple étape prolonge la fenêtre où votre bière a exactement le goût voulu.'
   },
   {
@@ -150,11 +150,32 @@ const seo: BeerCoolerLocaleContent['seo'] = [
 ];
 
 const schemas: BeerCoolerLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',
-    name: 'Calculateur de Refroidissement de Bière – Loi du Refroidissement de Newton',
-    description: 'Outil de thermodynamique appliquée qui utilise la Loi du Refroidissement de Newton pour calculer le temps exact nécessaire à votre bière pour atteindre la température de service idéale au frigo ou au congélateur.',
+    name: title,
+    description: description,
     applicationCategory: 'UtilityApplication',
     operatingSystem: 'Web',
     offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },

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

@@ -1,4 +1,4 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { CarbonationUI, CarbonationLocaleContent } from '../index';
 
 const slug = 'beer-carbonation-calculator';
@@ -153,6 +153,27 @@ const seo: CarbonationLocaleContent['seo'] = [
 ];
 
 const schemas: CarbonationLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',

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

@@ -1,4 +1,4 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { CarbonationUI, CarbonationLocaleContent } from '../index';
 
 const slug = 'calculadora-carbonatacion';
@@ -157,6 +157,27 @@ const seo: CarbonationLocaleContent['seo'] = [
 ];
 
 const schemas: CarbonationLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',

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

@@ -1,4 +1,4 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { CarbonationUI, CarbonationLocaleContent } from '../index';
 
 const slug = 'calculateur-carbonatation-biere';
@@ -153,6 +153,27 @@ const seo: CarbonationLocaleContent['seo'] = [
 ];
 
 const schemas: CarbonationLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',

package/src/tool/cocktailBalancer/component.astro

@@ -1488,7 +1488,7 @@ function getIngIconName(type: string): string {
     padding: 0.75rem;
 }
 
-.recipe-row {
+:global(.recipe-row) {
     background: #fff;
     border-radius: 1rem;
     padding: 1rem;
@@ -1496,34 +1496,34 @@ function getIngIconName(type: string): string {
     border: 1px solid #f1f5f9;
 }
 
-:global(.theme-dark) .recipe-row {
+:global(.theme-dark .recipe-row) {
     background: #0f172a;
     border-color: #1e293b;
 }
 
-.recipe-row-top {
+:global(.recipe-row-top) {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 0.75rem;
 }
 
-.recipe-row-info {
+:global(.recipe-row-info) {
     display: flex;
     align-items: center;
     gap: 0.75rem;
 }
 
-.recipe-row-name {
+:global(.recipe-row-name) {
     font-weight: 700;
     color: #334155;
 }
 
-:global(.theme-dark) .recipe-row-name {
+:global(.theme-dark .recipe-row-name) {
     color: #e2e8f0;
 }
 
-.recipe-row-type {
+:global(.recipe-row-type) {
     font-size: 0.625rem;
     background: #f1f5f9;
     padding: 0.125rem 0.5rem;
@@ -1533,26 +1533,26 @@ function getIngIconName(type: string): string {
     text-transform: uppercase;
 }
 
-:global(.theme-dark) .recipe-row-type {
+:global(.theme-dark .recipe-row-type) {
     background: #1e293b;
 }
 
-.recipe-row-del {
+:global(.recipe-row-del) {
     opacity: 0;
     transition: opacity 0.2s;
 }
 
-.recipe-row:hover .recipe-row-del {
+:global(.recipe-row:hover .recipe-row-del) {
     opacity: 1;
 }
 
-.recipe-row-controls {
+:global(.recipe-row-controls) {
     display: flex;
     align-items: center;
     gap: 1rem;
 }
 
-.recipe-range {
+:global(.recipe-range) {
     flex: 1;
     height: 0.5rem;
     border-radius: 0.5rem;
@@ -1562,16 +1562,16 @@ function getIngIconName(type: string): string {
     background: #e2e8f0;
 }
 
-:global(.theme-dark) .recipe-range {
+:global(.theme-dark .recipe-range) {
     background: #334155;
 }
 
-.recipe-number-wrap {
+:global(.recipe-number-wrap) {
     position: relative;
     width: 5rem;
 }
 
-.recipe-number {
+:global(.recipe-number) {
     width: 100%;
     background: #f8fafc;
     border: 1px solid #e2e8f0;
@@ -1584,7 +1584,7 @@ function getIngIconName(type: string): string {
     box-sizing: border-box;
 }
 
-:global(.theme-dark) .recipe-number {
+:global(.theme-dark .recipe-number) {
     background: #1e293b;
     border-color: #334155;
     color: #e2e8f0;

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

@@ -1,8 +1,8 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { CocktailBalancerUI, CocktailBalancerLocaleContent } from '../index';
 
 const slug = 'cocktail-balancer';
-const title = 'Cocktail Balancer - The Sour Law';
+const title = 'Cocktail Balancer: The Sour Law';
 const description = 'Calculate the perfect balance between sweet and sour for your cocktails. Master the golden ratio of mixology.';
 
 const ui: CocktailBalancerUI = {
@@ -175,6 +175,27 @@ const seo: CocktailBalancerLocaleContent['seo'] = [
 ];
 
 const schemas: CocktailBalancerLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',

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

@@ -1,8 +1,8 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { CocktailBalancerUI, CocktailBalancerLocaleContent } from '../index';
 
 const slug = 'equilibrador-cocteles';
-const title = 'Equilibrador de Cócteles - La Ley del Sour';
+const title = 'Equilibrador de Cócteles: La Ley del Sour';
 const description = 'Calcula el equilibrio perfecto entre dulce y ácido para tus cócteles. Domina la proporción áurea de la mixología.';
 
 const ui: CocktailBalancerUI = {
@@ -175,6 +175,27 @@ const seo: CocktailBalancerLocaleContent['seo'] = [
 ];
 
 const schemas: CocktailBalancerLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',

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

@@ -1,8 +1,8 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { CocktailBalancerUI, CocktailBalancerLocaleContent } from '../index';
 
 const slug = 'equilibre-cocktail';
-const title = 'Équilibreur de Cocktails - La Loi du Sour';
+const title = 'Équilibreur de Cocktails: La Loi du Sour';
 const description = 'Calculez l\'équilibre parfait entre le sucré et l\'acide pour vos cocktails. Maîtrisez le nombre d\'or de la mixologie.';
 
 const ui: CocktailBalancerUI = {
@@ -175,6 +175,27 @@ const seo: CocktailBalancerLocaleContent['seo'] = [
 ];
 
 const schemas: CocktailBalancerLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',

package/src/tool/partyKeg/component.astro

@@ -825,7 +825,7 @@ const { ui } = Astro.props;
     animation: drop-in 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
 }
 
-.visual-container {
+:global(.visual-container) {
     display: flex;
     align-items: flex-end;
     justify-content: center;
@@ -835,12 +835,12 @@ const { ui } = Astro.props;
 }
 
 @media (min-width: 1024px) {
-    .visual-container {
+    :global(.visual-container) {
         gap: 4rem;
     }
 }
 
-.keg-stack {
+:global(.keg-stack) {
     display: flex;
     flex-direction: column-reverse;
     align-items: center;
@@ -850,18 +850,18 @@ const { ui } = Astro.props;
     min-width: 80px;
 }
 
-.keg-item {
+:global(.keg-item) {
     position: relative;
     transition: transform 0.3s;
     transform-origin: bottom;
     cursor: default;
 }
 
-.keg-item:hover {
+:global(.keg-item:hover) {
     transform: scale(1.05);
 }
 
-.keg-plus {
+:global(.keg-plus) {
     text-align: center;
     font-weight: 900;
     font-size: 1.25rem;
@@ -891,7 +891,7 @@ const { ui } = Astro.props;
     }
 }
 
-.ice-pile {
+:global(.ice-pile) {
     display: flex;
     flex-wrap: wrap;
     align-content: flex-end;
@@ -902,17 +902,17 @@ const { ui } = Astro.props;
     position: relative;
 }
 
-.ice-bag {
+:global(.ice-bag) {
     transition: transform 0.3s;
     cursor: pointer;
 }
 
-.ice-bag:hover {
+:global(.ice-bag:hover) {
     transform: scale(1.1);
     z-index: 50;
 }
 
-.bags-plus {
+:global(.bags-plus) {
     position: absolute;
     top: -3rem;
     left: 50%;

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

@@ -1,4 +1,4 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { PartyKegUI, PartyKegLocaleContent } from '../index';
 
 const slug = 'party-stock-calculator';
@@ -140,6 +140,27 @@ const seo: PartyKegLocaleContent['seo'] = [
 ];
 
 const schemas: PartyKegLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',

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

@@ -1,4 +1,4 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { PartyKegUI, PartyKegLocaleContent } from '../index';
 
 const slug = 'calculadora-barriles-fiesta';
@@ -144,6 +144,27 @@ const seo: PartyKegLocaleContent['seo'] = [
 ];
 
 const schemas: PartyKegLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',

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

@@ -1,7 +1,7 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { WithContext, SoftwareApplication, FAQPage, HowTo } from 'schema-dts';
 import type { PartyKegUI, PartyKegLocaleContent } from '../index';
 
-const slug = 'calculateur-fete-fût';
+const slug = 'calculateur-fete-fut';
 const title = 'Calculateur de Bière pour Fêtes : Quantité par Personne, Mariage ou Anniversaire';
 const description = 'Outil gratuit pour calculer la quantité de bière et de glace selon les invités, la durée et la température. Idéal pour les mariages, anniversaires et événements en plein air.';
 
@@ -140,6 +140,27 @@ const seo: PartyKegLocaleContent['seo'] = [
 ];
 
 const schemas: PartyKegLocaleContent['schemas'] = [
+  {
+    '@context': 'https://schema.org',
+    '@type': 'FAQPage',
+    mainEntity: faq.map((item) => ({
+      '@type': 'Question',
+      name: item.question,
+      acceptedAnswer: { '@type': 'Answer', text: item.answer },
+    })),
+  } as WithContext<FAQPage>,
+  {
+    '@context': 'https://schema.org',
+    '@type': 'HowTo',
+    name: title,
+    description: description,
+    step: howTo.map((step, i) => ({
+      '@type': 'HowToStep',
+      position: i + 1,
+      name: step.name,
+      text: step.text,
+    })),
+  } as WithContext<HowTo>,
   {
     '@context': 'https://schema.org',
     '@type': 'SoftwareApplication',