Menu icon Foundation

Designer | haarlem

My Posts






My Comments

Lefthandmedia commented on Mikhail Svirkin's post 11 months

+1

Lefthandmedia commented on PHILL's post 12 months

@Stevie-Ray: hey that looks pretty cool. can you share which JS and SCSS need to bee included?
RDG

Lefthandmedia commented on Lefthandmedia's post almost 2 years

Hi Geoff,
The confusion arises from the fact there are 2 files _settings.scss.
I'm studying the test project Yeti installed for me.
The first is in

/ scss
    + _settings.scss
    + app.scss

This app.scss in it's turn does @import 'foundation' which can be found in

/bower_components
    /foundation-sites
        /scss
            + foundation.scss

This foundation.scss imports every possible partial there is, including

 /bower_components
    /foundation-sites
        /scss
            /typography
                + _typography.scss

which imports _base.scss

Now, there is also a _settings.scss in

 /bower_components
    /foundation-sites
        /scss
            /settings
                + _settings.scss

Right now there are 3 places where $header-font-family is defined (2 flavors of _settings, 1 in my app folder and 1 in bower_components and 1 _base.scss)
Since the path to bower_components/foundation-sites/scss has been added to paths for gulp-sass i assume the gulp-sass can also find the _settings file in bower . Now when i adjust $header-font-family in my scss folder it doesn't always change.
Now may i assume that:
- i don't have to change anything in the bower_components ever?
- when i comment out an import in my app.scss file it wil not be included. Even though it IS an @import in the boer_components...foundation.scss ?
- my own scss/_settings.scss is the right place to adjust foundation $variables ?

thanks for helping my wrapping my brain around this construction :)

Lefthandmedia commented on Lefthandmedia's post almost 2 years

Hi Chris,
So i have the HTML . but what do i need to do with the javascript.
I embeded foundation.offcanvas.js. But where do i 'initialize' (?) this.
Or where does the line
Javascript
var offCanvas = new Foundation.OffCanvas( $('off-canvas-element-selector'), optionsObject);

go?
i also have a button
HTML
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
but i'm not sure this does anything when i click on it

Posts Followed




Following

    No Content

Followers

My Posts

My Comments

You commented on Mikhail Svirkin's post 11 months

+1

You commented on PHILL's post 12 months

@Stevie-Ray: hey that looks pretty cool. can you share which JS and SCSS need to bee included?
RDG

You commented on Lefthandmedia's post almost 2 years

Hi Geoff,
The confusion arises from the fact there are 2 files _settings.scss.
I'm studying the test project Yeti installed for me.
The first is in

/ scss
    + _settings.scss
    + app.scss

This app.scss in it's turn does @import 'foundation' which can be found in

/bower_components
    /foundation-sites
        /scss
            + foundation.scss

This foundation.scss imports every possible partial there is, including

 /bower_components
    /foundation-sites
        /scss
            /typography
                + _typography.scss

which imports _base.scss

Now, there is also a _settings.scss in

 /bower_components
    /foundation-sites
        /scss
            /settings
                + _settings.scss

Right now there are 3 places where $header-font-family is defined (2 flavors of _settings, 1 in my app folder and 1 in bower_components and 1 _base.scss)
Since the path to bower_components/foundation-sites/scss has been added to paths for gulp-sass i assume the gulp-sass can also find the _settings file in bower . Now when i adjust $header-font-family in my scss folder it doesn't always change.
Now may i assume that:
- i don't have to change anything in the bower_components ever?
- when i comment out an import in my app.scss file it wil not be included. Even though it IS an @import in the boer_components...foundation.scss ?
- my own scss/_settings.scss is the right place to adjust foundation $variables ?

thanks for helping my wrapping my brain around this construction :)

You commented on Lefthandmedia's post almost 2 years

Hi Chris,
So i have the HTML . but what do i need to do with the javascript.
I embeded foundation.offcanvas.js. But where do i 'initialize' (?) this.
Or where does the line
Javascript
var offCanvas = new Foundation.OffCanvas( $('off-canvas-element-selector'), optionsObject);

go?
i also have a button
HTML
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
but i'm not sure this does anything when i click on it

Posts Followed

Following

  • No Content

Followers

  • No Content