With kibana 6.1.3: Why does auto prefixer removes 'webkit-box' related css when compiled

[ranjansaga]

I was making few modifications to the scss variables in
here : ui_framework/src/global_styling/variables/_colors.scss

After making this change i compiled the scss using the command : ./node_modules/grunt/bin/grunt uiFramework:compileCss

Why is it that 'webkit-box' related css is being removed even after setting browsers to 'Last 8 versions' in ui_framework/doc_site/postcss.config.js

Below is the diff of the file : ui_framework/dist/ui_framework.css

.kuiActionItem {

• display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
• -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
• -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between; }
  @@ -118,15 +115,12 @@ input[type="button"] {
  background-color: rgba(0, 0, 0, 0.1); }

.kuiBar {

• display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
• -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
• -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  @@ -134,22 +128,18 @@ input[type="button"] {
  /* 1 */ }

.kuiBarSection {

• display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
• -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
• -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  margin-left: 25px;
  margin-right: 25px; }
  .kuiBarSection:not(:first-child):not(:last-child):not(:only-child) {
• -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  @@ -158,12 +148,10 @@ input[type="button"] {
  margin-left: 0; }
  .kuiBarSection:last-child {
  margin-right: 0;
• -webkit-box-flex: 0;
  -webkit-flex: 0 1 auto;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  /* 4 */
• -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  @@ -214,12 +202,10 @@ input[type="button"] {

* 1. Solves whitespace problems introduced by inline elements.
*/

[cjcenizal]

Hi there! Hmm, to be honest I'm not sure why that's occurring. The Kibana UI Framework has been deprecated in favor of the Elastic UI Framework, so all development on the former has ceased.

Thanks,
CJ