Diff
checker
文本
文本
圖像
文檔
Excel
文件夾
Legal
Enterprise
桌面版
定價
登入
下載 Diffchecker 桌面版
比較文本
尋找兩個文字檔案之間的差異
工具
歷史
即時編輯器
隱藏空白變更
摺疊未變更行
關閉換行
檢視
拆分
統一
比對精度
智能
單詞
字符
文字樣式
變更外觀
語法突出顯示
選擇語法
忽略
文字轉換
前往第一個差異
編輯輸入
Diffchecker Desktop
執行Diffchecker最安全的方式。取得Diffchecker桌面應用程式:您的差異永遠不會離開您的電腦!
取得桌面版
Themes
建立於
4 個月前
差異永不過期
清除
匯出
分享
解釋
2 刪除
行
總計
刪除
字符
總計
刪除
要繼續使用此功能,請升級到
Diff
checker
Pro
查看價格
249 行
全部複製
4 新增
行
總計
新增
字符
總計
新增
要繼續使用此功能,請升級到
Diff
checker
Pro
查看價格
251 行
全部複製
import * as colorPalette from '@desktop-client/style/palette';
import * as colorPalette from '@desktop-client/style/palette';
export const pageBackground = colorPalette.navy100;
export const pageBackground = colorPalette.navy100;
export const pageBackgroundModalActive = colorPalette.navy200;
export const pageBackgroundModalActive = colorPalette.navy200;
export const pageBackgroundTopLeft = colorPalette.navy100;
export const pageBackgroundTopLeft = colorPalette.navy100;
export const pageBackgroundBottomRight = colorPalette.blue150;
export const pageBackgroundBottomRight = colorPalette.blue150;
export const pageBackgroundLineTop = colorPalette.white;
export const pageBackgroundLineTop = colorPalette.white;
export const pageBackgroundLineMid = colorPalette.navy100;
export const pageBackgroundLineMid = colorPalette.navy100;
export const pageBackgroundLineBottom = colorPalette.blue150;
export const pageBackgroundLineBottom = colorPalette.blue150;
export const pageText = '#272630';
export const pageText = '#272630';
export const pageTextLight = colorPalette.navy500;
export const pageTextLight = colorPalette.navy500;
export const pageTextSubdued = colorPalette.navy300;
export const pageTextSubdued = colorPalette.navy300;
export const pageTextDark = colorPalette.navy800;
export const pageTextDark = colorPalette.navy800;
export const pageTextPositive = colorPalette.purple600;
export const pageTextPositive = colorPalette.purple600;
export const pageTextLink = colorPalette.blue600;
export const pageTextLink = colorPalette.blue600;
export const pageTextLinkLight = colorPalette.blue300;
export const pageTextLinkLight = colorPalette.blue300;
export const cardBackground = colorPalette.white;
export const cardBackground = colorPalette.white;
export const cardBorder = colorPalette.purple700;
export const cardBorder = colorPalette.purple700;
export const cardShadow = colorPalette.navy700;
export const cardShadow = colorPalette.navy700;
export const tableBackground = colorPalette.white;
export const tableBackground = colorPalette.white;
export const tableRowBackgroundHover = colorPalette.navy50;
export const tableRowBackgroundHover = colorPalette.navy50;
export const tableText = pageText;
export const tableText = pageText;
export const tableTextLight = colorPalette.navy400;
export const tableTextLight = colorPalette.navy400;
export const tableTextSubdued = colorPalette.navy100;
export const tableTextSubdued = colorPalette.navy100;
export const tableTextSelected = colorPalette.navy700;
export const tableTextSelected = colorPalette.navy700;
export const tableTextHover = colorPalette.navy900;
export const tableTextHover = colorPalette.navy900;
export const tableTextInactive = colorPalette.navy500;
export const tableTextInactive = colorPalette.navy500;
export const tableHeaderText = colorPalette.navy600;
export const tableHeaderText = colorPalette.navy600;
export const tableHeaderBackground = colorPalette.white;
export const tableHeaderBackground = colorPalette.white;
export const tableBorder = colorPalette.navy100;
export const tableBorder = colorPalette.navy100;
export const tableBorderSelected = colorPalette.purple500;
export const tableBorderSelected = colorPalette.purple500;
export const tableBorderHover = colorPalette.purple400;
export const tableBorderHover = colorPalette.purple400;
export const tableBorderSeparator = colorPalette.navy400;
export const tableBorderSeparator = colorPalette.navy400;
export const tableRowBackgroundHighlight = colorPalette.blue150;
export const tableRowBackgroundHighlight = colorPalette.blue150;
export const tableRowBackgroundHighlightText = colorPalette.navy700;
export const tableRowBackgroundHighlightText = colorPalette.navy700;
export const tableRowHeaderBackground = colorPalette.navy50;
export const tableRowHeaderBackground = colorPalette.navy50;
export const tableRowHeaderText = colorPalette.navy800;
export const tableRowHeaderText = colorPalette.navy800;
export const numberPositive = colorPalette.green700;
export const numberPositive = colorPalette.green700;
export const numberNegative = colorPalette.red500;
export const numberNegative = colorPalette.red500;
export const numberNeutral = colorPalette.navy100;
export const numberNeutral = colorPalette.navy100;
export const budgetNumberNegative = numberNegative;
export const budgetNumberNegative = numberNegative;
export const budgetNumberZero = tableTextSubdued;
export const budgetNumberZero = tableTextSubdued;
export const budgetNumberNeutral = tableText;
export const budgetNumberNeutral = tableText;
export const budgetNumberPositive = budgetNumberNeutral;
export const budgetNumberPositive = budgetNumberNeutral;
export const templateNumberFunded = numberPositive;
export const templateNumberFunded = numberPositive;
export const templateNumberUnderFunded = colorPalette.orange700;
export const templateNumberUnderFunded = colorPalette.orange700;
export const toBudgetPositive = numberPositive;
export const toBudgetPositive = numberPositive;
export const toBudgetZero = numberPositive;
export const toBudgetZero = numberPositive;
export const toBudgetNegative = budgetNumberNegative;
export const toBudgetNegative = budgetNumberNegative;
export const sidebarBackground = colorPalette.navy900;
export const sidebarBackground = colorPalette.navy900;
export const sidebarItemBackgroundPending = colorPalette.orange200;
export const sidebarItemBackgroundPending = colorPalette.orange200;
export const sidebarItemBackgroundPositive = colorPalette.green500;
export const sidebarItemBackgroundPositive = colorPalette.green500;
export const sidebarItemBackgroundFailed = colorPalette.red300;
export const sidebarItemBackgroundFailed = colorPalette.red300;
export const sidebarItemBackgroundHover = colorPalette.navy800;
export const sidebarItemBackgroundHover = colorPalette.navy800;
export const sidebarItemAccentSelected = colorPalette.purple200;
export const sidebarItemAccentSelected = colorPalette.purple200;
export const sidebarItemText = colorPalette.navy150;
export const sidebarItemText = colorPalette.navy150;
export const sidebarItemTextSelected = colorPalette.purple200;
export const sidebarItemTextSelected = colorPalette.purple200;
export const sidebarBudgetName = colorPalette.navy150;
export const sidebarBudgetName = colorPalette.navy150;
export const menuBackground = colorPalette.white;
export const menuBackground = colorPalette.white;
export const menuItemBackground = colorPalette.navy50;
export const menuItemBackground = colorPalette.navy50;
export const menuItemBackgroundHover = colorPalette.navy100;
export const menuItemBackgroundHover = colorPalette.navy100;
export const menuItemText = colorPalette.navy900;
export const menuItemText = colorPalette.navy900;
export const menuItemTextHover = menuItemText;
export const menuItemTextHover = menuItemText;
export const menuItemTextSelected = colorPalette.purple300;
export const menuItemTextSelected = colorPalette.purple300;
export const menuItemTextHeader = colorPalette.navy400;
export const menuItemTextHeader = colorPalette.navy400;
export const menuBorder = colorPalette.navy100;
export const menuBorder = colorPalette.navy100;
export const menuBorderHover = colorPalette.purple100;
export const menuBorderHover = colorPalette.purple100;
export const menuKeybindingText = colorPalette.navy400;
export const menuKeybindingText = colorPalette.navy400;
export const menuAutoCompleteBackground = colorPalette.navy900;
export const menuAutoCompleteBackground = colorPalette.navy900;
export const menuAutoCompleteBackgroundHover = colorPalette.navy600;
export const menuAutoCompleteBackgroundHover = colorPalette.navy600;
export const menuAutoCompleteText = colorPalette.white;
export const menuAutoCompleteText = colorPalette.white;
複製
已複製
複製
已複製
export const menuAutoCompleteTextHover = colorPalette.green150;
export const menuAutoCompleteTextHeader = colorPalette.orange150;
export const menuAutoCompleteTextHeader = colorPalette.orange150;
複製
已複製
複製
已複製
export const menuAutoCompleteItemTextHover = menuAutoCompleteText;
export const menuAutoCompleteItemText = menuAutoCompleteText;
export const menuAutoCompleteItemText = menuAutoCompleteText;
export const modalBackground = colorPalette.white;
export const modalBackground = colorPalette.white;
export const modalBorder = colorPalette.white;
export const modalBorder = colorPalette.white;
export const mobileHeaderBackground = colorPalette.purple400;
export const mobileHeaderBackground = colorPalette.purple400;
export const mobileHeaderText = colorPalette.navy50;
export const mobileHeaderText = colorPalette.navy50;
export const mobileHeaderTextSubdued = colorPalette.gray200;
export const mobileHeaderTextSubdued = colorPalette.gray200;
export const mobileHeaderTextHover = 'rgba(200, 200, 200, .15)';
export const mobileHeaderTextHover = 'rgba(200, 200, 200, .15)';
export const mobilePageBackground = colorPalette.navy50;
export const mobilePageBackground = colorPalette.navy50;
export const mobileNavBackground = colorPalette.white;
export const mobileNavBackground = colorPalette.white;
export const mobileNavItem = colorPalette.gray300;
export const mobileNavItem = colorPalette.gray300;
export const mobileNavItemSelected = colorPalette.purple500;
export const mobileNavItemSelected = colorPalette.purple500;
export const mobileAccountShadow = colorPalette.navy300;
export const mobileAccountShadow = colorPalette.navy300;
export const mobileAccountText = colorPalette.blue800;
export const mobileAccountText = colorPalette.blue800;
export const mobileTransactionSelected = colorPalette.purple500;
export const mobileTransactionSelected = colorPalette.purple500;
// Mobile view themes (for the top bar)
// Mobile view themes (for the top bar)
export const mobileViewTheme = mobileHeaderBackground;
export const mobileViewTheme = mobileHeaderBackground;
export const mobileConfigServerViewTheme = colorPalette.purple500;
export const mobileConfigServerViewTheme = colorPalette.purple500;
export const markdownNormal = colorPalette.purple150;
export const markdownNormal = colorPalette.purple150;
export const markdownDark = colorPalette.purple400;
export const markdownDark = colorPalette.purple400;
export const markdownLight = colorPalette.purple100;
export const markdownLight = colorPalette.purple100;
// Button
// Button
export const buttonMenuText = colorPalette.navy100;
export const buttonMenuText = colorPalette.navy100;
export const buttonMenuTextHover = colorPalette.navy50;
export const buttonMenuTextHover = colorPalette.navy50;
export const buttonMenuBackground = 'transparent';
export const buttonMenuBackground = 'transparent';
export const buttonMenuBackgroundHover = 'rgba(200, 200, 200, .25)';
export const buttonMenuBackgroundHover = 'rgba(200, 200, 200, .25)';
export const buttonMenuBorder = colorPalette.navy500;
export const buttonMenuBorder = colorPalette.navy500;
export const buttonMenuSelectedText = colorPalette.green800;
export const buttonMenuSelectedText = colorPalette.green800;
export const buttonMenuSelectedTextHover = colorPalette.orange800;
export const buttonMenuSelectedTextHover = colorPalette.orange800;
export const buttonMenuSelectedBackground = colorPalette.orange200;
export const buttonMenuSelectedBackground = colorPalette.orange200;
export const buttonMenuSelectedBackgroundHover = colorPalette.orange300;
export const buttonMenuSelectedBackgroundHover = colorPalette.orange300;
export const buttonMenuSelectedBorder = buttonMenuSelectedBackground;
export const buttonMenuSelectedBorder = buttonMenuSelectedBackground;
export const buttonPrimaryText = colorPalette.white;
export const buttonPrimaryText = colorPalette.white;
export const buttonPrimaryTextHover = buttonPrimaryText;
export const buttonPrimaryTextHover = buttonPrimaryText;
export const buttonPrimaryBackground = colorPalette.purple500;
export const buttonPrimaryBackground = colorPalette.purple500;
複製
已複製
複製
已複製
export const buttonPrimaryBackgroundHover =
buttonPrimaryBackground
;
export const buttonPrimaryBackgroundHover =
colorPalette.purple300
;
export const buttonPrimaryBorder = buttonPrimaryBackground;
export const buttonPrimaryBorder = buttonPrimaryBackground;
export const buttonPrimaryShadow = 'rgba(0, 0, 0, 0.3)';
export const buttonPrimaryShadow = 'rgba(0, 0, 0, 0.3)';
export const buttonPrimaryDisabledText = colorPalette.white;
export const buttonPrimaryDisabledText = colorPalette.white;
export const buttonPrimaryDisabledBackground = colorPalette.navy300;
export const buttonPrimaryDisabledBackground = colorPalette.navy300;
export const buttonPrimaryDisabledBorder = buttonPrimaryDisabledBackground;
export const buttonPrimaryDisabledBorder = buttonPrimaryDisabledBackground;
export const buttonNormalText = colorPalette.navy900;
export const buttonNormalText = colorPalette.navy900;
export const buttonNormalTextHover = buttonNormalText;
export const buttonNormalTextHover = buttonNormalText;
export const buttonNormalBackground = colorPalette.white;
export const buttonNormalBackground = colorPalette.white;
export const buttonNormalBackgroundHover = buttonNormalBackground;
export const buttonNormalBackgroundHover = buttonNormalBackground;
export const buttonNormalBorder = colorPalette.navy150;
export const buttonNormalBorder = colorPalette.navy150;
export const buttonNormalShadow = 'rgba(0, 0, 0, 0.2)';
export const buttonNormalShadow = 'rgba(0, 0, 0, 0.2)';
export const buttonNormalSelectedText = colorPalette.white;
export const buttonNormalSelectedText = colorPalette.white;
export const buttonNormalSelectedBackground = colorPalette.blue600;
export const buttonNormalSelectedBackground = colorPalette.blue600;
export const buttonNormalDisabledText = colorPalette.navy300;
export const buttonNormalDisabledText = colorPalette.navy300;
export const buttonNormalDisabledBackground = buttonNormalBackground;
export const buttonNormalDisabledBackground = buttonNormalBackground;
export const buttonNormalDisabledBorder = buttonNormalBorder;
export const buttonNormalDisabledBorder = buttonNormalBorder;
export const calendarText = colorPalette.navy50;
export const calendarText = colorPalette.navy50;
export const calendarBackground = colorPalette.navy900;
export const calendarBackground = colorPalette.navy900;
export const calendarItemText = colorPalette.navy150;
export const calendarItemText = colorPalette.navy150;
export const calendarItemBackground = colorPalette.navy800;
export const calendarItemBackground = colorPalette.navy800;
export const calendarSelectedBackground = colorPalette.navy500;
export const calendarSelectedBackground = colorPalette.navy500;
export const buttonBareText = buttonNormalText;
export const buttonBareText = buttonNormalText;
export const buttonBareTextHover = buttonNormalText;
export const buttonBareTextHover = buttonNormalText;
export const buttonBareBackground = 'transparent';
export const buttonBareBackground = 'transparent';
export const buttonBareBackgroundHover = 'rgba(100, 100, 100, .15)';
export const buttonBareBackgroundHover = 'rgba(100, 100, 100, .15)';
export const buttonBareBackgroundActive = 'rgba(100, 100, 100, .25)';
export const buttonBareBackgroundActive = 'rgba(100, 100, 100, .25)';
export const buttonBareDisabledText = buttonNormalDisabledText;
export const buttonBareDisabledText = buttonNormalDisabledText;
export const buttonBareDisabledBackground = buttonBareBackground;
export const buttonBareDisabledBackground = buttonBareBackground;
export const noticeBackground = colorPalette.green150;
export const noticeBackground = colorPalette.green150;
export const noticeBackgroundLight = colorPalette.green100;
export const noticeBackgroundLight = colorPalette.green100;
export const noticeBackgroundDark = colorPalette.green500;
export const noticeBackgroundDark = colorPalette.green500;
export const noticeText = colorPalette.green700;
export const noticeText = colorPalette.green700;
export const noticeTextLight = colorPalette.green500;
export const noticeTextLight = colorPalette.green500;
export const noticeTextDark = colorPalette.green900;
export const noticeTextDark = colorPalette.green900;
export const noticeTextMenu = colorPalette.green200;
export const noticeTextMenu = colorPalette.green200;
export const noticeBorder = colorPalette.green500;
export const noticeBorder = colorPalette.green500;
export const warningBackground = colorPalette.orange200;
export const warningBackground = colorPalette.orange200;
export const warningText = colorPalette.orange700;
export const warningText = colorPalette.orange700;
export const warningTextLight = colorPalette.orange500;
export const warningTextLight = colorPalette.orange500;
export const warningTextDark = colorPalette.orange900;
export const warningTextDark = colorPalette.orange900;
export const warningBorder = colorPalette.orange500;
export const warningBorder = colorPalette.orange500;
export const errorBackground = colorPalette.red100;
export const errorBackground = colorPalette.red100;
export const errorText = colorPalette.red500;
export const errorText = colorPalette.red500;
export const errorTextDark = colorPalette.red700;
export const errorTextDark = colorPalette.red700;
export const errorTextDarker = colorPalette.red900;
export const errorTextDarker = colorPalette.red900;
export const errorTextMenu = colorPalette.red200;
export const errorTextMenu = colorPalette.red200;
export const errorBorder = colorPalette.red500;
export const errorBorder = colorPalette.red500;
export const upcomingBackground = colorPalette.purple100;
export const upcomingBackground = colorPalette.purple100;
export const upcomingText = colorPalette.purple700;
export const upcomingText = colorPalette.purple700;
export const upcomingBorder = colorPalette.purple500;
export const upcomingBorder = colorPalette.purple500;
export const formLabelText = colorPalette.blue600;
export const formLabelText = colorPalette.blue600;
export const formLabelBackground = colorPalette.blue200;
export const formLabelBackground = colorPalette.blue200;
export const formInputBackground = colorPalette.navy50;
export const formInputBackground = colorPalette.navy50;
export const formInputBackgroundSelected = colorPalette.white;
export const formInputBackgroundSelected = colorPalette.white;
export const formInputBackgroundSelection = colorPalette.purple500;
export const formInputBackgroundSelection = colorPalette.purple500;
export const formInputBorder = colorPalette.navy150;
export const formInputBorder = colorPalette.navy150;
export const formInputTextReadOnlySelection = colorPalette.navy50;
export const formInputTextReadOnlySelection = colorPalette.navy50;
export const formInputBorderSelected = colorPalette.purple500;
export const formInputBorderSelected = colorPalette.purple500;
export const formInputText = colorPalette.navy900;
export const formInputText = colorPalette.navy900;
export const formInputTextSelected = colorPalette.navy50;
export const formInputTextSelected = colorPalette.navy50;
export const formInputTextPlaceholder = colorPalette.navy300;
export const formInputTextPlaceholder = colorPalette.navy300;
export const formInputTextPlaceholderSelected = colorPalette.navy200;
export const formInputTextPlaceholderSelected = colorPalette.navy200;
export const formInputTextSelection = colorPalette.navy100;
export const formInputTextSelection = colorPalette.navy100;
export const formInputShadowSelected = colorPalette.purple300;
export const formInputShadowSelected = colorPalette.purple300;
export const formInputTextHighlight = colorPalette.purple200;
export const formInputTextHighlight = colorPalette.purple200;
export const checkboxText = tableBackground;
export const checkboxText = tableBackground;
export const checkboxBackgroundSelected = colorPalette.blue500;
export const checkboxBackgroundSelected = colorPalette.blue500;
export const checkboxBorderSelected = colorPalette.blue500;
export const checkboxBorderSelected = colorPalette.blue500;
export const checkboxShadowSelected = colorPalette.blue300;
export const checkboxShadowSelected = colorPalette.blue300;
export const checkboxToggleBackground = colorPalette.gray400;
export const checkboxToggleBackground = colorPalette.gray400;
export const checkboxToggleBackgroundSelected = colorPalette.purple600;
export const checkboxToggleBackgroundSelected = colorPalette.purple600;
export const checkboxToggleDisabled = colorPalette.gray200;
export const checkboxToggleDisabled = colorPalette.gray200;
export const pillBackground = colorPalette.navy150;
export const pillBackground = colorPalette.navy150;
export const pillBackgroundLight = colorPalette.navy50;
export const pillBackgroundLight = colorPalette.navy50;
export const pillText = colorPalette.navy800;
export const pillText = colorPalette.navy800;
export const pillTextHighlighted = colorPalette.purple600;
export const pillTextHighlighted = colorPalette.purple600;
export const pillBorder = colorPalette.navy150;
export const pillBorder = colorPalette.navy150;
export const pillBorderDark = colorPalette.navy300;
export const pillBorderDark = colorPalette.navy300;
export const pillBackgroundSelected = colorPalette.blue150;
export const pillBackgroundSelected = colorPalette.blue150;
export const pillTextSelected = colorPalette.blue900;
export const pillTextSelected = colorPalette.blue900;
export const pillBorderSelected = colorPalette.purple500;
export const pillBorderSelected = colorPalette.purple500;
export const pillTextSubdued = colorPalette.navy200;
export const pillTextSubdued = colorPalette.navy200;
export const reportsRed = colorPalette.red300;
export const reportsRed = colorPalette.red300;
export const reportsBlue = colorPalette.blue400;
export const reportsBlue = colorPalette.blue400;
export const reportsGreen = colorPalette.green400;
export const reportsGreen = colorPalette.green400;
export const reportsGray = colorPalette.gray400;
export const reportsGray = colorPalette.gray400;
export const reportsLabel = colorPalette.navy900;
export const reportsLabel = colorPalette.navy900;
export const reportsInnerLabel = colorPalette.navy800;
export const reportsInnerLabel = colorPalette.navy800;
export const reportsNumberPositive = numberPositive;
export const reportsNumberPositive = numberPositive;
export const reportsNumberNegative = numberNegative;
export const reportsNumberNegative = numberNegative;
export const reportsNumberNeutral = numberNeutral;
export const reportsNumberNeutral = numberNeutral;
export const reportsChartFill = reportsNumberPositive;
export const reportsChartFill = reportsNumberPositive;
export const noteTagBackground = colorPalette.purple125;
export const noteTagBackground = colorPalette.purple125;
export const noteTagBackgroundHover = colorPalette.purple150;
export const noteTagBackgroundHover = colorPalette.purple150;
export const noteTagDefault = colorPalette.purple125;
export const noteTagDefault = colorPalette.purple125;
export const noteTagText = colorPalette.black;
export const noteTagText = colorPalette.black;
export const budgetCurrentMonth = tableBackground;
export const budgetCurrentMonth = tableBackground;
export const budgetOtherMonth = colorPalette.gray50;
export const budgetOtherMonth = colorPalette.gray50;
export const budgetHeaderCurrentMonth = budgetOtherMonth;
export const budgetHeaderCurrentMonth = budgetOtherMonth;
export const budgetHeaderOtherMonth = colorPalette.gray80;
export const budgetHeaderOtherMonth = colorPalette.gray80;
export const floatingActionBarBackground = colorPalette.purple400;
export const floatingActionBarBackground = colorPalette.purple400;
export const floatingActionBarBorder = floatingActionBarBackground;
export const floatingActionBarBorder = floatingActionBarBackground;
export const floatingActionBarText = colorPalette.navy50;
export const floatingActionBarText = colorPalette.navy50;
export const tooltipText = colorPalette.navy900;
export const tooltipText = colorPalette.navy900;
複製
已複製
複製
已複製
export const tooltipBackground = colorPalette.
navy50
;
export const tooltipBackground = colorPalette.
white
;
export const tooltipBorder = colorPalette.navy150;
export const tooltipBorder = colorPalette.navy150;
export const calendarCellBackground = colorPalette.navy100;
export const calendarCellBackground = colorPalette.navy100;
export const overlayBackground = 'rgba(0, 0, 0, 0.3)';
export const overlayBackground = 'rgba(0, 0, 0, 0.3)';
// Chart colors - Qualitative scale (9 colors)
// Chart colors - Qualitative scale (9 colors)
export const chartQual1 = colorPalette.chartQual1;
export const chartQual1 = colorPalette.chartQual1;
export const chartQual2 = colorPalette.chartQual2;
export const chartQual2 = colorPalette.chartQual2;
export const chartQual3 = colorPalette.chartQual3;
export const chartQual3 = colorPalette.chartQual3;
export const chartQual4 = colorPalette.chartQual4;
export const chartQual4 = colorPalette.chartQual4;
export const chartQual5 = colorPalette.chartQual5;
export const chartQual5 = colorPalette.chartQual5;
export const chartQual6 = colorPalette.chartQual6;
export const chartQual6 = colorPalette.chartQual6;
export const chartQual7 = colorPalette.chartQual7;
export const chartQual7 = colorPalette.chartQual7;
export const chartQual8 = colorPalette.chartQual8;
export const chartQual8 = colorPalette.chartQual8;
export const chartQual9 = colorPalette.chartQual9;
export const chartQual9 = colorPalette.chartQual9;
已保存差異
原始文本
開啟檔案
import * as colorPalette from '@desktop-client/style/palette'; export const pageBackground = colorPalette.navy100; export const pageBackgroundModalActive = colorPalette.navy200; export const pageBackgroundTopLeft = colorPalette.navy100; export const pageBackgroundBottomRight = colorPalette.blue150; export const pageBackgroundLineTop = colorPalette.white; export const pageBackgroundLineMid = colorPalette.navy100; export const pageBackgroundLineBottom = colorPalette.blue150; export const pageText = '#272630'; export const pageTextLight = colorPalette.navy500; export const pageTextSubdued = colorPalette.navy300; export const pageTextDark = colorPalette.navy800; export const pageTextPositive = colorPalette.purple600; export const pageTextLink = colorPalette.blue600; export const pageTextLinkLight = colorPalette.blue300; export const cardBackground = colorPalette.white; export const cardBorder = colorPalette.purple700; export const cardShadow = colorPalette.navy700; export const tableBackground = colorPalette.white; export const tableRowBackgroundHover = colorPalette.navy50; export const tableText = pageText; export const tableTextLight = colorPalette.navy400; export const tableTextSubdued = colorPalette.navy100; export const tableTextSelected = colorPalette.navy700; export const tableTextHover = colorPalette.navy900; export const tableTextInactive = colorPalette.navy500; export const tableHeaderText = colorPalette.navy600; export const tableHeaderBackground = colorPalette.white; export const tableBorder = colorPalette.navy100; export const tableBorderSelected = colorPalette.purple500; export const tableBorderHover = colorPalette.purple400; export const tableBorderSeparator = colorPalette.navy400; export const tableRowBackgroundHighlight = colorPalette.blue150; export const tableRowBackgroundHighlightText = colorPalette.navy700; export const tableRowHeaderBackground = colorPalette.navy50; export const tableRowHeaderText = colorPalette.navy800; export const numberPositive = colorPalette.green700; export const numberNegative = colorPalette.red500; export const numberNeutral = colorPalette.navy100; export const budgetNumberNegative = numberNegative; export const budgetNumberZero = tableTextSubdued; export const budgetNumberNeutral = tableText; export const budgetNumberPositive = budgetNumberNeutral; export const templateNumberFunded = numberPositive; export const templateNumberUnderFunded = colorPalette.orange700; export const toBudgetPositive = numberPositive; export const toBudgetZero = numberPositive; export const toBudgetNegative = budgetNumberNegative; export const sidebarBackground = colorPalette.navy900; export const sidebarItemBackgroundPending = colorPalette.orange200; export const sidebarItemBackgroundPositive = colorPalette.green500; export const sidebarItemBackgroundFailed = colorPalette.red300; export const sidebarItemBackgroundHover = colorPalette.navy800; export const sidebarItemAccentSelected = colorPalette.purple200; export const sidebarItemText = colorPalette.navy150; export const sidebarItemTextSelected = colorPalette.purple200; export const sidebarBudgetName = colorPalette.navy150; export const menuBackground = colorPalette.white; export const menuItemBackground = colorPalette.navy50; export const menuItemBackgroundHover = colorPalette.navy100; export const menuItemText = colorPalette.navy900; export const menuItemTextHover = menuItemText; export const menuItemTextSelected = colorPalette.purple300; export const menuItemTextHeader = colorPalette.navy400; export const menuBorder = colorPalette.navy100; export const menuBorderHover = colorPalette.purple100; export const menuKeybindingText = colorPalette.navy400; export const menuAutoCompleteBackground = colorPalette.navy900; export const menuAutoCompleteBackgroundHover = colorPalette.navy600; export const menuAutoCompleteText = colorPalette.white; export const menuAutoCompleteTextHeader = colorPalette.orange150; export const menuAutoCompleteItemText = menuAutoCompleteText; export const modalBackground = colorPalette.white; export const modalBorder = colorPalette.white; export const mobileHeaderBackground = colorPalette.purple400; export const mobileHeaderText = colorPalette.navy50; export const mobileHeaderTextSubdued = colorPalette.gray200; export const mobileHeaderTextHover = 'rgba(200, 200, 200, .15)'; export const mobilePageBackground = colorPalette.navy50; export const mobileNavBackground = colorPalette.white; export const mobileNavItem = colorPalette.gray300; export const mobileNavItemSelected = colorPalette.purple500; export const mobileAccountShadow = colorPalette.navy300; export const mobileAccountText = colorPalette.blue800; export const mobileTransactionSelected = colorPalette.purple500; // Mobile view themes (for the top bar) export const mobileViewTheme = mobileHeaderBackground; export const mobileConfigServerViewTheme = colorPalette.purple500; export const markdownNormal = colorPalette.purple150; export const markdownDark = colorPalette.purple400; export const markdownLight = colorPalette.purple100; // Button export const buttonMenuText = colorPalette.navy100; export const buttonMenuTextHover = colorPalette.navy50; export const buttonMenuBackground = 'transparent'; export const buttonMenuBackgroundHover = 'rgba(200, 200, 200, .25)'; export const buttonMenuBorder = colorPalette.navy500; export const buttonMenuSelectedText = colorPalette.green800; export const buttonMenuSelectedTextHover = colorPalette.orange800; export const buttonMenuSelectedBackground = colorPalette.orange200; export const buttonMenuSelectedBackgroundHover = colorPalette.orange300; export const buttonMenuSelectedBorder = buttonMenuSelectedBackground; export const buttonPrimaryText = colorPalette.white; export const buttonPrimaryTextHover = buttonPrimaryText; export const buttonPrimaryBackground = colorPalette.purple500; export const buttonPrimaryBackgroundHover = buttonPrimaryBackground; export const buttonPrimaryBorder = buttonPrimaryBackground; export const buttonPrimaryShadow = 'rgba(0, 0, 0, 0.3)'; export const buttonPrimaryDisabledText = colorPalette.white; export const buttonPrimaryDisabledBackground = colorPalette.navy300; export const buttonPrimaryDisabledBorder = buttonPrimaryDisabledBackground; export const buttonNormalText = colorPalette.navy900; export const buttonNormalTextHover = buttonNormalText; export const buttonNormalBackground = colorPalette.white; export const buttonNormalBackgroundHover = buttonNormalBackground; export const buttonNormalBorder = colorPalette.navy150; export const buttonNormalShadow = 'rgba(0, 0, 0, 0.2)'; export const buttonNormalSelectedText = colorPalette.white; export const buttonNormalSelectedBackground = colorPalette.blue600; export const buttonNormalDisabledText = colorPalette.navy300; export const buttonNormalDisabledBackground = buttonNormalBackground; export const buttonNormalDisabledBorder = buttonNormalBorder; export const calendarText = colorPalette.navy50; export const calendarBackground = colorPalette.navy900; export const calendarItemText = colorPalette.navy150; export const calendarItemBackground = colorPalette.navy800; export const calendarSelectedBackground = colorPalette.navy500; export const buttonBareText = buttonNormalText; export const buttonBareTextHover = buttonNormalText; export const buttonBareBackground = 'transparent'; export const buttonBareBackgroundHover = 'rgba(100, 100, 100, .15)'; export const buttonBareBackgroundActive = 'rgba(100, 100, 100, .25)'; export const buttonBareDisabledText = buttonNormalDisabledText; export const buttonBareDisabledBackground = buttonBareBackground; export const noticeBackground = colorPalette.green150; export const noticeBackgroundLight = colorPalette.green100; export const noticeBackgroundDark = colorPalette.green500; export const noticeText = colorPalette.green700; export const noticeTextLight = colorPalette.green500; export const noticeTextDark = colorPalette.green900; export const noticeTextMenu = colorPalette.green200; export const noticeBorder = colorPalette.green500; export const warningBackground = colorPalette.orange200; export const warningText = colorPalette.orange700; export const warningTextLight = colorPalette.orange500; export const warningTextDark = colorPalette.orange900; export const warningBorder = colorPalette.orange500; export const errorBackground = colorPalette.red100; export const errorText = colorPalette.red500; export const errorTextDark = colorPalette.red700; export const errorTextDarker = colorPalette.red900; export const errorTextMenu = colorPalette.red200; export const errorBorder = colorPalette.red500; export const upcomingBackground = colorPalette.purple100; export const upcomingText = colorPalette.purple700; export const upcomingBorder = colorPalette.purple500; export const formLabelText = colorPalette.blue600; export const formLabelBackground = colorPalette.blue200; export const formInputBackground = colorPalette.navy50; export const formInputBackgroundSelected = colorPalette.white; export const formInputBackgroundSelection = colorPalette.purple500; export const formInputBorder = colorPalette.navy150; export const formInputTextReadOnlySelection = colorPalette.navy50; export const formInputBorderSelected = colorPalette.purple500; export const formInputText = colorPalette.navy900; export const formInputTextSelected = colorPalette.navy50; export const formInputTextPlaceholder = colorPalette.navy300; export const formInputTextPlaceholderSelected = colorPalette.navy200; export const formInputTextSelection = colorPalette.navy100; export const formInputShadowSelected = colorPalette.purple300; export const formInputTextHighlight = colorPalette.purple200; export const checkboxText = tableBackground; export const checkboxBackgroundSelected = colorPalette.blue500; export const checkboxBorderSelected = colorPalette.blue500; export const checkboxShadowSelected = colorPalette.blue300; export const checkboxToggleBackground = colorPalette.gray400; export const checkboxToggleBackgroundSelected = colorPalette.purple600; export const checkboxToggleDisabled = colorPalette.gray200; export const pillBackground = colorPalette.navy150; export const pillBackgroundLight = colorPalette.navy50; export const pillText = colorPalette.navy800; export const pillTextHighlighted = colorPalette.purple600; export const pillBorder = colorPalette.navy150; export const pillBorderDark = colorPalette.navy300; export const pillBackgroundSelected = colorPalette.blue150; export const pillTextSelected = colorPalette.blue900; export const pillBorderSelected = colorPalette.purple500; export const pillTextSubdued = colorPalette.navy200; export const reportsRed = colorPalette.red300; export const reportsBlue = colorPalette.blue400; export const reportsGreen = colorPalette.green400; export const reportsGray = colorPalette.gray400; export const reportsLabel = colorPalette.navy900; export const reportsInnerLabel = colorPalette.navy800; export const reportsNumberPositive = numberPositive; export const reportsNumberNegative = numberNegative; export const reportsNumberNeutral = numberNeutral; export const reportsChartFill = reportsNumberPositive; export const noteTagBackground = colorPalette.purple125; export const noteTagBackgroundHover = colorPalette.purple150; export const noteTagDefault = colorPalette.purple125; export const noteTagText = colorPalette.black; export const budgetCurrentMonth = tableBackground; export const budgetOtherMonth = colorPalette.gray50; export const budgetHeaderCurrentMonth = budgetOtherMonth; export const budgetHeaderOtherMonth = colorPalette.gray80; export const floatingActionBarBackground = colorPalette.purple400; export const floatingActionBarBorder = floatingActionBarBackground; export const floatingActionBarText = colorPalette.navy50; export const tooltipText = colorPalette.navy900; export const tooltipBackground = colorPalette.navy50; export const tooltipBorder = colorPalette.navy150; export const calendarCellBackground = colorPalette.navy100; export const overlayBackground = 'rgba(0, 0, 0, 0.3)'; // Chart colors - Qualitative scale (9 colors) export const chartQual1 = colorPalette.chartQual1; export const chartQual2 = colorPalette.chartQual2; export const chartQual3 = colorPalette.chartQual3; export const chartQual4 = colorPalette.chartQual4; export const chartQual5 = colorPalette.chartQual5; export const chartQual6 = colorPalette.chartQual6; export const chartQual7 = colorPalette.chartQual7; export const chartQual8 = colorPalette.chartQual8; export const chartQual9 = colorPalette.chartQual9;
更改後文本
開啟檔案
import * as colorPalette from '@desktop-client/style/palette'; export const pageBackground = colorPalette.navy100; export const pageBackgroundModalActive = colorPalette.navy200; export const pageBackgroundTopLeft = colorPalette.navy100; export const pageBackgroundBottomRight = colorPalette.blue150; export const pageBackgroundLineTop = colorPalette.white; export const pageBackgroundLineMid = colorPalette.navy100; export const pageBackgroundLineBottom = colorPalette.blue150; export const pageText = '#272630'; export const pageTextLight = colorPalette.navy500; export const pageTextSubdued = colorPalette.navy300; export const pageTextDark = colorPalette.navy800; export const pageTextPositive = colorPalette.purple600; export const pageTextLink = colorPalette.blue600; export const pageTextLinkLight = colorPalette.blue300; export const cardBackground = colorPalette.white; export const cardBorder = colorPalette.purple700; export const cardShadow = colorPalette.navy700; export const tableBackground = colorPalette.white; export const tableRowBackgroundHover = colorPalette.navy50; export const tableText = pageText; export const tableTextLight = colorPalette.navy400; export const tableTextSubdued = colorPalette.navy100; export const tableTextSelected = colorPalette.navy700; export const tableTextHover = colorPalette.navy900; export const tableTextInactive = colorPalette.navy500; export const tableHeaderText = colorPalette.navy600; export const tableHeaderBackground = colorPalette.white; export const tableBorder = colorPalette.navy100; export const tableBorderSelected = colorPalette.purple500; export const tableBorderHover = colorPalette.purple400; export const tableBorderSeparator = colorPalette.navy400; export const tableRowBackgroundHighlight = colorPalette.blue150; export const tableRowBackgroundHighlightText = colorPalette.navy700; export const tableRowHeaderBackground = colorPalette.navy50; export const tableRowHeaderText = colorPalette.navy800; export const numberPositive = colorPalette.green700; export const numberNegative = colorPalette.red500; export const numberNeutral = colorPalette.navy100; export const budgetNumberNegative = numberNegative; export const budgetNumberZero = tableTextSubdued; export const budgetNumberNeutral = tableText; export const budgetNumberPositive = budgetNumberNeutral; export const templateNumberFunded = numberPositive; export const templateNumberUnderFunded = colorPalette.orange700; export const toBudgetPositive = numberPositive; export const toBudgetZero = numberPositive; export const toBudgetNegative = budgetNumberNegative; export const sidebarBackground = colorPalette.navy900; export const sidebarItemBackgroundPending = colorPalette.orange200; export const sidebarItemBackgroundPositive = colorPalette.green500; export const sidebarItemBackgroundFailed = colorPalette.red300; export const sidebarItemBackgroundHover = colorPalette.navy800; export const sidebarItemAccentSelected = colorPalette.purple200; export const sidebarItemText = colorPalette.navy150; export const sidebarItemTextSelected = colorPalette.purple200; export const sidebarBudgetName = colorPalette.navy150; export const menuBackground = colorPalette.white; export const menuItemBackground = colorPalette.navy50; export const menuItemBackgroundHover = colorPalette.navy100; export const menuItemText = colorPalette.navy900; export const menuItemTextHover = menuItemText; export const menuItemTextSelected = colorPalette.purple300; export const menuItemTextHeader = colorPalette.navy400; export const menuBorder = colorPalette.navy100; export const menuBorderHover = colorPalette.purple100; export const menuKeybindingText = colorPalette.navy400; export const menuAutoCompleteBackground = colorPalette.navy900; export const menuAutoCompleteBackgroundHover = colorPalette.navy600; export const menuAutoCompleteText = colorPalette.white; export const menuAutoCompleteTextHover = colorPalette.green150; export const menuAutoCompleteTextHeader = colorPalette.orange150; export const menuAutoCompleteItemTextHover = menuAutoCompleteText; export const menuAutoCompleteItemText = menuAutoCompleteText; export const modalBackground = colorPalette.white; export const modalBorder = colorPalette.white; export const mobileHeaderBackground = colorPalette.purple400; export const mobileHeaderText = colorPalette.navy50; export const mobileHeaderTextSubdued = colorPalette.gray200; export const mobileHeaderTextHover = 'rgba(200, 200, 200, .15)'; export const mobilePageBackground = colorPalette.navy50; export const mobileNavBackground = colorPalette.white; export const mobileNavItem = colorPalette.gray300; export const mobileNavItemSelected = colorPalette.purple500; export const mobileAccountShadow = colorPalette.navy300; export const mobileAccountText = colorPalette.blue800; export const mobileTransactionSelected = colorPalette.purple500; // Mobile view themes (for the top bar) export const mobileViewTheme = mobileHeaderBackground; export const mobileConfigServerViewTheme = colorPalette.purple500; export const markdownNormal = colorPalette.purple150; export const markdownDark = colorPalette.purple400; export const markdownLight = colorPalette.purple100; // Button export const buttonMenuText = colorPalette.navy100; export const buttonMenuTextHover = colorPalette.navy50; export const buttonMenuBackground = 'transparent'; export const buttonMenuBackgroundHover = 'rgba(200, 200, 200, .25)'; export const buttonMenuBorder = colorPalette.navy500; export const buttonMenuSelectedText = colorPalette.green800; export const buttonMenuSelectedTextHover = colorPalette.orange800; export const buttonMenuSelectedBackground = colorPalette.orange200; export const buttonMenuSelectedBackgroundHover = colorPalette.orange300; export const buttonMenuSelectedBorder = buttonMenuSelectedBackground; export const buttonPrimaryText = colorPalette.white; export const buttonPrimaryTextHover = buttonPrimaryText; export const buttonPrimaryBackground = colorPalette.purple500; export const buttonPrimaryBackgroundHover = colorPalette.purple300; export const buttonPrimaryBorder = buttonPrimaryBackground; export const buttonPrimaryShadow = 'rgba(0, 0, 0, 0.3)'; export const buttonPrimaryDisabledText = colorPalette.white; export const buttonPrimaryDisabledBackground = colorPalette.navy300; export const buttonPrimaryDisabledBorder = buttonPrimaryDisabledBackground; export const buttonNormalText = colorPalette.navy900; export const buttonNormalTextHover = buttonNormalText; export const buttonNormalBackground = colorPalette.white; export const buttonNormalBackgroundHover = buttonNormalBackground; export const buttonNormalBorder = colorPalette.navy150; export const buttonNormalShadow = 'rgba(0, 0, 0, 0.2)'; export const buttonNormalSelectedText = colorPalette.white; export const buttonNormalSelectedBackground = colorPalette.blue600; export const buttonNormalDisabledText = colorPalette.navy300; export const buttonNormalDisabledBackground = buttonNormalBackground; export const buttonNormalDisabledBorder = buttonNormalBorder; export const calendarText = colorPalette.navy50; export const calendarBackground = colorPalette.navy900; export const calendarItemText = colorPalette.navy150; export const calendarItemBackground = colorPalette.navy800; export const calendarSelectedBackground = colorPalette.navy500; export const buttonBareText = buttonNormalText; export const buttonBareTextHover = buttonNormalText; export const buttonBareBackground = 'transparent'; export const buttonBareBackgroundHover = 'rgba(100, 100, 100, .15)'; export const buttonBareBackgroundActive = 'rgba(100, 100, 100, .25)'; export const buttonBareDisabledText = buttonNormalDisabledText; export const buttonBareDisabledBackground = buttonBareBackground; export const noticeBackground = colorPalette.green150; export const noticeBackgroundLight = colorPalette.green100; export const noticeBackgroundDark = colorPalette.green500; export const noticeText = colorPalette.green700; export const noticeTextLight = colorPalette.green500; export const noticeTextDark = colorPalette.green900; export const noticeTextMenu = colorPalette.green200; export const noticeBorder = colorPalette.green500; export const warningBackground = colorPalette.orange200; export const warningText = colorPalette.orange700; export const warningTextLight = colorPalette.orange500; export const warningTextDark = colorPalette.orange900; export const warningBorder = colorPalette.orange500; export const errorBackground = colorPalette.red100; export const errorText = colorPalette.red500; export const errorTextDark = colorPalette.red700; export const errorTextDarker = colorPalette.red900; export const errorTextMenu = colorPalette.red200; export const errorBorder = colorPalette.red500; export const upcomingBackground = colorPalette.purple100; export const upcomingText = colorPalette.purple700; export const upcomingBorder = colorPalette.purple500; export const formLabelText = colorPalette.blue600; export const formLabelBackground = colorPalette.blue200; export const formInputBackground = colorPalette.navy50; export const formInputBackgroundSelected = colorPalette.white; export const formInputBackgroundSelection = colorPalette.purple500; export const formInputBorder = colorPalette.navy150; export const formInputTextReadOnlySelection = colorPalette.navy50; export const formInputBorderSelected = colorPalette.purple500; export const formInputText = colorPalette.navy900; export const formInputTextSelected = colorPalette.navy50; export const formInputTextPlaceholder = colorPalette.navy300; export const formInputTextPlaceholderSelected = colorPalette.navy200; export const formInputTextSelection = colorPalette.navy100; export const formInputShadowSelected = colorPalette.purple300; export const formInputTextHighlight = colorPalette.purple200; export const checkboxText = tableBackground; export const checkboxBackgroundSelected = colorPalette.blue500; export const checkboxBorderSelected = colorPalette.blue500; export const checkboxShadowSelected = colorPalette.blue300; export const checkboxToggleBackground = colorPalette.gray400; export const checkboxToggleBackgroundSelected = colorPalette.purple600; export const checkboxToggleDisabled = colorPalette.gray200; export const pillBackground = colorPalette.navy150; export const pillBackgroundLight = colorPalette.navy50; export const pillText = colorPalette.navy800; export const pillTextHighlighted = colorPalette.purple600; export const pillBorder = colorPalette.navy150; export const pillBorderDark = colorPalette.navy300; export const pillBackgroundSelected = colorPalette.blue150; export const pillTextSelected = colorPalette.blue900; export const pillBorderSelected = colorPalette.purple500; export const pillTextSubdued = colorPalette.navy200; export const reportsRed = colorPalette.red300; export const reportsBlue = colorPalette.blue400; export const reportsGreen = colorPalette.green400; export const reportsGray = colorPalette.gray400; export const reportsLabel = colorPalette.navy900; export const reportsInnerLabel = colorPalette.navy800; export const reportsNumberPositive = numberPositive; export const reportsNumberNegative = numberNegative; export const reportsNumberNeutral = numberNeutral; export const reportsChartFill = reportsNumberPositive; export const noteTagBackground = colorPalette.purple125; export const noteTagBackgroundHover = colorPalette.purple150; export const noteTagDefault = colorPalette.purple125; export const noteTagText = colorPalette.black; export const budgetCurrentMonth = tableBackground; export const budgetOtherMonth = colorPalette.gray50; export const budgetHeaderCurrentMonth = budgetOtherMonth; export const budgetHeaderOtherMonth = colorPalette.gray80; export const floatingActionBarBackground = colorPalette.purple400; export const floatingActionBarBorder = floatingActionBarBackground; export const floatingActionBarText = colorPalette.navy50; export const tooltipText = colorPalette.navy900; export const tooltipBackground = colorPalette.white; export const tooltipBorder = colorPalette.navy150; export const calendarCellBackground = colorPalette.navy100; export const overlayBackground = 'rgba(0, 0, 0, 0.3)'; // Chart colors - Qualitative scale (9 colors) export const chartQual1 = colorPalette.chartQual1; export const chartQual2 = colorPalette.chartQual2; export const chartQual3 = colorPalette.chartQual3; export const chartQual4 = colorPalette.chartQual4; export const chartQual5 = colorPalette.chartQual5; export const chartQual6 = colorPalette.chartQual6; export const chartQual7 = colorPalette.chartQual7; export const chartQual8 = colorPalette.chartQual8; export const chartQual9 = colorPalette.chartQual9;
尋找差異