Files
memos/web/src/less/setting-dialog.less
Lincoln Nogueira 557278fac0 feat: improve i18n support as a whole (#1526)
* feat: improve i18n support as a whole

- Remove dayjs in favor of /helpers/datetime.ts, which uses
Intl.DateTimeFormat and Date. Dayjs is not exactly i18n friendly
and has several locale related opened issues.

- Move/refactor date/time code from /helpers/utils.ts to
/helpers/datetime.ts.

- Fix Daily Review weekday not changing according to selected date.

- Localize Daily review weekday and month.

- Load i18n listed strings from /locales/{locale}.json in a dynamic way.
This makes much easier to add new locales, by just adding a properly
named json file and listing it only in /web/src/i18n.ts and
/api/user_setting.go.

- Fallback languages are now set in /web/src/i18n.ts.

- Full language codes are now preffered, but they fallback to 2-letter
codes when not available.

- The locale dropdown is now populated dynamically from the available
locales. Locale names are populated by the browser via
Intl.DisplayNames(locale).

- /web/src/i18n.ts now exports a type TLocale from availableLocales
array. This is used only by findNearestLanguageMatch(). As I was unable
to use this type in ".d.ts" files, I switched the Locale type from
/web/src/types/i18n.d.ts to string.

- Move pretty much all hardcoded text strings to i18n strings.

- Add pt-BR translation.

- Remove site.ts and move its content to a i18n string.

- Rename zh.json to zh-Hans.json to get the correct language name on
selector dropdown.

- Remove pt_BR.json and replace with pt-BR.json.

- Some minor layout spacing fixes to accommodate larger texts.

- Improve some error messages.

* Delete .yarnrc.yml

* Delete package-lock.json

* fix: 158:28  error  Insert `⏎`  prettier/prettier
2023-04-15 08:56:03 +08:00

60 lines
1.8 KiB
Plaintext

.setting-dialog {
@apply px-4;
> .dialog-container {
@apply w-180 max-w-full h-full sm:h-auto mb-8 p-0;
> .dialog-content-container {
@apply flex flex-row justify-start items-start relative w-full h-full p-0;
> .close-btn {
@apply z-1 flex flex-col justify-center items-center absolute top-4 right-4 w-6 h-6 rounded hover:bg-gray-200 dark:hover:bg-zinc-700 hover:shadow;
}
> .section-selector-container {
@apply hidden sm:flex flex-col justify-start items-start sm:w-52 h-auto sm:h-full shrink-0 rounded-t-lg sm:rounded-none sm:rounded-l-lg p-4 bg-gray-100 dark:bg-zinc-700;
> .section-title {
@apply text-sm mt-2 sm:mt-4 first:mt-4 mb-1 font-mono text-gray-400;
}
> .section-items-container {
@apply w-full h-auto flex flex-row sm:flex-col justify-start items-start;
> .section-item {
@apply flex flex-row justify-start items-center text-base select-none mr-3 sm:mr-0 mt-0 sm:mt-2 text-gray-700 dark:text-gray-300 cursor-pointer hover:opacity-80;
&.selected {
@apply font-bold hover:opacity-100;
}
> .icon-text {
@apply text-base mr-2;
}
}
}
}
> .section-content-container {
@apply w-full sm:w-auto p-4 sm:px-6 grow flex flex-col justify-start items-start h-full sm:h-128 overflow-y-scroll hide-scrollbar;
> .section-container {
@apply flex flex-col justify-start items-start w-full my-2;
.title-text {
@apply text-sm mt-4 first:mt-2 mb-3 font-mono text-gray-500;
}
> .form-label {
@apply flex flex-row items-center w-full mb-2;
> .normal-text {
@apply shrink-0 select-text;
}
}
}
}
}
}
}