Beans with SASS


Hi, I am putting together a beans starter child theme that use sass, as i really miss it, specially to have libraries like bourbon, or other available mixins, i will not use the compiler, so i can have sourcemaps, css injection and autoprefixer.

I am planning to have gulp workflow including uncss to get rid of the unused css.

the js will still use the compiler, and will be optimized this way.

I will also offer my advanced starter theme to the community, then i am planning to release themes soon :-)

I just have a little problem with my sass integration, and it is difficult to find examples of uikit.

i have that for example in my style.scss :

@import "uikit/uikit-mixins.scss";
@import "uikit/uikit.scss";
@import "uikit/components/autocomplete.scss";
@import "themes/default-theme/variables.scss";
@import "themes/default-theme/base.scss";

and i test for ex change the bg color, so i change the $global-background value , but in the base.scss file if i just add the variables and hooks ( as it is in the less default theme or flat) and not the whole thing with for ex :

html {
/ 1 /
font: $base-body-font-weight $base-body-font-size unquote("/") $base-body-line-height $base-body-font-family;
/ 2 /
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
/ 3 /
background: $base-body-background;
color: $base-body-color;
@include hook-base-body();
}

then it doesn't work, but if i copy the whole file then the css is duplicated and i imagine that's not good. I want to find the best practice for having themes as they explain here : https://getuikit.com/v2/docs/documentation_create-a-theme.html

I feel it's a basic questions...but it's turning me crazy since yesterday, and i don't find any examples on github or anywhere else



I have found the solution.

As i was chatting on gitter, i heard that uikit 3 will be stable very soon (something like august), so will it be also soon integrated to beans ?

Write a reply

Login or register to write a reply, it's free!