This is deprecated API and will be dropped at some point, in favor of projects shipping their own CSS. Follow https://github.com/cockpit-project/starter-kit/blob/master/webpack.config.js approach on how to use PF CSS. Also: * Replace extract-text-webpack-plugin with mini-css-webpack-plugin as the former is deprecated: https://webpack.js.org/plugins/extract-text-webpack-plugin/#usage * Upgrade PF module dependency * Reduce the css files that are linked through webpack. Instead include from the JS the CSS files and let mini-css-extract-plugin do the rest of the work
87 lines
2.6 KiB
SCSS
87 lines
2.6 KiB
SCSS
/*
|
|
* Keep in sync with https://github.com/cockpit-project/cockpit/tree/master/src/base1/patternfly-overrides-variables.scss
|
|
*/
|
|
|
|
//
|
|
// Variables
|
|
// --------------------------------------------------
|
|
|
|
|
|
//== Colors
|
|
//
|
|
//## Gray and brand colors for use across Bootstrap.
|
|
|
|
$gray-base: #000;
|
|
$gray-darker: lighten($gray-base, 13.5%); // #222
|
|
$gray-dark: lighten($gray-base, 20%); // #333
|
|
$gray: lighten($gray-base, 33.5%); // #555
|
|
$gray-light: lighten($gray-base, 46.7%); // #777
|
|
$gray-lighter: lighten($gray-base, 93.5%); // #eee
|
|
|
|
$brand-primary: #06c;
|
|
$brand-success: #92d400;
|
|
$brand-info: #73bcf7;
|
|
$brand-warning: #f0ab00;
|
|
$brand-danger: #c9190b;
|
|
|
|
|
|
//== Scaffolding
|
|
//
|
|
//## Settings for some of the most global styles.
|
|
|
|
//** Background color for `<body>`.
|
|
$body-bg: #fafafa;
|
|
//** Global text color on `<body>`.
|
|
$text-color: #151515;
|
|
|
|
|
|
$navbar-pf-vertical-bg-color: $text-color;
|
|
|
|
//** Global textual link color.
|
|
//$link-color: var(--pf-global--link--Color);
|
|
//** Link hover color set via `darken()` function.
|
|
//$link-hover-color: var(--pf-global--link--Color--hover);
|
|
$link-color: #06c;
|
|
$link-hover-color: #004080;
|
|
//** Link hover decoration.
|
|
$link-hover-decoration: underline;
|
|
|
|
//** Global color for active items (e.g., navs or dropdowns).
|
|
$component-active-color: var(--pf-global--active-color--100);
|
|
//** Global background color for active items (e.g., navs or dropdowns).
|
|
$component-active-bg: $brand-primary;
|
|
|
|
//== Buttons
|
|
//
|
|
//## For each of Bootstrap's buttons, define text, background and border color.
|
|
|
|
$btn-font-weight: normal;
|
|
|
|
$btn-default-color: $brand-primary;
|
|
$btn-default-bg: #fff;
|
|
$btn-default-border: $brand-primary;
|
|
|
|
$btn-primary-color: #fff;
|
|
$btn-primary-bg: $brand-primary;
|
|
$btn-primary-border: $brand-primary;
|
|
|
|
$btn-success-color: #fff;
|
|
$btn-success-bg: $brand-success;
|
|
$btn-success-border: $btn-success-bg;
|
|
|
|
$btn-info-color: #fff;
|
|
$btn-info-bg: $brand-info;
|
|
$btn-info-border: $btn-info-bg;
|
|
|
|
$btn-warning-color: #fff;
|
|
$btn-warning-bg: $brand-warning;
|
|
$btn-warning-border: $btn-warning-bg;
|
|
|
|
$btn-danger-color: #fff;
|
|
$btn-danger-bg: $brand-danger;
|
|
$btn-danger-border: $btn-danger-bg;
|
|
|
|
$btn-link-disabled-color: $gray-light;
|
|
|
|
$line-height-base: 1.5;
|
|
$font-size-base : 16px;
|