Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[8.9] Order Emotion styles before Sass styles (#161592) #161877

Closed
wants to merge 1 commit into from
+11 −6
Closed

[8.9] Order Emotion styles before Sass styles (#161592) #161877

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/core/rendering/core-rendering-server-internal/src/views/template.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,8 +54,8 @@ export const Template: FunctionComponent<Props> = ({
<meta name="color-scheme" content="light dark" />
{/* Inject EUI reset and global styles before all other component styles */}
<meta name={EUI_STYLES_GLOBAL} />
<Styles darkMode={darkMode} stylesheetPaths={stylesheetPaths} />
<meta name="emotion" />
<Styles darkMode={darkMode} stylesheetPaths={stylesheetPaths} />
{/* Inject stylesheets into the <head> before scripts so that KP plugins with bundled styles will override them */}
<meta name="add-styles-here" />
<meta name="add-scripts-here" />
Expand Down
3 changes: 1 addition & 2 deletions packages/kbn-storybook/templates/index.ejs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />

<meta name="eui-global" />
<meta name="emotion" />

<!-- Added for Kibana shared dependencies -->
<script>
Expand All @@ -26,8 +27,6 @@
<link id="eui-theme-css" href="kbn-ui-shared-deps-npm.v8.light.css" rel="stylesheet" />
<!-- -->

<meta name="emotion" />

<% if (typeof headHtmlSnippet !== 'undefined') { %> <%= headHtmlSnippet %> <% } %> <%
htmlWebpackPlugin.files.css.forEach(file => { %>
<link href="<%= file %>" rel="stylesheet" />
Expand Down
6 changes: 4 additions & 2 deletions src/plugins/unified_histogram/public/panels/panels_resizable.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ export const PanelsResizable = ({
[]
);
const resizeWithPortalsHackButtonCss = css`
z-index: 3;
z-index: 3 !important; // !important can be removed once EuiResizableButton is converted to Emotion
`;
const resizeWithPortalsHackOverlayCss = css`
position: absolute;
Expand Down Expand Up @@ -164,7 +164,9 @@ export const PanelsResizable = ({

const { euiTheme } = useEuiTheme();
const buttonCss = css`
&& {
// The selectors here are intended to override EuiResizableButtons's Sass styles
// it can be removed once EuiResizableButton has been converted to Emotion
&.euiResizableButton.euiResizableButton--vertical {
margin-top: -${euiTheme.size.base};
margin-bottom: 0;
}
Expand Down
6 changes: 5 additions & 1 deletion x-pack/plugins/aiops/public/components/change_point_detection/change_points_table.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -116,7 +116,11 @@ export const ChangePointsTable: FC<ChangePointsTableProps> = ({
height: '80px',
truncateText: false,
valign: 'middle',
css: { display: 'block', padding: 0 },
css: {
// Extra specificity needed here to override Sass styles
// TODO: Can be removed once EuiTable has been converted to Emotion
['&.euiTableCellContent']: { display: 'block', padding: 0 },
},
render: (annotation: ChangePointAnnotation) => {
return <MiniChartPreview annotation={annotation} fieldConfig={fieldConfig} />;
},
Expand Down