Page MenuHomePhabricator

Make Wikit CSS not contain multiple "ress" comments
Closed, InvalidPublic

Description

The query builder production css currently contains many duplicate comments from the ress reset css:

@charset "UTF-8";/*!
 * ress.css • v3.0.0
 * MIT License
 * github.com/filipelinhares/ress
 *//*!
 * ress.css • v3.0.0
 * MIT License
 * github.com/filipelinhares/ress
 */.wikit .wikit-Button,.wikit-Button.wikit{padding-left:.75em;padding-right:.75em;padding-left:.75em;padding-right:.75em;padding-inline:.75em;padding-top:.313em;padding-bottom:.313em;padding-top:.313em;padding-bottom:.313em;padding-block:.313em;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Lato,Helvetica,Arial,sans-s

[...]

events:none}.wikit .wikit-checkbox__input:disabled+.wikit-checkbox__label:before,.wikit .wikit-checkbox__input:disabled+.wikit-checkbox__label:checked:before,.wikit-checkbox__input.wikit:disabled+.wikit-checkbox__label:before,.wikit-checkbox__input.wikit:disabled+.wikit-checkbox__label:checked:before{border-color:#c8ccd1;background-color:#c8ccd1}/*!
 * ress.css • v3.0.0
 * MIT License
 * github.com/filipelinhares/ress
 */.wikit .wikit-Icon,.wikit-Icon.wikit{display:inline-flex;align-items:center}.wikit .wikit-Icon--base,.wikit-Icon--base.wikit{color:#202122}.wikit .wikit-Icon--subtle,.wikit-Icon--subtle.wikit{color:#54595d}.wikit .wikit-Icon--emphasized,.wikit-Icon--emphasized.wikit{color:#000}.wikit .wikit-Icon--inverted,.wikit-Icon--inverted.wikit{color:#fff}.wikit .wikit-Icon--error,.wikit-Icon--error.wikit{color:#d33}.wikit .wikit-Icon--warning,.wikit-Icon--warning.wikit{color:#fc3}.wikit .wikit-Icon--notice,.wikit-Icon--notice.wikit{color:#000}.wikit .wikit-Icon--success,.wikit-Icon--success.wikit{color:#14866d}.wikit .wikit-Icon--large .wikit-Icon__svg,.wikit-Icon--large.wikit .wikit-Icon__svg{width:1.25em;height:1.25em}.wikit .wikit-Icon--medium .wikit-Icon__svg,.wikit-Icon--medium.wikit .wikit-Icon__svg{width:1em;height:1em}.wikit .wikit-Icon--small .wikit-Icon__svg,.wikit-Icon--small.wikit .wikit-Icon__svg{width:.875em;height:.875em}.wikit .wikit-Icon--xsmall .wikit-Icon__svg,.wikit-Icon--xsmall.wikit .wikit-Icon__svg{width:.75em;height:.75em}/*!
 * ress.css • v3.0.0
 * MIT License
 * github.com/filipelinhares/ress
 */.wikit .wikit-Input,.wikit-Input.wikit{color:#202122;background-color:#fff;border-color:#a2a9b1;border-style:solid;border-width:1px;border-radius:2px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Lato,Helvetica,Arial,sans-serif;font-size:1em;font-weight:400;line-height:1.3;width:100%;box-sizing:border-box;padding-left:.5em;padding-right:.5em;padding-left:.5em;padding-right:.5em;padding-inline:.5em;padding-top:.313em;padding-bottom:.313em;padding-top:.313em;padding-bottom:.313em;padding-block:.313em;transition-duration:.25s;transition-timing-function:ease;transition-property:border-color,

[...]

And many more. This is useless code that we're sending to our users. Upon closer inspection, it turns out that this seemingly comes from the wikit-vue-components CSS that we're including: https://npm.runkit.com/@wmde/wikit-vue-components/dist/wikit-vue-components.css?t=1627562060653

I think we did something like that already for another project. Maybe bridge? => T246423

Related Objects