@asafarim/shared-i18n 0.6.6 → 0.8.0

package/dist/components/LanguageSwitcher.module.css

@@ -1,303 +1,303 @@
-@import "@asafarim/design-tokens/css";
-
-.switcher {
-  display: flex;
-  gap: var(--asm-space-2);
-  flex-wrap: wrap;
-  align-items: center;
-}
-
-.switcher button {
-  padding: var(--asm-space-2) var(--asm-space-4);
-  border: 1px solid var(--asm-color-border);
-  background: var(--asm-color-surface);
-  border-radius: var(--asm-radius-md);
-  cursor: pointer;
-  font-size: var(--asm-font-size-sm);
-  font-weight: 500;
-  transition: all var(--asm-motion-duration-fast) var(--asm-motion-easing-standard);
-  display: flex;
-  align-items: center;
-  gap: var(--asm-space-2);
-  min-width: 2.5rem;
-  justify-content: center;
-  color: var(--asm-color-text);
-  white-space: nowrap;
-}
-
-.switcher button:hover:not(:disabled) {
-  background: var(--asm-color-primary-600);
-  color: var(--asm-color-bg);
-  border-color: var(--asm-color-primary-600);
-  box-shadow: var(--asm-effect-shadow-sm);
-}
-
-.switcher button:disabled {
-  opacity: 0.5;
-  cursor: not-allowed;
-}
-
-.switcher button.active {
-  background: var(--asm-color-primary-600);
-  color: var(--asm-color-bg);
-  border-color: var(--asm-color-primary-600);
-  box-shadow: var(--asm-effect-shadow-md);
-}
-
-.switcher button.active:hover:not(:disabled) {
-  background: var(--asm-color-primary-700);
-  border-color: var(--asm-color-primary-700);
-  box-shadow: var(--asm-effect-shadow-lg);
-}
-
-.switcher select {
-  padding: var(--asm-space-2) calc(var(--asm-space-4) * 2) var(--asm-space-2) var(--asm-space-3);
-  border: 1px solid var(--asm-color-border);
-  background: var(--asm-color-surface);
-  border-radius: var(--asm-radius-md);
-  cursor: pointer;
-  font-size: var(--asm-font-size-sm);
-  font-weight: 500;
-  appearance: none;
-  color: var(--asm-color-text);
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M6 9L1 4h10z'/%3E%3C/svg%3E");
-  background-repeat: no-repeat;
-  background-position: right var(--asm-space-3) center;
-  transition: all var(--asm-motion-duration-fast) var(--asm-motion-easing-standard);
-  white-space: nowrap;
-}
-
-.switcher select:hover:not(:disabled) {
-  border-color: var(--asm-color-primary-600);
-  background-color: var(--asm-color-surface-muted);
-  box-shadow: var(--asm-effect-shadow-sm);
-}
-
-.switcher select:disabled {
-  opacity: 0.5;
-  cursor: not-allowed;
-}
-
-.iconDropdownContainer {
-  position: relative;
-  display: inline-block;
-}
-
-.iconDropdownButton {
-  padding: 0;
-  border: 1px solid var(--asm-color-border);
-  background: var(--asm-color-surface);
-  border-radius: var(--asm-radius-md);
-  cursor: pointer;
-  font-size: 1.25rem;
-  color: var(--asm-color-text);
-  width: 2.75rem;
-  height: 2.75rem;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  transition: all var(--asm-motion-duration-fast) var(--asm-motion-easing-standard);
-  flex-shrink: 0;
-  flex-wrap: nowrap;
-  white-space: nowrap;
-}
-
-.iconDropdownButtonWithLabel {
-  width: auto;
-  height: auto;
-  min-height: 2.75rem;
-  padding: var(--asm-space-2) var(--asm-space-3);
-  gap: var(--asm-space-2);
-  flex-wrap: nowrap;
-  min-width: auto;
-  display: inline-flex;
-  align-items: center;
-  white-space: nowrap;
-}
-
-.iconDropdownFlag {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  flex: 0 0 auto;
-  white-space: nowrap;
-  line-height: 1;
-  width: auto;
-  font-size: var(--asm-font-size-md);
-}
-
-.iconDropdownButtonContent {
-  display: inline-flex;
-  align-items: center;
-  flex-direction: row;
-  flex-wrap: nowrap;
-  white-space: nowrap;
-  gap: var(--asm-space-2);
-  line-height: 1;
-}
-
-.iconDropdownLabel {
-  font-size: var(--asm-font-size-sm);
-  font-weight: 500;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  min-width: 0;
-  max-width: 10rem;
-}
-
-.iconDropdownButton:hover:not(:disabled) {
-  border-color: var(--asm-color-primary-600);
-  background: var(--asm-color-surface-muted);
-  box-shadow: var(--asm-effect-shadow-sm);
-}
-
-.iconDropdownButton:disabled {
-  opacity: 0.5;
-  cursor: not-allowed;
-}
-
-/* HARD OVERRIDES: some global CSS is likely setting buttons to column layout */
-.iconDropdownButton,
-.iconDropdownButtonWithLabel,
-.iconDropdownButtonContent {
-  flex-direction: row !important;
-  flex-wrap: nowrap !important;
-  white-space: nowrap !important;
-  align-items: center !important;
-}
-
-/* ensure the labeled button is not centering like an icon-only button */
-.iconDropdownButtonWithLabel {
-  justify-content: flex-start !important;
-}
-
-/* keep the flag from behaving like a full-width block */
-.iconDropdownFlag {
-  display: inline-flex !important;
-  flex: 0 0 auto !important;
-  width: auto !important;
-  max-width: none !important;
-}
-
-/* allow the label to shrink without forcing a new line */
-.iconDropdownLabel {
-  display: inline-block !important;
-  min-width: 0 !important;
-}
-
-.iconDropdownButtonWithLabel * {
-  max-width: none !important;
-}
-
-.iconDropdownButtonContent > * {
-  width: auto !important;
-}
-
-.iconDropdownMenu {
-  position: absolute;
-  top: calc(100% + var(--asm-space-2));
-  left: 0;
-  background: var(--asm-color-surface);
-  border: 1px solid var(--asm-color-border);
-  border-radius: var(--asm-radius-md);
-  box-shadow: var(--asm-effect-shadow-lg);
-  z-index: 1000;
-  min-width: 14rem;
-  overflow: hidden;
-}
-
-.iconDropdownOption {
-  display: flex;
-  align-items: center;
-  gap: var(--asm-space-2);
-  width: 100%;
-  padding: var(--asm-space-2) var(--asm-space-3);
-  border: none;
-  background: transparent;
-  color: var(--asm-color-text);
-  cursor: pointer;
-  font-size: var(--asm-font-size-sm);
-  font-weight: 500;
-  text-align: left;
-  transition: all var(--asm-motion-duration-fast) var(--asm-motion-easing-standard);
-  white-space: nowrap;
-}
-
-.iconDropdownOption span {
-  line-height: 1;
-  display: inline-flex;
-  align-items: center;
-  white-space: nowrap;
-}
-
-.iconDropdownOption:hover:not(:disabled) {
-  background: var(--asm-color-surface-muted);
-  color: var(--asm-color-text);
-}
-
-.iconDropdownOption.active {
-  background: var(--asm-color-primary-600);
-  color: var(--asm-color-bg);
-}
-
-.iconDropdownOption.active:hover {
-  background: var(--asm-color-primary-700);
-}
-
-.toggler {
-  padding: var(--asm-space-2) var(--asm-space-4);
-  border: 1px solid var(--asm-color-border);
-  background: var(--asm-color-transparent);
-  border-radius: var(--asm-radius-md);
-  cursor: pointer;
-  font-size: var(--asm-font-size-sm);
-  font-weight: 500;
-  transition: all var(--asm-motion-duration-fast) var(--asm-motion-easing-standard);
-  display: flex;
-  align-items: center;
-  gap: var(--asm-space-2);
-  color: var(--asm-color-text);
-  white-space: nowrap;
-}
-
-.toggler:hover:not(:disabled) {
-  background: var(--asm-color-primary-600);
-  color: var(--asm-color-bg);
-  border-color: var(--asm-color-primary-600);
-  box-shadow: var(--asm-effect-shadow-sm);
-}
-
-.toggler:disabled {
-  opacity: 0.5;
-  cursor: not-allowed;
-}
-
-@media (max-width: 640px) {
-  .switcher button {
-    padding: var(--asm-space-1) var(--asm-space-3);
-    font-size: var(--asm-font-size-xs);
-    min-width: 2.25rem;
-  }
-
-  .switcher select {
-    font-size: var(--asm-font-size-xs);
-  }
-
-  .toggler {
-    padding: var(--asm-space-1) var(--asm-space-2);
-    font-size: var(--asm-font-size-xs);
-  }
-
-  .togglerLabel {
-    padding: var(--asm-space-1) var(--asm-space-1);
-  }
-
-  .iconDropdownButtonWithLabel {
-    padding: var(--asm-space-1) var(--asm-space-2);
-  }
-
-  .iconDropdownLabel {
-    font-size: var(--asm-font-size-xs);
-  }
-}
+@import "@asafarim/design-tokens/css";
+
+.switcher {
+  display: flex;
+  gap: var(--asm-space-2);
+  flex-wrap: wrap;
+  align-items: center;
+}
+
+.switcher button {
+  padding: var(--asm-space-2) var(--asm-space-4);
+  border: 1px solid var(--asm-color-border);
+  background: var(--asm-color-surface);
+  border-radius: var(--asm-radius-md);
+  cursor: pointer;
+  font-size: var(--asm-font-size-sm);
+  font-weight: 500;
+  transition: all var(--asm-motion-duration-fast) var(--asm-motion-easing-standard);
+  display: flex;
+  align-items: center;
+  gap: var(--asm-space-2);
+  min-width: 2.5rem;
+  justify-content: center;
+  color: var(--asm-color-text);
+  white-space: nowrap;
+}
+
+.switcher button:hover:not(:disabled) {
+  background: var(--asm-color-primary-600);
+  color: var(--asm-color-bg);
+  border-color: var(--asm-color-primary-600);
+  box-shadow: var(--asm-effect-shadow-sm);
+}
+
+.switcher button:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.switcher button.active {
+  background: var(--asm-color-primary-600);
+  color: var(--asm-color-bg);
+  border-color: var(--asm-color-primary-600);
+  box-shadow: var(--asm-effect-shadow-md);
+}
+
+.switcher button.active:hover:not(:disabled) {
+  background: var(--asm-color-primary-700);
+  border-color: var(--asm-color-primary-700);
+  box-shadow: var(--asm-effect-shadow-lg);
+}
+
+.switcher select {
+  padding: var(--asm-space-2) calc(var(--asm-space-4) * 2) var(--asm-space-2) var(--asm-space-3);
+  border: 1px solid var(--asm-color-border);
+  background: var(--asm-color-surface);
+  border-radius: var(--asm-radius-md);
+  cursor: pointer;
+  font-size: var(--asm-font-size-sm);
+  font-weight: 500;
+  appearance: none;
+  color: var(--asm-color-text);
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M6 9L1 4h10z'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right var(--asm-space-3) center;
+  transition: all var(--asm-motion-duration-fast) var(--asm-motion-easing-standard);
+  white-space: nowrap;
+}
+
+.switcher select:hover:not(:disabled) {
+  border-color: var(--asm-color-primary-600);
+  background-color: var(--asm-color-surface-muted);
+  box-shadow: var(--asm-effect-shadow-sm);
+}
+
+.switcher select:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.iconDropdownContainer {
+  position: relative;
+  display: inline-block;
+}
+
+.iconDropdownButton {
+  padding: 0;
+  border: 1px solid var(--asm-color-border);
+  background: var(--asm-color-surface);
+  border-radius: var(--asm-radius-md);
+  cursor: pointer;
+  font-size: 1.25rem;
+  color: var(--asm-color-text);
+  width: 2.75rem;
+  height: 2.75rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all var(--asm-motion-duration-fast) var(--asm-motion-easing-standard);
+  flex-shrink: 0;
+  flex-wrap: nowrap;
+  white-space: nowrap;
+}
+
+.iconDropdownButtonWithLabel {
+  width: auto;
+  height: auto;
+  min-height: 2.75rem;
+  padding: var(--asm-space-2) var(--asm-space-3);
+  gap: var(--asm-space-2);
+  flex-wrap: nowrap;
+  min-width: auto;
+  display: inline-flex;
+  align-items: center;
+  white-space: nowrap;
+}
+
+.iconDropdownFlag {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 auto;
+  white-space: nowrap;
+  line-height: 1;
+  width: auto;
+  font-size: var(--asm-font-size-md);
+}
+
+.iconDropdownButtonContent {
+  display: inline-flex;
+  align-items: center;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  white-space: nowrap;
+  gap: var(--asm-space-2);
+  line-height: 1;
+}
+
+.iconDropdownLabel {
+  font-size: var(--asm-font-size-sm);
+  font-weight: 500;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  min-width: 0;
+  max-width: 10rem;
+}
+
+.iconDropdownButton:hover:not(:disabled) {
+  border-color: var(--asm-color-primary-600);
+  background: var(--asm-color-surface-muted);
+  box-shadow: var(--asm-effect-shadow-sm);
+}
+
+.iconDropdownButton:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+/* HARD OVERRIDES: some global CSS is likely setting buttons to column layout */
+.iconDropdownButton,
+.iconDropdownButtonWithLabel,
+.iconDropdownButtonContent {
+  flex-direction: row !important;
+  flex-wrap: nowrap !important;
+  white-space: nowrap !important;
+  align-items: center !important;
+}
+
+/* ensure the labeled button is not centering like an icon-only button */
+.iconDropdownButtonWithLabel {
+  justify-content: flex-start !important;
+}
+
+/* keep the flag from behaving like a full-width block */
+.iconDropdownFlag {
+  display: inline-flex !important;
+  flex: 0 0 auto !important;
+  width: auto !important;
+  max-width: none !important;
+}
+
+/* allow the label to shrink without forcing a new line */
+.iconDropdownLabel {
+  display: inline-block !important;
+  min-width: 0 !important;
+}
+
+.iconDropdownButtonWithLabel * {
+  max-width: none !important;
+}
+
+.iconDropdownButtonContent > * {
+  width: auto !important;
+}
+
+.iconDropdownMenu {
+  position: absolute;
+  top: calc(100% + var(--asm-space-2));
+  left: 0;
+  background: var(--asm-color-surface);
+  border: 1px solid var(--asm-color-border);
+  border-radius: var(--asm-radius-md);
+  box-shadow: var(--asm-effect-shadow-lg);
+  z-index: 1000;
+  min-width: 14rem;
+  overflow: hidden;
+}
+
+.iconDropdownOption {
+  display: flex;
+  align-items: center;
+  gap: var(--asm-space-2);
+  width: 100%;
+  padding: var(--asm-space-2) var(--asm-space-3);
+  border: none;
+  background: transparent;
+  color: var(--asm-color-text);
+  cursor: pointer;
+  font-size: var(--asm-font-size-sm);
+  font-weight: 500;
+  text-align: left;
+  transition: all var(--asm-motion-duration-fast) var(--asm-motion-easing-standard);
+  white-space: nowrap;
+}
+
+.iconDropdownOption span {
+  line-height: 1;
+  display: inline-flex;
+  align-items: center;
+  white-space: nowrap;
+}
+
+.iconDropdownOption:hover:not(:disabled) {
+  background: var(--asm-color-surface-muted);
+  color: var(--asm-color-text);
+}
+
+.iconDropdownOption.active {
+  background: var(--asm-color-primary-600);
+  color: var(--asm-color-bg);
+}
+
+.iconDropdownOption.active:hover {
+  background: var(--asm-color-primary-700);
+}
+
+.toggler {
+  padding: var(--asm-space-2) var(--asm-space-4);
+  border: 1px solid var(--asm-color-border);
+  background: var(--asm-color-transparent);
+  border-radius: var(--asm-radius-md);
+  cursor: pointer;
+  font-size: var(--asm-font-size-sm);
+  font-weight: 500;
+  transition: all var(--asm-motion-duration-fast) var(--asm-motion-easing-standard);
+  display: flex;
+  align-items: center;
+  gap: var(--asm-space-2);
+  color: var(--asm-color-text);
+  white-space: nowrap;
+}
+
+.toggler:hover:not(:disabled) {
+  background: var(--asm-color-primary-600);
+  color: var(--asm-color-bg);
+  border-color: var(--asm-color-primary-600);
+  box-shadow: var(--asm-effect-shadow-sm);
+}
+
+.toggler:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+@media (max-width: 640px) {
+  .switcher button {
+    padding: var(--asm-space-1) var(--asm-space-3);
+    font-size: var(--asm-font-size-xs);
+    min-width: 2.25rem;
+  }
+
+  .switcher select {
+    font-size: var(--asm-font-size-xs);
+  }
+
+  .toggler {
+    padding: var(--asm-space-1) var(--asm-space-2);
+    font-size: var(--asm-font-size-xs);
+  }
+
+  .togglerLabel {
+    padding: var(--asm-space-1) var(--asm-space-1);
+  }
+
+  .iconDropdownButtonWithLabel {
+    padding: var(--asm-space-1) var(--asm-space-2);
+  }
+
+  .iconDropdownLabel {
+    font-size: var(--asm-font-size-xs);
+  }
+}

