# Pinegrow 5.4.1 Sass Problems

**URL:** <https://forum.pinegrow.com/t/pinegrow-5-4-1-sass-problems/3002>\
**Category:** Styling (CSS)\
**Created:** [May 16, 2019, 10:09am UTC](https://forum.pinegrow.com/t/pinegrow-5-4-1-sass-problems/3002 "2019-05-16T10:09:43Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![AllMediaLab](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/allmedialab/32/2079_2.png) [@AllMediaLab](https://forum.pinegrow.com/u/AllMediaLab)\
**Post date:** [May 16, 2019, 10:09am UTC](https://forum.pinegrow.com/t/pinegrow-5-4-1-sass-problems/3002/1 "2019-05-16T10:09:43Z")

</div>

Hi,

Besides the fact that the Sass compiler gives an error every time I try to save something (despite that its saved to custom SCSS) and the app is extremely slowing down or freezes.  
Try to @import the Google Boloo Bhai font and add it to the headings with zero result.  
Is there any error in my Sass code or something I missed? I’m glad to hear!  
It looks like there is nothing compiled to the bootstrap.css!  
This I find but no import!?  
‘’’  
h1,  
h2,  
h3,  
h4,  
h5,  
h6,  
.h1,  
.h2,  
.h3,  
.h4,  
.h5,  
.h6 {  
margin-bottom: 0.5rem;  
font-family: “Baloo Bhai”, cursive;  
font-weight: 500;  
line-height: 1.2;  
}  
‘’’

Regards & Thanks,  
David

‘’’  
/\* Bootstrap theme customized with Pinegrow Web Editor \*/  
@import url(‘[https://fonts.googleapis.com/css?family=Poppins](https://fonts.googleapis.com/css?family=Poppins)’);  
@import url(‘[https://fonts.googleapis.com/css?family=Baloo+Bhai](https://fonts.googleapis.com/css?family=Baloo+Bhai)’);

/\* Vars go before the @import _/  
/_ Import the Bootstrap files \*/  
$font-family-sans-serif: Poppins,-apple-system, BlinkMacSystemFont, “Segoe UI”, Roboto, “Helvetica Neue”, Arial, “Noto Sans”, sans-serif, “Apple Color Emoji”, “Segoe UI Emoji”, “Segoe UI Symbol”, “Noto Color Emoji”;  
$headings-font-family: ‘Baloo Bhai’, cursive;  
$enable-responsive-font-sizes: true;

@import “…/node\_modules/rfs/sass”

.title  
+font-size(4rem)  
// or  
+responsive-font-size(64px)  
// or  
+rfs(64);

$font-size-base: 1rem;  
$font-size-lg: $font-size-base \* 1.25;  
$line-height-base: 1.5;  
$nav-link-padding-y: .5rem;  
$navbar-brand-font-size: $font-size-lg;  
$nav-link-height: $font-size-base \* $line-height-base + $nav-link-padding-y \* 2;

@import “bootstrap/bootstrap”;

/\* Custom CSS rules come here \*/

‘’’

---

<div class="post-metadata">

**Author:** ![Emmanuel](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/emmanuel/32/6294_2.png) [@Emmanuel](https://forum.pinegrow.com/u/Emmanuel)\
**Post date:** [May 16, 2019, 12:57pm UTC](https://forum.pinegrow.com/t/pinegrow-5-4-1-sass-problems/3002/2 "2019-05-16T12:57:22Z")

</div>

Hi,  
I haven’t analyzed the code and I’m not yet able to tell you where the problem is, but it seems that you’re using the BS4 customization feature.  
On this subject, have you read our documentation about this feature?

You can find it here:

> **[Customize Bootstrap 4 themes | Pinegrow Web Editor](https://pinegrow.com/docs/bootstrap-visual-editor/customize-bootstrap-4-themes/)**
>
> See how you can use Pinegrow to customize your Bootstrap 4 theme by modifying Bootstrap SASS variables and adding CSS rules.

and also here:

> **[How to Easily Customize Bootstrap 4 with Pinegrow Web Editor](https://medium.com/@mattront/how-to-easily-customize-bootstrap-4-with-pinegrow-web-editor-20282dede5cb)**
>
> See how you can use Pinegrow to customize your Bootstrap 4 themes by modifying Bootstrap SASS variables and adding CSS rules.

---

<div class="post-metadata">

**Author:** ![AllMediaLab](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/allmedialab/32/2079_2.png) [@AllMediaLab](https://forum.pinegrow.com/u/AllMediaLab)\
**Post date:** [May 16, 2019, 1:14pm UTC](https://forum.pinegrow.com/t/pinegrow-5-4-1-sass-problems/3002/3 "2019-05-16T13:14:27Z")

</div>

Thanks for your reply! Everything compiles except the @imports they don’t appear on top of the bootstrap css. Regards, David

Verzonden van mijn HTC

----- Bericht beantwoorden -----

---

<div class="post-metadata">

**Author:** ![AllMediaLab](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/allmedialab/32/2079_2.png) [@AllMediaLab](https://forum.pinegrow.com/u/AllMediaLab)\
**Post date:** [May 16, 2019, 1:15pm UTC](https://forum.pinegrow.com/t/pinegrow-5-4-1-sass-problems/3002/4 "2019-05-16T13:15:37Z")

</div>

the link you gave me is the tutorial I followed!

Verzonden van mijn HTC

----- Bericht beantwoorden -----
