Menu icon Foundation

Developer | Florida

Full stack developer, designer, coder since 2001, programmer since 1987.

My Posts






My Comments

holmescreek commented on Stella Clover's post 2 months

This is crazy. I try creating a post with a legitimate question regarding Foundation and every time it gets flagged and deleted as spam, but, to top it off this post about marketing just breezes through!?

holmescreek commented on Kris Jones's post 2 months

@Sven
Just curious, wouldn't it be better to put your jquery script tag in the head section just in case you add some custom jQuery in the bodies in certain pages.  For example, I have a hero slider that I use on a home page, so I added the jQuery just past the content for that page vs putting it in a global site footer (as I don't need it on other pages).
 

holmescreek commented on holmescreek's post 4 months

Yeah, the first post was flagged as spam and I couldn't go back and copy and paste then revise it in a new post (figured something I wrote set off the spam filter).
---
Anyway, my question about breakpoints applies to both posts, the first about topbar underlapping  and the second about navigation items with white space, so I'll just combine the two here.
I can change my $medium breakpoint setting, for instance to 950px, and things like medium-up, medium-only, etc work fine.
However, I tried adding breakpoint called "custom", but things like data-hide-for="custom" or "custom-up", "custom-only", etc., won't work. This would seem the most logical way to set a custom breakpoint.
 
$breakpoints: (

small: 0,
tiny:460px,
medium: 640px,
custom: 950px,
large: 1024px,
xlarge: 1200px,
xxlarge: 1440px,
);

$print-breakpoint: large;
$breakpoint-classes: (small tiny custom medium large);

...
...

// 37. Top Bar
...
$topbar-unstack-breakpoint: custom;
 
It seems that defining a "custom" size, I should be able to use things like data-hide-for="custom", "custom-dropdown", etc., in my html, but it fails to work.
 
I also tried things like :
 
 
.title-bar {
@include breakpoint(custom) {
width:950px;
}
}
 
 

holmescreek commented on CACUSer's post 4 months

Great!  -- please be sure to mark as Helpful on my answer (above).
Again, for primary, alert, other buttons, you might want to play with the above code I provided along with SASS mixins -- if you need to style the default Foundation buttons globally.
Happy Coding!
 

holmescreek commented on Mike Weisz's post 4 months

This question is still relevant.
Maybe because every time you post a question on the forum it gets flagged as spam and you have to e-mail Zurb!
Foundation is a great product, but, if Zurb continues to allow forum bots to flag every post as spam, where you have to e-mail zurb to clarify, the forums (the main site for peer to peer support) will continue to suffer.
Without a solid, and growing,  peer to peer support platform, foundation just keeps shooting themselves in the foot. :/

holmescreek commented on CACUSer's post 4 months

Quickest way I could think of, might be better solutions if you need to apply it to the primary button, alert, etc, globally. Make sure mybutton is last in the html class link due to css specificity.
 
 
html:
<a class="button primary mybutton" href="/helpus/">CALL US TODAY!</a>
 
css:
 
.mybutton {
background: red; /* For browsers that do not support gradients /
background: -webkit-linear-gradient(left top, red, yellow); /
For Safari 5.1 to 6.0 /
background: -o-linear-gradient(bottom right, red, yellow); /
For Opera 11.1 to 12.0 /
background: -moz-linear-gradient(bottom right, red, yellow); /
For Firefox 3.6 to 15 /
background: linear-gradient(to bottom right, red, yellow); /
Standard syntax */
}

holmescreek commented on holmescreek's post 4 months

I think I finally got it. Ugh, seems every time I upgrade Foundation versions it takes half a day to get things sorted.
Anyway, I downloaded the npm/node installer from here:
https://nodejs.org/en/download/
After the install, I had to go into my old 6.3.x project folder and run:
 
sudo npm rebuild node-sass
 
sudo npm update -g npm
 
