fix(colors): fix transition on page load

Author: vault-developer

src/pages/home/sections/Configurator/Editor/Editor.styled.ts

@@ -7,29 +7,29 @@ export const EditorWrapper = styled.div(
 
 		.ace_layer.ace_gutter-layer {
 			background: ${theme.custom.colors.container};
-			transition: all ${theme.custom.colorTransition};
+			transition: background-color ${theme.custom.colorTransition};
 		}
 
 		.ace_gutter {
 			background: ${theme.custom.colors.onContainer.dim};
-			transition: all ${theme.custom.colorTransition};
+			transition: background-color ${theme.custom.colorTransition};
 		}
 
 		.selected_lines {
 			position: absolute;
 			background: ${theme.custom.colors.tertiary.normal};
-			transition: all ${theme.custom.colorTransition};
+			transition: background-color ${theme.custom.colorTransition};
 			opacity: 0.3;
 		}
 
 		.ace_gutter-active-line {
 			background: ${theme.custom.colors.onContainer.dim};
-			transition: all ${theme.custom.colorTransition};
+			transition: background-color ${theme.custom.colorTransition};
 		}
 
 		.ace_content {
 			background: ${theme.custom.colors.container};
-			transition: all ${theme.custom.colorTransition};
+			transition: background-color ${theme.custom.colorTransition};
 		}
 	`
 );

src/providers/StylesProvider.utils.ts

@@ -5,10 +5,14 @@ export const getGlobalStyles = ({ theme }: { theme: Theme }) => css`
 		font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
 		color: ${theme.custom.colors.onBackground};
 		background-color: ${theme.custom.colors.background};
-		transition: all ${theme.custom.colorTransition};
 		height: 100%;
 	}
 
+	body {
+		background-color: ${theme.custom.colors.background};
+		transition: background-color ${theme.custom.colorTransition};
+	}
+
 	div,
 	span,
 	p {