Diff
checker
Texto
Texto
Imagens
Documentos
Excel
Pastas
Legal
Enterprise
Aplicativo para desktop
Preços
Fazer login
Baixar o Diffchecker Desktop
Comparar texto
Encontre a diferença entre dois arquivos de texto
Ferramentas
Histórico
Editor live
Ocultar espaços em branco
Recolher inalteradas
Sem quebra de linha
Layout
Dividido
Unificado
Nível de detalhe
Inteligente
Palavra
Caractere
Estilos de texto
Alterar aparência
Realce de sintaxe
Escolher sintaxe
Ignorar
Transformar texto
Ir à primeira mudança
Editar entrada
Diffchecker Desktop
A maneira mais segura de usar o Diffchecker. Obtenha o aplicativo Diffchecker Desktop: seus diffs nunca saem do seu computador!
Obter Desktop
Themes
Criado
há 4 meses
O diff nunca expira
Limpar
Exportar
Compartilhar
Explicar
2 remoções
Linhas
Total
Removido
Caracteres
Total
Removido
Para continuar usando este recurso, atualize para
Diff
checker
Pro
Ver preços
249 linhas
Copiar tudo
4 adições
Linhas
Total
Adicionado
Caracteres
Total
Adicionado
Para continuar usando este recurso, atualize para
Diff
checker
Pro
Ver preços
251 linhas
Copiar tudo
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;
Copiar
Copiado
Copiar
Copiado
export const menuAutoCompleteTextHover = colorPalette.green150;
export const menuAutoCompleteTextHeader = colorPalette.orange150;
export const menuAutoCompleteTextHeader = colorPalette.orange150;
Copiar
Copiado
Copiar
Copiado
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;
Copiar
Copiado
Copiar
Copiado
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;
Copiar
Copiado
Copiar
Copiado
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;
Diferenças salvas
Texto original
Abrir arquivo
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;
Texto alterado
Abrir arquivo
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;
Encontrar Diferença