Menu icon Foundation

My Posts

  • NEW
  • Can Sherpa support a Multi Page Styleguide?

    By Nathan

    sherpagulp

    Hi - I'm trying to put together a style guide and want to be able to leverage Style Sherpa, however I need to be able to support ~30 different pages. I figured I can run the sherpa command over each of the 30 .md files, but this would bloa... (continued)


  • 1
    Reply
  • F6 Dropdown Positioning

    By Nathan

    sitesdropdownjavascript

    I have a dropdown that I have positioned to 'bottom' which is working fine, but I want to control the positioning to be either centered on the parent element (similar to how action sheets work in Foundation for Apps). Alternatively (or in addition) I coul... (continued)

    Last Reply by Nathan over 3 years ago


  • 2
    Replies
  • Magellan 'active' events not firing

    By Nathan

    Magellansites

    I'm trying to use Magellan with an angular application and I'm having trouble getting Magellan working correctly. I'm also delaying the initialization of foundation until the page is fully loaded (timeout function). F6's sticky and tooltips are wo... (continued)

    Last Reply by Nathan over 3 years ago



  • 1
    Reply
  • rem-calc for line-height in IE

    By Nathan

    rem-calc

    I'm having a strange issue where using rem-calc for line-height does not seem to work in IE. I'm using IE11, but this seems to be an issue that goes pretty far back. Changing the line height to pixels works just fine. Strangely, rem-calc seems to work ... (continued)

    Last Reply by Rafi Benkual about 4 years ago


My Comments

Nathan commented on Michael Yacavone's post about 3 years

Try removing the # in the closing tag. Like:
{{#markdown}}

An H1

And some text...

{{/markdown}}

Nathan commented on David's post over 3 years

Commenting out these lines from foundation.dropdownMenu.js fixes the space issue:

 Foundation.Keyboard.register('DropdownMenu', {
      'ENTER': 'open',
      'SPACE': 'open',
      'ARROW_RIGHT': 'next',
      'ARROW_UP': 'up',
      'ARROW_DOWN': 'down',
      'ARROW_LEFT': 'previous',
      'ESCAPE': 'close'
    });

Nathan commented on Nathan's post over 3 years

Thanks for the reply Rafi. I created a codepen to reproduce the issue.
http://codepen.io/npapazian/pen/MKVGrr

The magellan tags are in the main view, but specific destinations and ids/anchors are created with an ng-repeat. We have written a few directives (accordion) but most everything is working pretty well.

I also went ahead and opened a GitHub here:
https://github.com/zurb/foundation-sites/issues/8016

Nathan commented on Nathan's post over 3 years

I figured out a solution, which i'm not super excited by, but I thought i'd pass along. You can apply negative margin and/or position the dropdown if you apply the css only to the dropdown-pane with an 'is-open' state. The dropdown-pane is absolutely positioned by JS without that class.

.dropdown-pane {
    &.small {
        &.is-open {
            margin-left:-100px;
        }
    }
}

I think it would be useful to have greater flexibility in positioning built into the plugin itself.

Nathan commented on Maurizio Bellemo's post about 4 years

Trying to do the same thing. Anyone have any tips or tools that worked?

Posts Followed

  • NEW
  • Can Sherpa support a Multi Page Styleguide?

    By Nathan

    sherpagulp

    Hi - I'm trying to put together a style guide and want to be able to leverage Style Sherpa, however I need to be able to support ~30 different pages. I figured I can run the sherpa command over each of the 30 .md files, but this would bloa... (continued)




  • 1
    Reply
  • F6 Dropdown Positioning

    By Nathan

    sitesdropdownjavascript

    I have a dropdown that I have positioned to 'bottom' which is working fine, but I want to control the positioning to be either centered on the parent element (similar to how action sheets work in Foundation for Apps). Alternatively (or in addition) I coul... (continued)

    Last Reply by Nathan over 3 years ago


  • 2
    Replies
  • Magellan 'active' events not firing

    By Nathan

    Magellansites

    I'm trying to use Magellan with an angular application and I'm having trouble getting Magellan working correctly. I'm also delaying the initialization of foundation until the page is fully loaded (timeout function). F6's sticky and tooltips are wo... (continued)

    Last Reply by Nathan over 3 years ago






  • 1
    Reply
  • rem-calc for line-height in IE

    By Nathan

    rem-calc

    I'm having a strange issue where using rem-calc for line-height does not seem to work in IE. I'm using IE11, but this seems to be an issue that goes pretty far back. Changing the line height to pixels works just fine. Strangely, rem-calc seems to work ... (continued)

    Last Reply by Rafi Benkual about 4 years ago


Following

    No Content

Followers

My Posts





My Comments

You commented on Michael Yacavone's post about 3 years

Try removing the # in the closing tag. Like:
{{#markdown}}

An H1

And some text...

{{/markdown}}

You commented on David's post over 3 years

Commenting out these lines from foundation.dropdownMenu.js fixes the space issue:

 Foundation.Keyboard.register('DropdownMenu', {
      'ENTER': 'open',
      'SPACE': 'open',
      'ARROW_RIGHT': 'next',
      'ARROW_UP': 'up',
      'ARROW_DOWN': 'down',
      'ARROW_LEFT': 'previous',
      'ESCAPE': 'close'
    });

You commented on Nathan's post over 3 years

Thanks for the reply Rafi. I created a codepen to reproduce the issue.
http://codepen.io/npapazian/pen/MKVGrr

The magellan tags are in the main view, but specific destinations and ids/anchors are created with an ng-repeat. We have written a few directives (accordion) but most everything is working pretty well.

I also went ahead and opened a GitHub here:
https://github.com/zurb/foundation-sites/issues/8016

You commented on Nathan's post over 3 years

I figured out a solution, which i'm not super excited by, but I thought i'd pass along. You can apply negative margin and/or position the dropdown if you apply the css only to the dropdown-pane with an 'is-open' state. The dropdown-pane is absolutely positioned by JS without that class.

.dropdown-pane {
    &.small {
        &.is-open {
            margin-left:-100px;
        }
    }
}

I think it would be useful to have greater flexibility in positioning built into the plugin itself.

You commented on Maurizio Bellemo's post about 4 years

Trying to do the same thing. Anyone have any tips or tools that worked?

Posts Followed

Following

  • No Content

Followers

  • No Content