iarv/vscode-front-matter
1
0
Fork 1
mirror of https://github.com/estruyf/vscode-front-matter.git synced 2026-05-17 06:45:42 +02:00
Code Issues Packages Projects Releases Wiki Activity

Localization dashboard webview

Browse Source
This commit is contained in:
Elio Struyf
2023-07-19 10:07:31 -04:00
parent a4bf972b1d
commit 5fa49f6d87
8 changed files with 242 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/dashboardWebView/components/Header/Navigation.tsx
+14 -12
View File
@@ -3,6 +3,8 @@ import { useRecoilState, useRecoilValue } from 'recoil';
import { Tab } from '../../constants/Tab';
import useThemeColors from '../../hooks/useThemeColors';
import { SettingsAtom, TabAtom, TabInfoAtom } from '../../state';
import * as l10n from '@vscode/l10n';
import { LocalizationKey } from '../../../localization';
export interface INavigationProps {
totalPages: number;
@@ -15,9 +17,9 @@ export interface INavigationItemProps {
}
export const tabs = [
{ name: 'All articles', id: Tab.All },
{ name: 'Published', id: Tab.Published },
{ name: 'In draft', id: Tab.Draft }
{ name: l10n.t(LocalizationKey.dashboardHeaderNavigationAllArticles), id: Tab.All },
{ name: l10n.t(LocalizationKey.dashboardHeaderNavigationPublished), id: Tab.Published },
{ name: l10n.t(LocalizationKey.dashboardHeaderNavigationDraft), id: Tab.Draft }
];
const NavigationItem: React.FunctionComponent<INavigationItemProps> = ({
@@ -31,15 +33,15 @@ const NavigationItem: React.FunctionComponent<INavigationItemProps> = ({
return (
<button
className={`${isCrntTab
?
getColors(
'border-teal-900 dark:border-teal-300 text-teal-900 dark:text-teal-300',
'border-[var(--vscode-textLink-foreground)] text-[var(--vscode-textLink-foreground)]'
) :
getColors(
`border-transparent text-gray-500 dark:text-whisper-600 hover:text-gray-700 dark:hover:text-whisper-700 hover:border-gray-300 dark:hover:border-whisper-500`,
`border-transparent text-[var(--vscode-tab-inactiveForeground)] hover:text-[var(--vscode-textLink-activeForeground)] hover:border-[var(--vscode-textLink-activeForeground)]`
)
?
getColors(
'border-teal-900 dark:border-teal-300 text-teal-900 dark:text-teal-300',
'border-[var(--vscode-textLink-foreground)] text-[var(--vscode-textLink-foreground)]'
) :
getColors(
`border-transparent text-gray-500 dark:text-whisper-600 hover:text-gray-700 dark:hover:text-whisper-700 hover:border-gray-300 dark:hover:border-whisper-500`,
`border-transparent text-[var(--vscode-tab-inactiveForeground)] hover:text-[var(--vscode-textLink-activeForeground)] hover:border-[var(--vscode-textLink-activeForeground)]`
)
} whitespace-nowrap py-2 px-1 border-b-2 font-medium text-sm`}
aria-current={isCrntTab ? 'page' : undefined}
onClick={onClick}