Qual a maneira mais fácil de criar um tema claro usando um tema escuro com muita personalização

[hipp0]

Estou usando o tema Foundation com uma paleta escura que personalizei muito com CSS.

Gostaria de saber qual seria o método mais fácil para criar uma versão clara que siga todas as mesmas regras de CSS.

[Moin]

Você pode adicionar uma paleta de cores claras ao seu tema

Você pode atualizar as cores com base se o tema claro ou escuro está sendo usado:

@awesomerobot

Então, em color_definitions.scss você pode fazer:

$my-theme-color: dark-light-choose($primary, red);

:root {
  --my-theme-color: #{$my-theme-color};
}

e então você usaria a nova propriedade customizada que muda entre claro/escuro no seu tema:

body {
  color: var(--my-theme-color);
}

[hipp0]

Certo, então preciso ajustar cada alteração com o tema escuro ou claro (estou usando o escuro/claro padrão)

[Moin]

Depende. Você só precisa fazer isso se usou cores codificadas. Contanto que você se refira a cores como var(--primary-300) ou var(--danger), elas mudam automaticamente com base na paleta de cores.