Diff
checker
Texte
Texte
Images
Documents
Excel
Dossiers
Legal
Enterprise
Application de bureau
Prix
Se connecter
Télécharger Diffchecker Desktop
Comparer le texte
Trouver la différence entre deux fichiers texte
Outils
Historique
Éditeur live
Masquer les espaces
Cacher identiques
Sans retour à la ligne
Vue
Divisé
Unifié
Niveau de précision
Intelligent
Mot
Caractère
Styles de texte
Modifier l’apparence
Coloration syntaxique
Choisir la syntaxe
Ignorer
Transformer le texte
Aller au premier écart
Modifier l'entrée
Diffchecker Desktop
La façon la plus sécurisée d'utiliser Diffchecker. Obtenez l'application Diffchecker Desktop : vos diffs ne quittent jamais votre ordinateur !
Obtenir Desktop
Themes
Créé
il y a 4 mois
Le diff n'expire jamais
Effacer
Exporter
Partager
Expliquer
2 suppressions
Lignes
Total
Supprimé
Caractères
Total
Supprimé
Pour continuer à utiliser cette fonctionnalité, passez à
Diff
checker
Pro
Voir les prix
249 lignes
Copier tout
4 ajouts
Lignes
Total
Ajouté
Caractères
Total
Ajouté
Pour continuer à utiliser cette fonctionnalité, passez à
Diff
checker
Pro
Voir les prix
251 lignes
Copier tout
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;
Copier
Copié
Copier
Copié
export const menuAutoCompleteTextHover = colorPalette.green150;
export const menuAutoCompleteTextHeader = colorPalette.orange150;
export const menuAutoCompleteTextHeader = colorPalette.orange150;
Copier
Copié
Copier
Copié
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;
Copier
Copié
Copier
Copié
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;
Copier
Copié
Copier
Copié
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;
Différences enregistrées
Texte d'origine
Ouvrir un fichier
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;
Texte modifié
Ouvrir un fichier
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;
Trouver la différence