$border-radius
which is defined by Boostrap. This guide will show how you can override those SCSS variables.!default
flag for it's own default variables. Variable overrides have to be declared beforehand.theme.json
which is declared before @Storefront
.overrides.scss
:<plugin root>/src/Resources/app/storefront/src/scss/overrides.scss
you can now override default variables like $border-radius
globally and set its value to 0
to reset it in this case:overrides.scss
file and running bin/console theme:compile
go and check out the Storefront in the browser. The border-radius
should be removed for every element..container { background: #f00 }
in this file../psh.phar storefront:hot-proxy
in the development template or ./bin/watch-storefront.sh
in the production template, SCSS variables will be injected dynamically by webpack. When writing selectors and properties in the overrides.scss
the code can appear multiple times in your built CSS.