Skip to content

Commit 080b20a

Browse files
authored
Ensure application CSS has priority over library CSS
Import our application CSS as the very last thing, so that it can properly override PatternFly variables. Before, our application CSS could land in the first third of dist/index.css *before* PatternFly's definitions, so that the latter overrode the former [1]. This is a long-standing bug in mini-css-extract-plugin ([2] and countless things that point to it) with `NODE_ENV=production` builds. As a workaround, make sure that app.scss is the absolutely last imported CSS, instead of "almost last". It is still conceptually correct for the application CSS to be able to override patternfly-4-overrides.scss. Closes #362 [1] https://github.com/martinpitt/performance-graphs/issues/10 [2] webpack-contrib/mini-css-extract-plugin#188
1 parent cfced19 commit 080b20a

File tree

2 files changed

+1
-1
lines changed

2 files changed

+1
-1
lines changed

src/app.jsx

-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@
2020
import cockpit from 'cockpit';
2121
import React from 'react';
2222
import { Alert, Card, CardTitle, CardBody } from '@patternfly/react-core';
23-
import './app.scss';
2423

2524
const _ = cockpit.gettext;
2625

src/index.js

+1
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,7 @@ import { Application } from './app.jsx';
3232
* the overrides will be correctly in the end of our stylesheet.
3333
*/
3434
import "./lib/patternfly/patternfly-4-overrides.scss";
35+
import './app.scss';
3536

3637
document.addEventListener("DOMContentLoaded", function () {
3738
ReactDOM.render(React.createElement(Application, {}), document.getElementById('app'));

0 commit comments

Comments
 (0)