@jjlmoya/utils-pets 1.9.0 → 1.11.0

package/src/tool/petRation/component.astro

@@ -179,432 +179,3 @@ const { ui } = Astro.props;
   document.addEventListener("astro:page-load", initPetRation);
 </script>
 
-<style>
-.pet-ration-calculator-final {
-    position: relative;
-    max-width: 650px;
-    margin: 2rem auto;
-    background: var(--color-surface, #fff);
-    border-radius: 2rem;
-    padding: 2.5rem;
-    box-shadow: 0 20px 50px -15px rgba(0, 0, 0, 0.08);
-    color: var(--color-text, #334155);
-    border: 1px solid var(--color-border, #f1f5f9);
-    min-height: 400px;
-}
-
-.calc-loader {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background: var(--color-surface, #fff);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 2rem;
-    z-index: 50;
-    transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.4s;
-}
-
-:global(.theme-dark) .pet-ration-calculator-final {
-    background: var(--color-surface-dark, #1e293b);
-    color: var(--color-text-dark, #e2e8f0);
-    border-color: var(--color-border-dark, #334155);
-    box-shadow: 0 20px 50px -15px rgba(0, 0, 0, 0.3);
-}
-
-:global(.theme-dark) .calc-loader {
-    background: var(--color-surface-dark, #1e293b);
-}
-
-.calc-loader.hidden {
-    opacity: 0;
-    visibility: hidden;
-    pointer-events: none;
-}
-
-.loader-spinner {
-    width: 3rem;
-    height: 3rem;
-    color: var(--color-accent, #f59e0b);
-    animation: spin-pulse 2s infinite linear;
-}
-
-@keyframes spin-pulse {
-    from { transform: rotate(0deg); }
-    to { transform: rotate(360deg); }
-}
-
-.calc-container {
-    display: flex;
-    flex-direction: column;
-    gap: 3rem;
-    animation: fade-in-up 0.6s cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-@keyframes fade-in-up {
-    from {
-        opacity: 0;
-        transform: translateY(10px);
-    }
-    to {
-        opacity: 1;
-        transform: translateY(0);
-    }
-}
-
-.section-title {
-    font-size: 1.1rem;
-    font-weight: 950;
-    color: var(--color-heading, #0f172a);
-    margin-bottom: 2rem;
-    display: flex;
-    align-items: center;
-    gap: 0.75rem;
-    text-transform: uppercase;
-    letter-spacing: 0.05em;
-}
-
-:global(.theme-dark) .section-title {
-    color: var(--color-heading-dark, #f8fafc);
-}
-
-.calc-section {
-    border-bottom: 1px dashed var(--color-border-dashed, #e2e8f0);
-    padding-bottom: 2rem;
-}
-
-.calc-section:last-of-type {
-    border-bottom: none;
-}
-
-:global(.theme-dark) .calc-section {
-    border-bottom-color: var(--color-border-dark, #334155);
-}
-
-.input-item {
-    margin-bottom: 2rem;
-}
-
-.item-label {
-    display: block;
-    font-size: 0.75rem;
-    font-weight: 800;
-    text-transform: uppercase;
-    color: var(--color-label, #94a3b8);
-    margin-bottom: 1rem;
-    letter-spacing: 0.1em;
-}
-
-.species-selector-v2 {
-    display: flex;
-    gap: 1rem;
-}
-
-.species-selector-v2 input {
-    display: none;
-}
-
-.btn-species {
-    flex: 1;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    gap: 0.5rem;
-    padding: 1.25rem 0.75rem;
-    background: var(--color-btn-bg, #f8fafc);
-    border: 2px solid var(--color-btn-border, #e2e8f0);
-    border-radius: 1rem;
-    cursor: pointer;
-    font-weight: 800;
-    font-size: 1rem;
-    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-:global(.theme-dark) .btn-species {
-    background: var(--color-btn-bg-dark, #0f172a);
-    border-color: var(--color-btn-border-dark, #334155);
-}
-
-.icon-v2 {
-    width: 1.5rem;
-    height: 1.5rem;
-}
-
-.species-selector-v2 input:checked + .btn-species {
-    background: var(--color-surface, #fff);
-    border-color: var(--color-accent, #f59e0b);
-    color: var(--color-accent, #f59e0b);
-    box-shadow: 0 4px 15px rgba(245, 158, 11, 0.15);
-    transform: translateY(-2px);
-}
-
-:global(.theme-dark) .species-selector-v2 input:checked + .btn-species {
-    background: var(--color-surface-elevated-dark, #1e293b);
-}
-
-.segmented-v2 {
-    display: flex;
-    background: var(--color-btn-bg, #f8fafc);
-    padding: 6px;
-    border-radius: 1rem;
-    border: 1px solid var(--color-btn-border, #e2e8f0);
-}
-
-:global(.theme-dark) .segmented-v2 {
-    background: var(--color-btn-bg-dark, #0f172a);
-    border-color: var(--color-btn-border-dark, #334155);
-}
-
-.segmented-v2 input {
-    display: none;
-}
-
-.segmented-v2 label {
-    flex: 1;
-    text-align: center;
-    padding: 0.85rem;
-    border-radius: 0.75rem;
-    cursor: pointer;
-    font-weight: 700;
-    font-size: 0.85rem;
-    transition: all 0.2s;
-    color: var(--color-muted, #64748b);
-}
-
-.segmented-v2 input:checked + label {
-    background: var(--color-accent, #f59e0b);
-    color: var(--color-on-accent, #fff);
-    box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
-}
-
-.val-badge {
-    font-weight: 950;
-    color: var(--color-accent, #f59e0b);
-    font-size: 1.25rem;
-}
-
-.label-row-v2 {
-    display: flex;
-    justify-content: space-between;
-}
-
-.range-v2 {
-    -webkit-appearance: none;
-    appearance: none;
-    width: 100%;
-    height: 8px;
-    background: var(--color-range-track, #e2e8f0);
-    border-radius: 10px;
-}
-
-:global(.theme-dark) .range-v2 {
-    background: var(--color-range-track-dark, #334155);
-}
-
-.range-v2::-webkit-slider-thumb {
-    -webkit-appearance: none;
-    appearance: none;
-    width: 26px;
-    height: 26px;
-    background: var(--color-surface, #fff);
-    border: 6px solid var(--color-accent, #f59e0b);
-    border-radius: 50%;
-    cursor: pointer;
-    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
-}
-
-.ratio-presets {
-    display: grid;
-    grid-template-columns: repeat(2, 1fr);
-    gap: 0.75rem;
-}
-
-.ratio-presets input {
-    display: none;
-}
-
-.ratio-presets label {
-    padding: 0.85rem;
-    text-align: center;
-    background: var(--color-btn-bg, #f8fafc);
-    border: 1px solid var(--color-btn-border, #e2e8f0);
-    border-radius: 0.75rem;
-    cursor: pointer;
-    font-weight: 700;
-    font-size: 0.85rem;
-    transition: all 0.2s;
-}
-
-:global(.theme-dark) .ratio-presets label {
-    background: var(--color-btn-bg-dark, #0f172a);
-    border-color: var(--color-btn-border-dark, #334155);
-}
-
-.ratio-presets input:checked + label {
-    background: var(--color-surface, #fff);
-    border-color: var(--color-accent, #f59e0b);
-    color: var(--color-accent, #f59e0b);
-    box-shadow: 0 4px 10px rgba(245, 158, 11, 0.1);
-}
-
-:global(.theme-dark) .ratio-presets input:checked + label {
-    background: var(--color-surface-elevated-dark, #1e293b);
-}
-
-.custom-ratio-link {
-    display: block;
-    text-align: right;
-    font-size: 0.75rem;
-    color: var(--color-label, #94a3b8);
-    margin-top: 1rem;
-    cursor: pointer;
-    text-decoration: underline;
-}
-
-.manual-slider-box {
-    margin-top: 2rem;
-    padding: 1.5rem;
-    background: var(--color-btn-bg, #f8fafc);
-    border-radius: 1rem;
-    border: 1px solid var(--color-btn-border, #e2e8f0);
-}
-
-:global(.theme-dark) .manual-slider-box {
-    background: var(--color-btn-bg-dark, #0f172a);
-    border-color: var(--color-btn-border-dark, #334155);
-}
-
-.ratio-labels {
-    display: flex;
-    justify-content: space-between;
-    font-size: 0.8rem;
-    margin-top: 1rem;
-    font-weight: 700;
-}
-
-.results-v2 {
-    background: var(--color-results-bg, #0f172a);
-    border-radius: 2rem;
-    padding: 2.5rem;
-    color: var(--color-results-text, #fff);
-    box-shadow: 0 20px 40px -10px rgba(15, 23, 42, 0.3);
-}
-
-:global(.theme-dark) .results-v2 {
-    background: var(--color-accent, #f59e0b);
-    color: var(--color-results-text-dark, #0f172a);
-    box-shadow: 0 20px 40px -10px rgba(245, 158, 11, 0.2);
-}
-
-.res-cards-v2 {
-    display: flex;
-    gap: 1.5rem;
-    margin-bottom: 2rem;
-}
-
-.res-card-v2 {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    border-left: 4px solid var(--color-accent, #f59e0b);
-    padding: 0.5rem 1.5rem;
-}
-
-:global(.theme-dark) .res-card-v2 {
-    border-left-color: var(--color-results-bg, #0f172a);
-}
-
-.res-tag {
-    font-size: 0.8rem;
-    font-weight: 900;
-    text-transform: uppercase;
-    color: var(--color-accent, #f59e0b);
-    margin-bottom: 0.25rem;
-    align-self: flex-start;
-}
-
-:global(.theme-dark) .res-tag {
-    color: var(--color-results-bg, #0f172a);
-    opacity: 0.7;
-}
-
-.res-num {
-    font-size: 4rem;
-    font-weight: 950;
-    line-height: 1;
-    align-self: flex-start;
-}
-
-.res-num small {
-    font-size: 1.25rem;
-    margin-left: 4px;
-    opacity: 0.6;
-}
-
-.res-footer-v2 {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding-top: 1.5rem;
-    border-top: 1px solid rgba(255, 255, 255, 0.1);
-}
-
-:global(.theme-dark) .res-footer-v2 {
-    border-top-color: rgba(0, 0, 0, 0.1);
-}
-
-.total-info {
-    font-weight: 800;
-    display: flex;
-    align-items: center;
-    gap: 0.5rem;
-}
-
-.total-info strong {
-    font-size: 1.4rem;
-}
-
-.footer-icon {
-    width: 1.5rem;
-    height: 1.5rem;
-}
-
-.status-box-v2 {
-    background: var(--color-accent, #f59e0b);
-    color: var(--color-on-accent, #fff);
-    padding: 0.4rem 1.25rem;
-    border-radius: 2rem;
-    font-size: 0.85rem;
-    font-weight: 900;
-}
-
-:global(.theme-dark) .status-box-v2 {
-    background: var(--color-results-bg, #0f172a);
-    color: var(--color-results-text, #fff);
-}
-
-@media (max-width: 600px) {
-    .pet-ration-calculator-final {
-        padding: 1.5rem;
-        margin: 1rem;
-    }
-
-    .species-selector-v2 {
-        flex-direction: column;
-    }
-
-    .res-cards-v2 {
-        flex-direction: column;
-    }
-
-    .res-footer-v2 {
-        flex-direction: column;
-        gap: 1.5rem;
-        text-align: center;
-    }
-}
-</style>

package/src/tool/petRation/entry.ts

@@ -0,0 +1,63 @@
+import type { PetToolEntry, ToolLocaleContent } from '../../types';
+
+export interface PetRationUI {
+  [key: string]: string;
+  toolTitle: string;
+  sectionProfile: string;
+  labelAnimal: string;
+  labelStage: string;
+  labelWeight: string;
+  labelActivity: string;
+  sectionDiet: string;
+  labelDietType: string;
+  speciesDog: string;
+  speciesCat: string;
+  speciesRabbit: string;
+  stagePuppy: string;
+  stageAdult: string;
+  stageSenior: string;
+  activityLow: string;
+  activityMod: string;
+  activityHigh: string;
+  dietDry: string;
+  dietMixed25: string;
+  dietHalf: string;
+  dietWet: string;
+  manualAdjust: string;
+  wetPercentLabel: string;
+  tagDry: string;
+  tagWet: string;
+  totalKcal: string;
+  kcalUnit: string;
+  statusPuppy: string;
+  statusSenior: string;
+  statusLargeDog: string;
+  statusDefault: string;
+}
+
+export type PetRationLocaleContent = ToolLocaleContent<PetRationUI>;
+
+export const petRation: PetToolEntry<PetRationUI> = {
+  id: 'pet-ration',
+  icons: {
+    bg: 'mdi:dog',
+    fg: 'mdi:scale',
+  },
+  i18n: {
+    de: () => import('./i18n/de').then((m) => m.content),
+    en: () => import('./i18n/en').then((m) => m.content),
+    es: () => import('./i18n/es').then((m) => m.content),
+    fr: () => import('./i18n/fr').then((m) => m.content),
+    id: () => import('./i18n/id').then((m) => m.content),
+    it: () => import('./i18n/it').then((m) => m.content),
+    ja: () => import('./i18n/ja').then((m) => m.content),
+    ko: () => import('./i18n/ko').then((m) => m.content),
+    nl: () => import('./i18n/nl').then((m) => m.content),
+    pl: () => import('./i18n/pl').then((m) => m.content),
+    pt: () => import('./i18n/pt').then((m) => m.content),
+    ru: () => import('./i18n/ru').then((m) => m.content),
+    sv: () => import('./i18n/sv').then((m) => m.content),
+    tr: () => import('./i18n/tr').then((m) => m.content),
+    zh: () => import('./i18n/zh').then((m) => m.content),
+  },
+};

package/src/tool/petRation/index.ts

@@ -1,68 +1,5 @@
-import type { PetToolEntry, ToolLocaleContent, ToolDefinition } from '../../types';
-
-export interface PetRationUI {
-  [key: string]: string;
-  toolTitle: string;
-  sectionProfile: string;
-  labelAnimal: string;
-  labelStage: string;
-  labelWeight: string;
-  labelActivity: string;
-  sectionDiet: string;
-  labelDietType: string;
-  speciesDog: string;
-  speciesCat: string;
-  speciesRabbit: string;
-  stagePuppy: string;
-  stageAdult: string;
-  stageSenior: string;
-  activityLow: string;
-  activityMod: string;
-  activityHigh: string;
-  dietDry: string;
-  dietMixed25: string;
-  dietHalf: string;
-  dietWet: string;
-  manualAdjust: string;
-  wetPercentLabel: string;
-  tagDry: string;
-  tagWet: string;
-  totalKcal: string;
-  kcalUnit: string;
-  statusPuppy: string;
-  statusSenior: string;
-  statusLargeDog: string;
-  statusDefault: string;
-}
-
-export type PetRationLocaleContent = ToolLocaleContent<PetRationUI>;
-
-export const petRation: PetToolEntry<PetRationUI> = {
-  id: 'pet-ration',
-  icons: {
-    bg: 'mdi:dog',
-    fg: 'mdi:scale',
-  },
-  i18n: {
-    de: () => import('./i18n/de').then((m) => m.content),
-    en: () => import('./i18n/en').then((m) => m.content),
-    es: () => import('./i18n/es').then((m) => m.content),
-    fr: () => import('./i18n/fr').then((m) => m.content),
-    id: () => import('./i18n/id').then((m) => m.content),
-    it: () => import('./i18n/it').then((m) => m.content),
-    ja: () => import('./i18n/ja').then((m) => m.content),
-    ko: () => import('./i18n/ko').then((m) => m.content),
-    nl: () => import('./i18n/nl').then((m) => m.content),
-    pl: () => import('./i18n/pl').then((m) => m.content),
-    pt: () => import('./i18n/pt').then((m) => m.content),
-    ru: () => import('./i18n/ru').then((m) => m.content),
-    sv: () => import('./i18n/sv').then((m) => m.content),
-    tr: () => import('./i18n/tr').then((m) => m.content),
-    zh: () => import('./i18n/zh').then((m) => m.content),
-  },
-};
-
-
+import { petRation } from './entry';
+export * from './entry';
 export const PET_RATION_TOOL: ToolDefinition = {
   entry: petRation,
   Component: () => import('./component.astro'),