Zurb Foundation -- Excluding Components and Customizing Settings

I would like to use the Zurb Foundation stack with Sage 9 and am wondering about how to exclude components that I don’t need.

Can I delete the `./autoload/_foundation.scss and create a new file (with a different file name) with the following contents:

@import "~foundation-sites/scss/foundation";

@include foundation-global-styles;
@include foundation-xy-grid-classes;
@include foundation-grid;
//@include foundation-flex-grid;
@include foundation-flex-classes;
@include foundation-typography;
@include foundation-forms;
@include foundation-button;
@include foundation-accordion;
@include foundation-accordion-menu;
@include foundation-badge;
@include foundation-breadcrumbs;
@include foundation-button-group;
@include foundation-callout;
@include foundation-card;
@include foundation-close-button;
@include foundation-menu;
@include foundation-menu-icon;
@include foundation-drilldown-menu;
@include foundation-dropdown;
@include foundation-dropdown-menu;
@include foundation-responsive-embed;
@include foundation-label;
@include foundation-media-object;
@include foundation-off-canvas;
@include foundation-orbit;
@include foundation-pagination;
@include foundation-progress-bar;
@include foundation-slider;
@include foundation-sticky;
@include foundation-reveal;
@include foundation-switch;
@include foundation-table;
@include foundation-tabs;
@include foundation-thumbnail;
@include foundation-title-bar;
@include foundation-tooltip;
@include foundation-top-bar;
@include foundation-visibility-classes;
@include foundation-float-classes;

This would allow me to then exclude those components that I don’t want. If I did that, what would happen if I ran sage preset. Would it delete that new file? Either way, is this the best solution to allow me to include only those foundation css components that I want to use – or is there a better way?

I also am wondering about customizing the global styles. I notice that in the common/_variables.scss you only included a short sample of foundation’s global styles. I am wondering why you didn’t just include the entire _settings.scss file. Is there any reason not to? Is there any problem if I do?


You can do whatever you would like. It is a starter theme. :slight_smile:

That is only supposed to be used during the very start of your project.

Do whatever you would like :+1:

Great – good to know. Thanks :slightly_smiling_face: