zurb-foundation

Browserify with Zurb Foundation Framework

Deadly 提交于 2019-12-04 14:08:07
POST-SOLUTION EDIT Here's a Yeoman generator to scaffold out a project with Foundation and Browserify: https://github.com/dougmacklin/generator-foundation-browserify I'm trying to figure out how to properly bundle the foundation framework js with browserify . In my project folder, I install it along with jQuery (which it depends on): npm install jquery foundation-sites --save Then in my main.js I have the following: var $ = jQuery = require('jquery'); var foundation = require('foundation-sites'); $(document).foundation(); I include the $ = jQuery = ... because if I don't I get a jQuery is not

What version of Foundation is used in cakePHP3?

做~自己de王妃 提交于 2019-12-04 12:19:24
From an earlier question ( Responsive bootstrap designing in CakePHP 3x ) I understand that cakePHP3 are using Foundation for front-end framework, but which version (in cakePHP v.3.2)? I'm struggling with a toggled top-bar, that won't open when minimized. There seems to have been some bugs in the 5th version and I'm now wondering if they aren't fixed in the version that cakePHP3 are using. The CakPHP application templates base.css file was last updated with foundation on September the 1st of 2015 https://github.com/cakephp/app/commit/3bf179e04d48c859b4ba411d81607ae25d275b3b As far as I can

Can you set medium columns on Zurb Foundation 4?

时间秒杀一切 提交于 2019-12-04 12:13:37
NB: This has been asked but not really answered here: How do I make use of breakpoints in Zurb foundation 4? The small and large columns on Foundation 4 are really handy, but small activates perhaps a little earlier than I'd like - is there any way of setting a medium-columns setting for smallish but not tiny resolutions, e.g. 800 * 600? In my specific case, I'd like the following setup: <div class="small-12 medium-6 large-4 columns">First column</div> <div class="small-12 medium-6 large-8 columns">Second column</div> In Zurb Foundation 4 I have added medium to my grid columns with the

Zurb Foundation Reveal Modal - preventing close on background click

落爺英雄遲暮 提交于 2019-12-04 10:08:03
问题 When I am opening my Reveal Modal, I would like to prevent it from closing on background click (which is a default behavior). I am using Zurb Foundation 5.0.2 . Any help would be appreciated. 回答1: If you set the closeOnBackgroundClick option to false then your modal won't close when you click in the background. <div class="reveal-modal" data-options="closeOnBackgroundClick:false"> 回答2: Yehhhhh Finally Found It: Put below code on your foundation reveal model. Than it not close by clicking on

Foundation 5 and page printing

时光总嘲笑我的痴心妄想 提交于 2019-12-04 09:35:02
问题 I'm using Zurb Foundation. I'm trying to print a page exactly as it looks in large screen but everything get stacked (and floated wrong). I succeded in having the grid in the printing page by substituting every "screen" occurrences with "print, screen" in the foundation.min.css. The problem is that the grid taken now is the small one. I read this post on the foundation support but honestly I don't know exactly what I'm supposed to do. Do I need to recompile foundation with sass? http:/

How to use Foundation 5 with Compass+SASS?

落花浮王杯 提交于 2019-12-04 09:25:34
问题 The problem Foundation 5 was released last week, that's great, but the new version requires to use bower for using F5 with SASS and the official documentation seems to be a bit incomplete and immature. I'm trying to create a project using the steps proposed by the docs: [sudo] npm install -g bower and then gem install foundation No problems here. The problem is when creating a Compass project: foundation new MY_PROJECT cd MY_PROJECT compass compile After Compass compilation, I get the

Google Map v3 Initializing with horizontal gray line w/ Foundation in Chrome

前提是你 提交于 2019-12-04 09:10:54
问题 Seems to be CSS related because initializing the map in a simple HTML page works just fine. I have added suggested CSS to fix known issues (below), but can't seem to get rid of this. #map { *, *:before, *:after { -moz-box-sizing: content-box!important; -webkit-box-sizing: content-box!important; box-sizing: content-box!important; } img { max-width: none; height: auto; } label { width: auto; display: inline; } } 回答1: For anyone else looking for a temp solution for this bug: CSS .map *, .map *

Zurb Foundation conflicts with jQuery UI autocomplete?

安稳与你 提交于 2019-12-04 08:59:33
I can't get jQuery-UI Autocomplete to work after loading Zurb Foundation 3.1. Anyone got them to work together or found another autocomplete plugin that works with Foundation?? Uncaught TypeError: Object [object Object] has no method 'autocomplete' (anonymous function) order.js:7 l foundation.min.js:18 c.fireWith foundation.min.js:18 v.extend.ready foundation.min.js:18 A foundation.min.js:18 snekkke It works great in that page, but if you use other components like Orbit or Reveal, and you have a site built on top of Foundationn then foundation.min.js is necessary. foundation.min.js includes

Opera Mobile not allowing jQuery clicks

馋奶兔 提交于 2019-12-04 07:15:11
问题 I have been testing out the foundation CSS framework and am quite liking their custom form elements that the framework provides. I have built a page, http://eventgrapple.com/home , to test the framework out, and it works fine in Google Chrome and so on (desktop) (slightly buggy in Internet Explorer 7) and works fine with a BlackBerry's native browser, but none of the form elements work in Opera 6.5 for BlackBerry bold 9700. The link to the framework is http://foundation.zurb.com/docs/forms

Dynamically set Sass variables in Foundation

亡梦爱人 提交于 2019-12-04 06:28:57
问题 How do you dynamically set Sass variables in Foundation? According to their docs, you can customize a table with the help of a few Sass variables in _settings.scss , let's take the background color for example. Now what if I want to use two different kinds of tables, with different background colors? I am new to both Foundation and Sass, and these variables seem a lot like globals to me. I guess I could make my own variables, such as $dark-table-bg , but how would I make a table use that