diff options
7 files changed, 7 insertions, 14 deletions
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/changelog-list/ChangelogList.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/changelog-list/ChangelogList.tsx index bc6b3a2295..6c46aaaf97 100644 --- a/desktop/packages/mullvad-vpn/src/renderer/components/changelog-list/ChangelogList.tsx +++ b/desktop/packages/mullvad-vpn/src/renderer/components/changelog-list/ChangelogList.tsx @@ -3,7 +3,6 @@ import styled from 'styled-components'; import { IChangelog } from '../../../shared/ipc-types'; import { BodySmall } from '../../lib/components'; import { Flex } from '../../lib/components'; -import { Colors } from '../../lib/foundations'; const StyledList = styled(Flex)` list-style-type: disc; @@ -21,7 +20,7 @@ export function ChangelogList({ changelog }: ChangelogListProps) { return ( <StyledList as="ul" $flexDirection="column" $gap="medium"> {changelog.map((item, i) => ( - <BodySmall as="li" key={`${item}${i}`} color={Colors.white60}> + <BodySmall as="li" key={`${item}${i}`} color="whiteAlpha60"> {item} </BodySmall> ))} diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-info/components/version-list-item/VersionListItem.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-info/components/version-list-item/VersionListItem.tsx index 5a20fcdd1b..abc3654384 100644 --- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-info/components/version-list-item/VersionListItem.tsx +++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-info/components/version-list-item/VersionListItem.tsx @@ -1,7 +1,6 @@ import { messages } from '../../../../../../shared/gettext'; import { Icon } from '../../../../../lib/components'; import { ListItem } from '../../../../../lib/components/list-item'; -import { Colors } from '../../../../../lib/foundations'; import { useVersionCurrent } from '../../../../../redux/hooks'; import { useShowAlert, useShowFooter } from './hooks'; @@ -15,7 +14,7 @@ export function VersionListItem() { <ListItem.Item> <ListItem.Content> <ListItem.Group> - {showAlert && <Icon icon="alert-circle" color={Colors.red} />} + {showAlert && <Icon icon="alert-circle" color="red" />} <ListItem.Label> { // TRANSLATORS: Label for version list item. diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/ErrorFooter.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/ErrorFooter.tsx index acc6fa4b80..60c0056b44 100644 --- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/ErrorFooter.tsx +++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/ErrorFooter.tsx @@ -1,5 +1,4 @@ import { Flex, Icon, LabelTiny } from '../../../../../../../lib/components'; -import { Colors } from '../../../../../../../lib/foundations'; import { DownloadProgress } from '../../../download-progress'; import { ManualDownloadLink, ReportProblemButton, RetryButton } from './components'; import { useMessage, useShowManualDownloadLink } from './hooks'; @@ -13,7 +12,7 @@ export function ErrorFooter() { <Flex $gap="medium" $flexDirection="column" $margin={{ bottom: 'medium' }}> <Flex $gap="tiny" $flexDirection="row"> <div> - <Icon size="small" icon="alert-circle" color={Colors.red} /> + <Icon size="small" icon="alert-circle" color="red" /> </div> <Flex $flexDirection="column"> <LabelTiny>{message}</LabelTiny> diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/installer-ready/InstallerReady.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/installer-ready/InstallerReady.tsx index 4ea07c816e..11a10354dd 100644 --- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/installer-ready/InstallerReady.tsx +++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/installer-ready/InstallerReady.tsx @@ -1,6 +1,5 @@ import { messages } from '../../../../../../../../../../shared/gettext'; import { Flex, Icon, LabelTiny } from '../../../../../../../../../lib/components'; -import { Colors } from '../../../../../../../../../lib/foundations'; import { DownloadProgress } from '../../../../../download-progress'; import { LaunchInstallerButton } from '../../../../../launch-installer-button'; @@ -9,7 +8,7 @@ export function InstallerReady() { <Flex $padding="large" $flexDirection="column"> <Flex $gap="medium" $flexDirection="column" $margin={{ bottom: 'medium' }}> <Flex $gap="tiny" $alignItems="center"> - <Icon icon="checkmark" color={Colors.green} size="small" /> + <Icon icon="checkmark" color="green" size="small" /> <LabelTiny> { // TRANSLATORS: Label displayed above a progress bar when the update is verified successfully diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/LaunchFooter.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/LaunchFooter.tsx index c14fbfea12..a05afe356e 100644 --- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/LaunchFooter.tsx +++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/LaunchFooter.tsx @@ -1,6 +1,5 @@ import { messages } from '../../../../../../../../shared/gettext'; import { Flex, Icon, LabelTiny } from '../../../../../../../lib/components'; -import { Colors } from '../../../../../../../lib/foundations'; import { DownloadProgress } from '../../../download-progress'; import { LaunchInstallerButton } from '../../../launch-installer-button'; import { useDisabled, useMessage } from './hooks'; @@ -13,7 +12,7 @@ export function LaunchFooter() { <Flex $padding="large" $flexDirection="column"> <Flex $gap="medium" $flexDirection="column" $margin={{ bottom: 'medium' }}> <Flex $gap="tiny" $alignItems="center"> - <Icon icon="checkmark" color={Colors.green} size="small" /> + <Icon icon="checkmark" color="green" size="small" /> <LabelTiny> { // TRANSLATORS: Label displayed above a progress bar when the update is verified successfully diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/components/no-changelog-updates/NoChangelogUpdates.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/components/no-changelog-updates/NoChangelogUpdates.tsx index d9179e3029..6621c8d4fe 100644 --- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/components/no-changelog-updates/NoChangelogUpdates.tsx +++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/components/no-changelog-updates/NoChangelogUpdates.tsx @@ -1,10 +1,9 @@ import { messages } from '../../../../../../../../shared/gettext'; import { BodySmall } from '../../../../../../../lib/components'; -import { Colors } from '../../../../../../../lib/foundations'; export function NoChangelogUpdates() { return ( - <BodySmall color={Colors.white60}> + <BodySmall color="whiteAlpha60"> { // TRANSLATORS: Text displayed when there are no updates for this platform in the next app version messages.pgettext( diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/changelog/components/no-changelog-updates/NoChangelogUpdates.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/changelog/components/no-changelog-updates/NoChangelogUpdates.tsx index d67269e8d2..1cc425bd30 100644 --- a/desktop/packages/mullvad-vpn/src/renderer/components/views/changelog/components/no-changelog-updates/NoChangelogUpdates.tsx +++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/changelog/components/no-changelog-updates/NoChangelogUpdates.tsx @@ -1,10 +1,9 @@ import { messages } from '../../../../../../shared/gettext'; import { BodySmall } from '../../../../../lib/components'; -import { Colors } from '../../../../../lib/foundations'; export function NoChangelogUpdates() { return ( - <BodySmall color={Colors.white60}> + <BodySmall color="whiteAlpha60"> { // TRANSLATORS: Text displayed when there are no updates for this platform in the app version messages.pgettext( |