Menu icon Foundation

My Posts




My Comments

Christopher Martinez commented on Je'l Awesh Medrano 's post 2 months

It's been a year since you posted this, did you happen to find a solution for it? I'm encountering the same issue.

Christopher Martinez commented on Christopher Martinez's post 11 months

Um, so yeah, this does work. Re-ran  
npm run build
and it works as expected. So to anyone who stumbles across this, move smoothScroll.js before magellan.js and rebuild.

Christopher Martinez commented on Daniel Mora's post almost 3 years

Hello,

I noticed in the codepen that when you click on the first (parent) Accordion 1 - the nested (child) Accordion 1 is open by default. Is there a way to avoid this behavior?

Christopher Martinez commented on Christopher Martinez's post about 3 years

For anyone who comes across this in the future, I've modified the sass stuff at around line 14 in the Codepen above, to include the down arrow:

  .top-bar-section .has-dropdown.expand {
    position: relative;
    display:block;

    @if $topbar-arrows {
      > a {
        padding-#{$opposite-direction}: $topbar-link-padding + $topbar-link-dropdown-padding !important;
        &:after {
          @include css-triangle($topbar-dropdown-toggle-size, rgba($topbar-dropdown-toggle-color, $topbar-dropdown-toggle-alpha), top);
          margin-top: -($topbar-dropdown-toggle-size / 2);
          top: ($topbar-height / 2);
        }
      }
    }
  }

Christopher Martinez commented on Michael Johann's post about 3 years

I've modified the sass to include the down arrow as below:

  .top-bar-section .has-dropdown.expand {
    position: relative;
    display:block;

    @if $topbar-arrows {
      > a {
        padding-#{$opposite-direction}: $topbar-link-padding + $topbar-link-dropdown-padding !important;
        &:after {
          @include css-triangle($topbar-dropdown-toggle-size, rgba($topbar-dropdown-toggle-color, $topbar-dropdown-toggle-alpha), top);
          margin-top: -($topbar-dropdown-toggle-size / 2);
          top: ($topbar-height / 2);
        }
      }
    }
  }

Christopher Martinez commented on Christopher Martinez's post about 3 years

That's awesome! Thanks!!

Christopher Martinez commented on Michael Johann's post about 3 years

Hi,
I think we are after the same goal. If not, then just ignore this comment.

Though I haven't solved it yet, here is my post for you to follow in case mine gets resolved first - http://foundation.zurb.com/forum/posts/35498-topbar-dropdown---slide-down-on-mobile

Thanks,
Chris

Christopher Martinez commented on Christopher Martinez's post about 3 years

Hi Tim,

I was able to correct it by modifying the _top-bar.scss file in bower_component/foundation/scss/foundation/compnents/

I didn't think I had to do that, it seems like this file was overwriting the settings or that the custom settings were being ignored.

If you know of a fix, please let me know.

Christopher Martinez commented on Christopher Martinez's post about 3 years

Hi Tim,

Thanks for pointing me to those. I was searching most of the morning trying to find a solution - I came across the first link, but did not see the next one.

I think it's getting closer, but still no cigar. In fact, it may be worse now. The menu still doesn't toggle, but now everything is inline(?).

$topbar-breakpoint: #{upper-bound($medium-range)}; // Change to 9999px for always mobile layout
@debug $topbar-breakpoint;
$topbar-media-query: "#{$screen} and (min-width:#{upper-bound($topbar-breakpoint)})";

So instead of:
about
- sub menu item
- sub menu item

it's more like:
about > sub menu item sub menu item.

I've removed any scss file reference except for those related to the topbar (_settings, topbar, etc). to make sure it's nothing external.

Any thoughts?

Posts Followed





Following

    No Content

Followers

My Posts

My Comments

You commented on Je'l Awesh Medrano 's post 2 months

It's been a year since you posted this, did you happen to find a solution for it? I'm encountering the same issue.

You commented on Christopher Martinez's post 11 months

Um, so yeah, this does work. Re-ran  
npm run build
and it works as expected. So to anyone who stumbles across this, move smoothScroll.js before magellan.js and rebuild.

You commented on Daniel Mora's post almost 3 years

Hello,

I noticed in the codepen that when you click on the first (parent) Accordion 1 - the nested (child) Accordion 1 is open by default. Is there a way to avoid this behavior?

You commented on Christopher Martinez's post about 3 years

For anyone who comes across this in the future, I've modified the sass stuff at around line 14 in the Codepen above, to include the down arrow:

  .top-bar-section .has-dropdown.expand {
    position: relative;
    display:block;

    @if $topbar-arrows {
      > a {
        padding-#{$opposite-direction}: $topbar-link-padding + $topbar-link-dropdown-padding !important;
        &:after {
          @include css-triangle($topbar-dropdown-toggle-size, rgba($topbar-dropdown-toggle-color, $topbar-dropdown-toggle-alpha), top);
          margin-top: -($topbar-dropdown-toggle-size / 2);
          top: ($topbar-height / 2);
        }
      }
    }
  }

You commented on Michael Johann's post about 3 years

I've modified the sass to include the down arrow as below:

  .top-bar-section .has-dropdown.expand {
    position: relative;
    display:block;

    @if $topbar-arrows {
      > a {
        padding-#{$opposite-direction}: $topbar-link-padding + $topbar-link-dropdown-padding !important;
        &:after {
          @include css-triangle($topbar-dropdown-toggle-size, rgba($topbar-dropdown-toggle-color, $topbar-dropdown-toggle-alpha), top);
          margin-top: -($topbar-dropdown-toggle-size / 2);
          top: ($topbar-height / 2);
        }
      }
    }
  }

You commented on Christopher Martinez's post about 3 years

That's awesome! Thanks!!

You commented on Michael Johann's post about 3 years

Hi,
I think we are after the same goal. If not, then just ignore this comment.

Though I haven't solved it yet, here is my post for you to follow in case mine gets resolved first - http://foundation.zurb.com/forum/posts/35498-topbar-dropdown---slide-down-on-mobile

Thanks,
Chris

You commented on Christopher Martinez's post about 3 years

Hi Tim,

I was able to correct it by modifying the _top-bar.scss file in bower_component/foundation/scss/foundation/compnents/

I didn't think I had to do that, it seems like this file was overwriting the settings or that the custom settings were being ignored.

If you know of a fix, please let me know.

You commented on Christopher Martinez's post about 3 years

Hi Tim,

Thanks for pointing me to those. I was searching most of the morning trying to find a solution - I came across the first link, but did not see the next one.

I think it's getting closer, but still no cigar. In fact, it may be worse now. The menu still doesn't toggle, but now everything is inline(?).

$topbar-breakpoint: #{upper-bound($medium-range)}; // Change to 9999px for always mobile layout
@debug $topbar-breakpoint;
$topbar-media-query: "#{$screen} and (min-width:#{upper-bound($topbar-breakpoint)})";

So instead of:
about
- sub menu item
- sub menu item

it's more like:
about > sub menu item sub menu item.

I've removed any scss file reference except for those related to the topbar (_settings, topbar, etc). to make sure it's nothing external.

Any thoughts?

Posts Followed



Following

  • No Content

Followers

  • No Content