Menu icon Foundation

Developer | San Diego, CA

I am a retired mathematician. I have built and maintained two websites using Zurb Foundation as a hobby.

My Posts








My Comments

George Benthien commented on George Benthien's post 3 days

One way around this problem is to introduce a variable named php and test on that. Here is a sample
{{#if php}}
{{> phpvars}}
{{/if}}
Then set php to true in the front matter of the php files. For example
---
php: true
---
It is not necessary to set php in the remaining html files as the default value for php is false.

George Benthien commented on George Benthien's post about 1 month

With just the page name the test has always only worked for html files and that is still true. The test used to work with php files if you included the .php extension on the file name. Now even that doesn't work.

George Benthien commented on George Benthien's post 8 months

I found that you need to change the :before element and not the :after element.  Here is the SCSS code to replace the +/- accordion toggle with up down triangles
.accordion-title
{
&:before {
content: "\25BC";
}
.is-active > &:before {
content: "\25B2";
}
}

George Benthien commented on Peekay's post 9 months

 For me setting
$global-flexbox: false;in the SCSS _settings.scss file solved the problem.

George Benthien commented on George Benthien's post 11 months

It does seem to work If you set
$global-flexbox: false;
in _settings.scss
 
 

George Benthien commented on George Benthien's post about 1 year

I ran npm install node-sass and it completed. However, when I ran npm start it gave an error.
I found a solution on the internet the appears to work, but I have no idea why. After cloning the Zurb template replace 
"gulp-sass": "2.1.0" by "gulp-sass": "3.0.0" in the package.json file. 
Then npm install completes without error and npm start appears to work correctly. I don't like solutions that I don't understand, so if someone could explain what is happening, I would greatly appreciate it.

George Benthien commented on Tom Belknap's post about 1 year

I got the same error. In my case it said it couldn't find the folder 
C:\Users\benth\AppData\Roaming\npm\node_modules\foundation-cli\node_modules\npm\node_modules\ansistyles
to rename.

George Benthien commented on George Benthien's post over 1 year

Setting
$global-flexbox: false;
does solve the problem, but it doesn't seem like that should be necessary.

George Benthien commented on George Benthien's post over 1 year

I downloaded the latest verson of zurb template and reinstalled it. The problem I had with with the top-bar no longer occurs. However, I still have a problem with the media object. Below is the code I used
<div class="media-object">
<div class="media-object-section">
<img src= "http://via.placeholder.com/150x150" />
</div>
<div class="media-object-section middle">
<img src= "http://via.placeholder.com/50x50" />
</div>
<div class="media-object-section bottom">
<img src= "http://via.placeholder.com/75x75" />
</div>
</div>

Even though I have specified middle and bottom on the last two images, they all align on the top.

George Benthien commented on George Benthien's post almost 2 years

I found a way that seems to work. In the front matter I put
required: "name email"
In the php code I put
$required=explode(" ", '{{required}}');
By the way, the recent videos by Rafi on Panini are very helpful.

Posts Followed



  • NEW
  • Wrapping top-bar does not work.

    By anish mehta

    top-bar

    Hello! &nbsp; When I am trying to wrap the contents in top-bar-left or right, it does not work as intended. I found this issue with version 6.4.1 of Foundation. But it works fine on v.6.3.1. But if I wrap the whole top-bar it works fine albeit it does n... (continued)


Following

    No Content

Followers

My Posts

My Comments

You commented on George Benthien's post 3 days

One way around this problem is to introduce a variable named php and test on that. Here is a sample
{{#if php}}
{{> phpvars}}
{{/if}}
Then set php to true in the front matter of the php files. For example
---
php: true
---
It is not necessary to set php in the remaining html files as the default value for php is false.

You commented on George Benthien's post about 1 month

With just the page name the test has always only worked for html files and that is still true. The test used to work with php files if you included the .php extension on the file name. Now even that doesn't work.

You commented on George Benthien's post 8 months

I found that you need to change the :before element and not the :after element.  Here is the SCSS code to replace the +/- accordion toggle with up down triangles
.accordion-title
{
&:before {
content: "\25BC";
}
.is-active > &:before {
content: "\25B2";
}
}

You commented on Peekay's post 9 months

 For me setting
$global-flexbox: false;in the SCSS _settings.scss file solved the problem.

You commented on George Benthien's post 11 months

It does seem to work If you set
$global-flexbox: false;
in _settings.scss
 
 

You commented on George Benthien's post about 1 year

I ran npm install node-sass and it completed. However, when I ran npm start it gave an error.
I found a solution on the internet the appears to work, but I have no idea why. After cloning the Zurb template replace 
"gulp-sass": "2.1.0" by "gulp-sass": "3.0.0" in the package.json file. 
Then npm install completes without error and npm start appears to work correctly. I don't like solutions that I don't understand, so if someone could explain what is happening, I would greatly appreciate it.

You commented on Tom Belknap's post about 1 year

I got the same error. In my case it said it couldn't find the folder 
C:\Users\benth\AppData\Roaming\npm\node_modules\foundation-cli\node_modules\npm\node_modules\ansistyles
to rename.

You commented on George Benthien's post over 1 year

Setting
$global-flexbox: false;
does solve the problem, but it doesn't seem like that should be necessary.

You commented on George Benthien's post over 1 year

I downloaded the latest verson of zurb template and reinstalled it. The problem I had with with the top-bar no longer occurs. However, I still have a problem with the media object. Below is the code I used
<div class="media-object">
<div class="media-object-section">
<img src= "http://via.placeholder.com/150x150" />
</div>
<div class="media-object-section middle">
<img src= "http://via.placeholder.com/50x50" />
</div>
<div class="media-object-section bottom">
<img src= "http://via.placeholder.com/75x75" />
</div>
</div>

Even though I have specified middle and bottom on the last two images, they all align on the top.

You commented on George Benthien's post almost 2 years

I found a way that seems to work. In the front matter I put
required: "name email"
In the php code I put
$required=explode(" ", '{{required}}');
By the way, the recent videos by Rafi on Panini are very helpful.

Posts Followed

Following

  • No Content

Followers