The last line above updates gulp - otherwise npm start will throw a (node:18275) message. ;)
npm start now seems to be running fine in old 6.3 project folders and foundation-cli seems to be working in 6.4.x project folders -- along with npm start.
 
<whew>

holmescreek commented on holmescreek's post 4 months

 I checked the OS X 64-bit message. Also in the error, I noticed that a message:
'Found bindings for the following environments:
  - OS X 64-bit with Node.js 4.x'
 
So, I downgraded to node 4.8.4 using :
 
sudo n 4.8.4
 
 
After this, foundation and npm start is working in 6.3 project folders but goes back to erroring out on 6.4.x project folders. :/
 
 
Thanks for your help, Rafi.

holmescreek commented on holmescreek's post 4 months

Yeah, I updated npm, node, etc.  Foundation new and npm start both work fine on a new 6.4.1 project, now whenever I go into an older Founation 6.3.0 project folder and run npm start, everything breaks. <ugh>
 
This is what I did to get foundation to work with 6.4.1, and foundation new and npm start:
sudo npm uninstall foundation-cli -global

sudo npm cache clean -f

sudo npm install -g n

sudo n stable

sudo npm update -g bower

sudo npm install foundation-cli -global

 
However, if I go into an older 6.3.0 project folder and run npm start I get these errors:
 
[12:39:35] Using gulpfile ~/Documents/webprojects/seacrest wolf preserve/public_html/site/templates/gulpfile.js
[12:39:35] Starting 'sass'...
[12:39:35] 'sass' errored after 84 ms
[12:39:35] Error: Node Sass does not yet support your current environment: OS X 64-bit with Unsupported runtime (57)
 

holmescreek commented on holmescreek's post 4 months

Yeah. Still when I run sudo npm update -g foundation-cli then run foundation or foundation new, it gives me error that I included in the code section of the first post.

Posts Followed


  • 2
    Replies
  • js files not loading

    By Kris Jones

    installation js jquery

    I installed Foundation using CLI. Everything looks like it went smoothly. I have my project set up now. I pasted in the basic template and it cannot load the js scripts. Here's what I pasted in: &lt;script src="js/vendor/jquery.js"&gt;&lt;/script&gt; &lt... (continued)

    Last Reply by holmescreek 2 months ago





Following

    No Content

Followers

My Posts

My Comments

You commented on Stella Clover's post 2 months

This is crazy. I try creating a post with a legitimate question regarding Foundation and every time it gets flagged and deleted as spam, but, to top it off this post about marketing just breezes through!?

You commented on Kris Jones's post 2 months

@Sven
Just curious, wouldn't it be better to put your jquery script tag in the head section just in case you add some custom jQuery in the bodies in certain pages.  For example, I have a hero slider that I use on a home page, so I added the jQuery just past the content for that page vs putting it in a global site footer (as I don't need it on other pages).
 

You commented on holmescreek's post 4 months

Yeah, the first post was flagged as spam and I couldn't go back and copy and paste then revise it in a new post (figured something I wrote set off the spam filter).
---
Anyway, my question about breakpoints applies to both posts, the first about topbar underlapping  and the second about navigation items with white space, so I'll just combine the two here.
I can change my $medium breakpoint setting, for instance to 950px, and things like medium-up, medium-only, etc work fine.
However, I tried adding breakpoint called "custom", but things like data-hide-for="custom" or "custom-up", "custom-only", etc., won't work. This would seem the most logical way to set a custom breakpoint.
 
$breakpoints: (

small: 0,
tiny:460px,
medium: 640px,
custom: 950px,
large: 1024px,
xlarge: 1200px,
xxlarge: 1440px,
);

$print-breakpoint: large;
$breakpoint-classes: (small tiny custom medium large);

...
...

// 37. Top Bar
...
$topbar-unstack-breakpoint: custom;
 
It seems that defining a "custom" size, I should be able to use things like data-hide-for="custom", "custom-dropdown", etc., in my html, but it fails to work.
 
