From 41569876ada31ae8e3c014b690ec0d57b5324e3f Mon Sep 17 00:00:00 2001
From: Tomasz Kajtoch <tomek@kajto.ch>
Date: Tue, 29 Oct 2024 21:11:45 +0100
Subject: [PATCH] docs: fix broken imports in color utilities (#8106)

---
 .../colors/utilities/use_eui_background_color_css_preview.tsx  | 3 +--
 .../colors/utilities/use_eui_background_color_preview.tsx      | 3 +--
 .../colors/utilities/use_eui_background_color_table.tsx        | 2 +-
 3 files changed, 3 insertions(+), 5 deletions(-)

diff --git a/packages/website/docs/components/theming/colors/utilities/use_eui_background_color_css_preview.tsx b/packages/website/docs/components/theming/colors/utilities/use_eui_background_color_css_preview.tsx
index 895ad86c9fb..0d55dd390ed 100644
--- a/packages/website/docs/components/theming/colors/utilities/use_eui_background_color_css_preview.tsx
+++ b/packages/website/docs/components/theming/colors/utilities/use_eui_background_color_css_preview.tsx
@@ -1,5 +1,4 @@
-import { useEuiBackgroundColorCSS, useEuiPaddingCSS } from '@elastic/eui';
-import { useEuiBackgroundColor } from '@elastic/eui/src/global_styling/mixins/_color';
+import { useEuiBackgroundColorCSS, useEuiPaddingCSS, useEuiBackgroundColor } from '@elastic/eui';
 
 export const UseEuiBackgroundColorCSSPreview = () => {
   const accentStyles = useEuiBackgroundColorCSS().accent;
diff --git a/packages/website/docs/components/theming/colors/utilities/use_eui_background_color_preview.tsx b/packages/website/docs/components/theming/colors/utilities/use_eui_background_color_preview.tsx
index 64fd05d2d7f..2367ac9b54a 100644
--- a/packages/website/docs/components/theming/colors/utilities/use_eui_background_color_preview.tsx
+++ b/packages/website/docs/components/theming/colors/utilities/use_eui_background_color_preview.tsx
@@ -1,6 +1,5 @@
-import { useEuiBackgroundColor } from '@elastic/eui/src/global_styling/mixins/_color';
+import { useEuiBackgroundColor, useEuiPaddingCSS } from '@elastic/eui';
 import { css } from '@emotion/react';
-import { useEuiPaddingCSS } from '@elastic/eui/src/global_styling/mixins/_padding';
 
 export const UseEuiBackgroundColorPreview = () => {
   return (
diff --git a/packages/website/docs/components/theming/colors/utilities/use_eui_background_color_table.tsx b/packages/website/docs/components/theming/colors/utilities/use_eui_background_color_table.tsx
index b065f93e59c..04f10843091 100644
--- a/packages/website/docs/components/theming/colors/utilities/use_eui_background_color_table.tsx
+++ b/packages/website/docs/components/theming/colors/utilities/use_eui_background_color_table.tsx
@@ -5,9 +5,9 @@ import {
   EuiSpacer,
   EuiButtonGroup,
   useEuiTheme,
+  euiBackgroundColor,
 } from '@elastic/eui';
 import { ColorsTable } from '../colors_table';
-import { euiBackgroundColor } from '@elastic/eui/src/global_styling/mixins/_color';
 
 const colors = [
   'transparent',