@jjlmoya/utils-textiles 1.9.0 → 1.12.0

package/src/tool/fabricTruth/component.astro

@@ -278,431 +278,3 @@ const fibers = Object.entries(fiberData)
   startInit();
 </script>
 
-<style>
-  .fabric-truth-container {
-    width: 100%;
-    padding: 1rem;
-  }
-
-  .card-wrapper {
-    background: var(--bg-surface);
-    border: 1px solid var(--border-color);
-    border-radius: 1.5rem;
-    overflow: hidden;
-    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
-  }
-
-  .composition-section {
-    padding: 2rem;
-    border-bottom: 1px solid var(--border-color);
-  }
-
-  .section-title {
-    font-size: 1.5rem;
-    font-weight: bold;
-    margin: 0 0 0.5rem;
-    display: flex;
-    align-items: center;
-    gap: 0.5rem;
-    color: var(--text-main);
-  }
-
-  .title-icon {
-    width: 1.5rem;
-    height: 1.5rem;
-    color: #6366f1;
-  }
-
-  .section-description {
-    color: var(--text-muted);
-    margin: 0 0 1.5rem;
-    font-size: 0.95rem;
-  }
-
-  .rows-container {
-    display: flex;
-    flex-direction: column;
-    gap: 1rem;
-    margin-bottom: 1.5rem;
-  }
-
-  .fiber-row {
-    display: flex;
-    gap: 0.75rem;
-    align-items: center;
-    animation: slide-in 0.3s ease;
-  }
-
-  @keyframes slide-in {
-    from {
-      opacity: 0;
-      transform: translateX(-10px);
-    }
-    to {
-      opacity: 1;
-      transform: translateX(0);
-    }
-  }
-
-  .fiber-select {
-    flex: 1;
-    min-width: 150px;
-    background: var(--bg-page);
-    border: 1px solid var(--border-color);
-    border-radius: 0.75rem;
-    padding: 0.75rem;
-    color: var(--text-main);
-    font-weight: 500;
-    cursor: pointer;
-  }
-
-  .fiber-select:focus {
-    outline: none;
-    border-color: #6366f1;
-    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
-  }
-
-  .fiber-perc-wrapper {
-    position: relative;
-    width: 120px;
-  }
-
-  .fiber-perc {
-    width: 100%;
-    background: var(--bg-page);
-    border: 1px solid var(--border-color);
-    border-radius: 0.75rem;
-    padding: 0.75rem 2.5rem 0.75rem 0.75rem;
-    color: var(--text-main);
-    font-weight: 500;
-  }
-
-  .fiber-perc:focus {
-    outline: none;
-    border-color: #6366f1;
-    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
-  }
-
-  .perc-symbol {
-    position: absolute;
-    right: 0.75rem;
-    top: 50%;
-    transform: translateY(-50%);
-    color: var(--text-muted);
-    font-weight: bold;
-    pointer-events: none;
-  }
-
-  .remove-row-btn {
-    background: none;
-    border: none;
-    color: var(--text-muted);
-    cursor: pointer;
-    padding: 0.5rem;
-    display: flex;
-    align-items: center;
-    transition: color 0.2s;
-  }
-
-  .remove-row-btn:hover {
-    color: #ef4444;
-  }
-
-  .controls-footer {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding-top: 1rem;
-    border-top: 1px solid var(--border-color);
-    gap: 1rem;
-    flex-wrap: wrap;
-  }
-
-  .btn-add {
-    display: flex;
-    align-items: center;
-    gap: 0.5rem;
-    padding: 0.75rem 1.5rem;
-    background: var(--bg-page);
-    border: 1px solid var(--border-color);
-    border-radius: 0.75rem;
-    color: var(--text-main);
-    font-weight: 500;
-    cursor: pointer;
-    transition: all 0.2s;
-  }
-
-  .btn-add:hover {
-    background: var(--bg-surface);
-    border-color: #6366f1;
-  }
-
-  .btn-icon {
-    width: 1.25rem;
-    height: 1.25rem;
-  }
-
-  .total-badge {
-    padding: 0.75rem 1.5rem;
-    border-radius: 0.75rem;
-    font-weight: 600;
-    background: var(--bg-page);
-    color: var(--text-muted);
-    border: 1px solid var(--border-color);
-    transition: all 0.2s;
-  }
-
-  :global(.total-badge.total-complete) {
-    background: rgba(16, 185, 129, 0.1);
-    color: #10b981;
-    border-color: #10b981;
-  }
-
-  :global(.total-badge.total-error) {
-    background: rgba(239, 68, 68, 0.1);
-    color: #ef4444;
-    border-color: #ef4444;
-    animation: pulse 0.5s;
-  }
-
-  @keyframes pulse {
-    0%, 100% { opacity: 1; }
-    50% { opacity: 0.7; }
-  }
-
-  .results-section {
-    padding: 2rem;
-    background: var(--bg-page);
-  }
-
-  .empty-state {
-    text-align: center;
-    padding: 2rem;
-  }
-
-  .empty-icon {
-    width: 4rem;
-    height: 4rem;
-    margin: 0 auto 1rem;
-    color: var(--border-color);
-  }
-
-  .empty-state p {
-    margin: 0.5rem 0;
-    color: var(--text-muted);
-    font-size: 0.95rem;
-  }
-
-  .empty-helper {
-    font-size: 0.85rem;
-    font-style: italic;
-    color: var(--text-muted);
-    margin-top: 0.25rem;
-  }
-
-  .result-content {
-    display: flex;
-    flex-direction: column;
-    gap: 1.5rem;
-    animation: fade-in 0.5s ease;
-  }
-
-  :global(.result-content.hidden) {
-    display: none;
-  }
-
-  :global(.empty-state.hidden) {
-    display: none;
-  }
-
-  @keyframes fade-in {
-    from { opacity: 0; }
-    to { opacity: 1; }
-  }
-
-  .verdict-card {
-    padding: 1.5rem;
-    border-radius: 1rem;
-    border-left: 4px solid;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    transition: all 0.3s;
-    min-height: 100px;
-  }
-
-  :global(.verdict-card.color-red) {
-    background: rgba(239, 68, 68, 0.1);
-    color: #ef4444;
-    border-left-color: #dc2626;
-  }
-
-  :global(.verdict-card.color-amber) {
-    background: rgba(251, 146, 60, 0.1);
-    color: #f97316;
-    border-left-color: #ea580c;
-  }
-
-  :global(.verdict-card.color-yellow) {
-    background: rgba(234, 179, 8, 0.1);
-    color: #ca8a04;
-    border-left-color: #b45309;
-  }
-
-  :global(.verdict-card.color-emerald) {
-    background: rgba(16, 185, 129, 0.1);
-    color: #059669;
-    border-left-color: #047857;
-  }
-
-  :global(.verdict-card.color-blue) {
-    background: rgba(59, 130, 246, 0.1);
-    color: #2563eb;
-    border-left-color: #1d4ed8;
-  }
-
-  :global(.verdict-card.color-indigo) {
-    background: rgba(99, 102, 241, 0.1);
-    color: #4f46e5;
-    border-left-color: #4338ca;
-  }
-
-  :global(.verdict-card.color-gray) {
-    background: rgba(107, 114, 128, 0.1);
-    color: #6b7280;
-    border-left-color: #4b5563;
-  }
-
-  .verdict-content {
-    flex: 1;
-  }
-
-  .verdict-meta {
-    font-size: 0.75rem;
-    font-weight: 700;
-    text-transform: uppercase;
-    letter-spacing: 0.05em;
-    opacity: 0.7;
-  }
-
-  .verdict-label {
-    font-size: 1.75rem;
-    font-weight: 900;
-    margin: 0.5rem 0;
-  }
-
-  .verdict-desc {
-    font-size: 1rem;
-    margin: 0;
-    opacity: 0.9;
-  }
-
-  .verdict-icon {
-    width: 3rem;
-    height: 3rem;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background: rgba(255, 255, 255, 0.2);
-    border-radius: 50%;
-  }
-
-  .stats-grid {
-    display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
-    gap: 1rem;
-  }
-
-  .stat-card {
-    background: var(--bg-surface);
-    padding: 1rem;
-    border-radius: 0.75rem;
-    border: 1px solid var(--border-color);
-  }
-
-  .stat-header {
-    display: flex;
-    align-items: center;
-    gap: 0.5rem;
-    margin-bottom: 0.75rem;
-    font-size: 0.75rem;
-    font-weight: 700;
-    text-transform: uppercase;
-    letter-spacing: 0.05em;
-    color: var(--text-muted);
-  }
-
-  .stat-bar {
-    width: 100%;
-    height: 6px;
-    background: var(--border-color);
-    border-radius: 99px;
-    overflow: hidden;
-    margin-bottom: 0.5rem;
-  }
-
-  .stat-fill {
-    height: 100%;
-    background: currentcolor;
-    transition: width 1s ease;
-    width: 0%;
-  }
-
-  .stat-card:nth-child(1) .stat-fill {
-    background: #10b981;
-  }
-
-  .stat-card:nth-child(2) .stat-fill {
-    background: #3b82f6;
-  }
-
-  .stat-card:nth-child(3) .stat-fill {
-    background: #f97316;
-  }
-
-  .stat-value {
-    font-size: 0.85rem;
-    font-weight: 600;
-    text-align: right;
-    color: var(--text-muted);
-  }
-
-  .care-warning {
-    background: rgba(251, 191, 36, 0.1);
-    border: 1px solid rgba(251, 146, 60, 0.3);
-    padding: 1rem;
-    border-radius: 0.75rem;
-    display: flex;
-    gap: 0.75rem;
-    color: #b45309;
-  }
-
-  .care-warning svg {
-    width: 1.5rem;
-    height: 1.5rem;
-    flex-shrink: 0;
-    margin-top: 0.1rem;
-  }
-
-  .care-warning h4 {
-    font-weight: 700;
-    font-size: 0.85rem;
-    margin: 0 0 0.25rem;
-    text-transform: uppercase;
-    letter-spacing: 0.05em;
-  }
-
-  .care-warning p {
-    font-size: 0.9rem;
-    margin: 0;
-  }
-
-  .disclaimer {
-    text-align: center;
-    font-size: 0.75rem;
-    text-transform: uppercase;
-    letter-spacing: 0.05em;
-    color: var(--text-muted);
-    margin: 0;
-  }
-</style>

package/src/tool/fabricTruth/entry.ts

@@ -0,0 +1,30 @@
+import type { TextilesToolEntry, ToolLocaleContent } from '../../types';
+
+import type { FabricTruthUI } from './ui';
+
+export type FabricTruthLocaleContent = ToolLocaleContent<FabricTruthUI>;
+
+export const fabricTruth: TextilesToolEntry<FabricTruthUI> = {
+  id: 'fabric-truth',
+  icons: {
+    bg: 'mdi:tag-text-outline',
+    fg: 'mdi:microscope',
+  },
+  i18n: {
+    es: () => import('./i18n/es').then((m) => m.content),
+    en: () => import('./i18n/en').then((m) => m.content),
+    fr: () => import('./i18n/fr').then((m) => m.content),
+    de: () => import('./i18n/de').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),
+  },
+};