package/dist/locales/de/common.json

@@ -0,0 +1,68 @@
+{
+    "welcome": "Willkommen",
+    "language": "Sprache",
+    "settings": "Einstellungen",
+    "profile": "Profil",
+    "logout": "Abmelden",
+    "login": "Anmelden",
+    "register": "Registrieren",
+    "email": "E-Mail",
+    "password": "Passwort",
+    "confirmPassword": "Passwort bestätigen",
+    "forgotPassword": "Passwort vergessen?",
+    "rememberMe": "Angemeldet bleiben",
+    "submit": "Absenden",
+    "cancel": "Abbrechen",
+    "save": "Speichern",
+    "delete": "Löschen",
+    "edit": "Bearbeiten",
+    "close": "Schließen",
+    "search": "Suchen",
+    "loading": "Lädt...",
+    "error": "Fehler",
+    "success": "Erfolg",
+    "warning": "Warnung",
+    "info": "Information",
+    "yes": "Ja",
+    "no": "Nein",
+    "back": "Zurück",
+    "next": "Weiter",
+    "previous": "Vorherige",
+    "home": "Startseite",
+    "about": "Über uns",
+    "contact": "Kontakt",
+    "services": "Dienstleistungen",
+    "blog": "Blog",
+    "careers": "Karriere",
+    "privacy": "Datenschutzrichtlinie",
+    "terms": "Nutzungsbedingungen",
+    "copyright": " ASafariM. Alle Rechte vorbehalten.",
+    "languageChanged": "Sprache erfolgreich geändert",
+    "preferencesSaved": "Einstellungen erfolgreich gespeichert",
+    "apps": {
+        "appName": {
+            "web": "ASafariM Web",
+            "blog": "Blog & Dokumentation",
+            "ai": "KI-Tools",
+            "core": "Kern-App",
+            "jobs": "Bewerbungen",
+            "identity": "Identitätsportal",
+            "testora": "Testora",
+            "taskmanagement": "Aufgabenverwaltung",
+            "smartops": "SmartOps",
+            "studynotes": "Lernnotizen"
+        },
+        "description": {
+            "web": "ASafariM Webportal",
+            "blog": "Dokumentation und Blog",
+            "ai": "KI-gestützte Tools und Dienstleistungen",
+            "core": "Kernanwendungsfunktionen",
+            "jobs": "Bewerbungsverfolgung",
+            "identity": "Benutzerverwaltung und Authentifizierung",
+            "testora": "Testautomatisierungssystem - Testora",
+            "taskmanagement": "Aufgabenverwaltung",
+            "smartops": "SmartOps",
+            "studynotes": "Lernnotizen"
+        }
+    }
+}