Menu icon Foundation

Developer | Oakland, TN

Learning everything there is to know about Foundation!

My Posts


My Comments

Stephen Bramlett commented on Stephen Bramlett's post 3 months

Hey Val Ery,
That's awesome, thanks! I will work with this and see what I can do.
-Stephen

Stephen Bramlett commented on Erick Salazar's post 4 months

Erick,
You can put the code into a code pen like the one I linked above. You can call that image in CSS on any class you like. It could be a section or div called .hero or whatever class name you want to make it. You can then set the background image on that class in your CSS.
 
HTML Code:
<section class="hero"></section>
 
CSS Code:
.hero {
background-image: url("https://subtlepatterns.com/patterns/footer_lodyas.png");
background-size: cover;
background-position: center center;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
align-content: center;
}
 
 
-Stephen

Stephen Bramlett commented on smallGod Media's post 4 months

Hey Kenneth,
Those animations are from the Motion UI JS plugin. You can find the information here...
http://foundation.zurb.com/sites/docs/motion-ui.html

Stephen Bramlett commented on Erick Salazar's post 4 months

Hey Erick,
Do you happen to have a code snippet? I would like to see what you've got working.
You can see here on my codepen where I used a CSS call for the hero image only and not in the HTML...
https://codepen.io/sbramlett/pen/EWxeyG

Stephen Bramlett commented on Alan Wagoner's post 4 months

I believe they leave those classes for you to define. They do have some helper classes listed here.
http://foundation.zurb.com/sites/docs/typography-helpers.html
 
I've been using my own hero section and using the grid inside it.
https://codepen.io/sbramlett/pen/EWxeyG
 
 

Stephen Bramlett commented on Stephen Bramlett's post 4 months

Just checking if anyone had some ideas.

Stephen Bramlett commented on Jason Knase's post 4 months

I know in the sites version you have the variable settings for 
$button-background-hover-lightness
I didn't see this option in the emails doc. You will probably have to write a custom CSS to change the hover.

Stephen Bramlett commented on Serguei Cambour's post 4 months

@Serguei: That's just normal HTML that makes two separate tables have spacing between them. You could always throw in a custom css class to handle that spacing.
 
Remove Foundation from the equation and you still have the spacing issues.
https://codepen.io/sbramlett/pen/wJvpbm

Stephen Bramlett commented on Serguei Cambour's post 4 months

Hey Serguei,
Are you trying to make two tables in the same row like this?
http://codepen.io/sbramlett/pen/wJvpbm
 

Posts Followed





  • 8
    Replies
  • Nested tables

    By Serguei Cambour

    table

    Is it possible to create (don't really know how exactly to name it) a nested table with Foundation 6 ? I mean, to have 1 table with 6 columns with proper headers, followed by another one with the number of columns &lt; 6 and with own headers as well. As a... (continued)

    Last Reply by Serguei Cambour 4 months ago


Following

    No Content

Followers

My Posts

My Comments

You commented on Stephen Bramlett's post 3 months

Hey Val Ery,
That's awesome, thanks! I will work with this and see what I can do.
-Stephen

You commented on Erick Salazar's post 4 months

Erick,
You can put the code into a code pen like the one I linked above. You can call that image in CSS on any class you like. It could be a section or div called .hero or whatever class name you want to make it. You can then set the background image on that class in your CSS.
 
HTML Code:
<section class="hero"></section>
 
CSS Code:
.hero {
background-image: url("https://subtlepatterns.com/patterns/footer_lodyas.png");
background-size: cover;
background-position: center center;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
align-content: center;
}
 
 
-Stephen

You commented on smallGod Media's post 4 months

Hey Kenneth,
Those animations are from the Motion UI JS plugin. You can find the information here...
http://foundation.zurb.com/sites/docs/motion-ui.html

You commented on Erick Salazar's post 4 months

Hey Erick,
Do you happen to have a code snippet? I would like to see what you've got working.
You can see here on my codepen where I used a CSS call for the hero image only and not in the HTML...
https://codepen.io/sbramlett/pen/EWxeyG

You commented on Alan Wagoner's post 4 months

I believe they leave those classes for you to define. They do have some helper classes listed here.
http://foundation.zurb.com/sites/docs/typography-helpers.html
 
I've been using my own hero section and using the grid inside it.
https://codepen.io/sbramlett/pen/EWxeyG
 
 

You commented on Stephen Bramlett's post 4 months

Just checking if anyone had some ideas.

You commented on Jason Knase's post 4 months

I know in the sites version you have the variable settings for 
$button-background-hover-lightness
I didn't see this option in the emails doc. You will probably have to write a custom CSS to change the hover.

You commented on Serguei Cambour's post 4 months

@Serguei: That's just normal HTML that makes two separate tables have spacing between them. You could always throw in a custom css class to handle that spacing.
 
Remove Foundation from the equation and you still have the spacing issues.
https://codepen.io/sbramlett/pen/wJvpbm

You commented on Serguei Cambour's post 4 months

Hey Serguei,
Are you trying to make two tables in the same row like this?
http://codepen.io/sbramlett/pen/wJvpbm
 

Posts Followed

Following

  • No Content

Followers

  • No Content