Menu icon Foundation

My Posts


  • NEW
  • Rebuilding foundation.min.js

    By Joel Kinzel

    foundation.min.js

    Just wondering if anyone can give me quick instructions on how to rebuild the foundation.min.js file? I've made some changes to the core foundation.accordion.js file and I need to rebuild the minified file to include those changes (not that I don't enjoy ... (continued)


My Comments

Joel Kinzel commented on Ben Viall's post about 4 years

Nope, you're spot on. You'll need to create another/utilize the XXLarge queries and set the max-width to something higher.

FYI, 1rem = 16px in case you did not know meaning your 80rem = 1280px (minus the gutters, so 1250px for content).

Joel Kinzel commented on Junaid Sarfraz's post about 4 years

You'd have to do some custom media queries to achieve this. I don't think there is anyway in Foundation's base code to do something like this.

Joel Kinzel commented on Chris F.'s post over 4 years

Looks like the code might have gotten messed up.

Joel Kinzel commented on Jolyon Favreau's post over 4 years

I think the best route would be to use Foundation's media query match JS utility and remove the class that the Foundation JS uses to detect and make the off-canvas stuff function. The down side is it will require a little more CSS on your part (potentially) to match the styles for both on and off canvas.

Joel Kinzel commented on Chris F.'s post over 4 years

Can you post the actual code for the Orbit carousel?

Also, just FYI, Orbit has been deprecated and is no longer supported. It is still in Foundation, but will likely be removed in a future version.

You can check out alternatives like Slick carousel or Owl carousel.

Joel Kinzel commented on Bor Kolaric's post over 4 years

This is actually a Chrome thing. FireFox does not have this. I'm guessing it is related to accessibility, so I would discourage you from changing it, but if you must:

.tabs dd > a, .tabs .tab-title > a{
    outline: none;
}

Joel Kinzel commented on Ash Gibson's post over 4 years

You could download the SASS files, and then wrap everything in a "foundation" class. That would name-space everything so that it had to be under the container w/that class.

Joel Kinzel commented on Stefan Staudenmeyer's post over 4 years

It isn't ideal, but you could use JavaScript. If the view port matches a smaller screen, you can simply use JS to move the content into the off canvas areas and remove it from the other areas.

Joel Kinzel commented on Roman's post over 4 years

Is the form some where we could view it?

Check to make sure you don't have a class of required, or the required attribute on the element. Also, I believe adding a pattern will validate elements as well.

Joel Kinzel commented on Jeremy Englert's post over 4 years

If you don't want to use the element (which I agree shouldn't be used in this case), I believe you can use the class section as well. Example:

<div class="section top-bar-section">

Posts Followed


Following

    No Content

Followers

My Posts


My Comments

You commented on Ben Viall's post about 4 years

Nope, you're spot on. You'll need to create another/utilize the XXLarge queries and set the max-width to something higher.

FYI, 1rem = 16px in case you did not know meaning your 80rem = 1280px (minus the gutters, so 1250px for content).

You commented on Junaid Sarfraz's post about 4 years

You'd have to do some custom media queries to achieve this. I don't think there is anyway in Foundation's base code to do something like this.

You commented on Chris F.'s post over 4 years

Looks like the code might have gotten messed up.

You commented on Jolyon Favreau's post over 4 years

I think the best route would be to use Foundation's media query match JS utility and remove the class that the Foundation JS uses to detect and make the off-canvas stuff function. The down side is it will require a little more CSS on your part (potentially) to match the styles for both on and off canvas.

You commented on Chris F.'s post over 4 years

Can you post the actual code for the Orbit carousel?

Also, just FYI, Orbit has been deprecated and is no longer supported. It is still in Foundation, but will likely be removed in a future version.

You can check out alternatives like Slick carousel or Owl carousel.

You commented on Bor Kolaric's post over 4 years

This is actually a Chrome thing. FireFox does not have this. I'm guessing it is related to accessibility, so I would discourage you from changing it, but if you must:

.tabs dd > a, .tabs .tab-title > a{
    outline: none;
}

You commented on Ash Gibson's post over 4 years

You could download the SASS files, and then wrap everything in a "foundation" class. That would name-space everything so that it had to be under the container w/that class.

You commented on Stefan Staudenmeyer's post over 4 years

It isn't ideal, but you could use JavaScript. If the view port matches a smaller screen, you can simply use JS to move the content into the off canvas areas and remove it from the other areas.

You commented on Roman's post over 4 years

Is the form some where we could view it?

Check to make sure you don't have a class of required, or the required attribute on the element. Also, I believe adding a pattern will validate elements as well.

You commented on Jeremy Englert's post over 4 years

If you don't want to use the element (which I agree shouldn't be used in this case), I believe you can use the class section as well. Example:

<div class="section top-bar-section">

Posts Followed

Following

  • No Content

Followers

  • No Content