I also tried things like :
 
 
.title-bar {
@include breakpoint(custom) {
width:950px;
}
}
 
 

You commented on CACUSer's post 4 months

Great!  -- please be sure to mark as Helpful on my answer (above).
Again, for primary, alert, other buttons, you might want to play with the above code I provided along with SASS mixins -- if you need to style the default Foundation buttons globally.
Happy Coding!
 

You commented on Mike Weisz's post 4 months

This question is still relevant.
Maybe because every time you post a question on the forum it gets flagged as spam and you have to e-mail Zurb!
Foundation is a great product, but, if Zurb continues to allow forum bots to flag every post as spam, where you have to e-mail zurb to clarify, the forums (the main site for peer to peer support) will continue to suffer.
Without a solid, and growing,  peer to peer support platform, foundation just keeps shooting themselves in the foot. :/

You commented on CACUSer's post 4 months

Quickest way I could think of, might be better solutions if you need to apply it to the primary button, alert, etc, globally. Make sure mybutton is last in the html class link due to css specificity.
 
 
html:
<a class="button primary mybutton" href="/helpus/">CALL US TODAY!</a>
 
css:
 
.mybutton {
background: red; /* For browsers that do not support gradients /
background: -webkit-linear-gradient(left top, red, yellow); /
For Safari 5.1 to 6.0 /
background: -o-linear-gradient(bottom right, red, yellow); /
For Opera 11.1 to 12.0 /
background: -moz-linear-gradient(bottom right, red, yellow); /
For Firefox 3.6 to 15 /
background: linear-gradient(to bottom right, red, yellow); /
Standard syntax */
}

You commented on holmescreek's post 4 months

I think I finally got it. Ugh, seems every time I upgrade Foundation versions it takes half a day to get things sorted.
Anyway, I downloaded the npm/node installer from here:
https://nodejs.org/en/download/
After the install, I had to go into my old 6.3.x project folder and run:
 
sudo npm rebuild node-sass
 
sudo npm update -g npm
 
The last line above updates gulp - otherwise npm start will throw a (node:18275) message. ;)
npm start now seems to be running fine in old 6.3 project folders and foundation-cli seems to be working in 6.4.x project folders -- along with npm start.
 
<whew>

You commented on holmescreek's post 4 months

 I checked the OS X 64-bit message. Also in the error, I noticed that a message:
'Found bindings for the following environments:
  - OS X 64-bit with Node.js 4.x'
 
So, I downgraded to node 4.8.4 using :
 
sudo n 4.8.4
 
 
After this, foundation and npm start is working in 6.3 project folders but goes back to erroring out on 6.4.x project folders. :/
 
 
Thanks for your help, Rafi.

You commented on holmescreek's post 4 months

Yeah, I updated npm, node, etc.  Foundation new and npm start both work fine on a new 6.4.1 project, now whenever I go into an older Founation 6.3.0 project folder and run npm start, everything breaks. <ugh>
 
This is what I did to get foundation to work with 6.4.1, and foundation new and npm start:
sudo npm uninstall foundation-cli -global

sudo npm cache clean -f

sudo npm install -g n

sudo n stable

sudo npm update -g bower

sudo npm install foundation-cli -global

 
However, if I go into an older 6.3.0 project folder and run npm start I get these errors:
 
[12:39:35] Using gulpfile ~/Documents/webprojects/seacrest wolf preserve/public_html/site/templates/gulpfile.js
[12:39:35] Starting 'sass'...
[12:39:35] 'sass' errored after 84 ms
[12:39:35] Error: Node Sass does not yet support your current environment: OS X 64-bit with Unsupported runtime (57)
 

You commented on holmescreek's post 4 months

Yeah. Still when I run sudo npm update -g foundation-cli then run foundation or foundation new, it gives me error that I included in the code section of the first post.

Posts Followed

Following

  • No Content

Followers

  • No Content