zurb-foundation

@import “foundation”; error in foundation5

淺唱寂寞╮ 提交于 2020-01-24 05:30:32
问题 i am using foundation5 for my project and done all settings as defined in its site and also in http://thesassway.com1 but when i am importing using @import "foundation"; or @import "foundation/components/topbar"; i am getting following error error sass/screen.scss (Line 7: File to import not found or unreadable: foundation. Load paths: /media/oem/Python/Self programs/mycache/mycache/templates/mycss/sass /usr/share/compass/frameworks/blueprint/stylesheets /usr/share/compass/frameworks/compass

Responsive Design: Why does height zero & padding-bottom work for making a div responsively sized?

落爺英雄遲暮 提交于 2020-01-22 12:28:39
问题 After looking through Zurb Foundation's code, I noticed they were using a CSS approach like this to allow a responsive square div: .div{ position:relative; width:33%; height:0; padding-bottom:33%; } .divInner{ position:absolute; width:100%; height:100%; } I've been using this approach on some newer projects (still in private dev), but don't know the browser support for it or why the height is even able to mimic the width size. Does anyone know why this happens? Thanks! 回答1: The second element

dropdowns only trigger once

匆匆过客 提交于 2020-01-17 10:38:09
问题 I have two filter dropdowns on this site which will only trigger the first time I press them. According to my studies it seems that it has to do with turbolinks, which I've disabled by adding data-no-turbolink to the body tag like so: <body data-no-turbolink> ... </body> I've also tried adding this to all of the dropdown links and the link to open the dropdown. <a href="some-link" data-no-turbolink>...</a> It seems to work on development, but when I push to Heroku, it seems turbolinks are

Button not displaying menu

情到浓时终转凉″ 提交于 2020-01-15 08:42:15
问题 About a week ago i posted a question but couldn't get it answer because i didn't know how to use jsfiddle or codepen but i figured it out. my problem is that the button doesn't work now if you click around it it will display the file search box this is the sample: https://codepen.io/anon/pen/bWaYzJ <label> Uploads <label for="exampleFileUpload" class="button">Upload File</label> <input type="file" id="exampleFileUpload" class="show-for-sr"> </label> now if i detached the plugin from element

Same print CSS as screen

泪湿孤枕 提交于 2020-01-14 10:14:41
问题 It seems like there should really be an easy solution to this, but so far I've been unsuccessful in finding one. I'm using Zurb Foundation and I'm basically creating a live form that takes inputs from a form (above), and fills in a content (below) using angular.js. Users will then print the page to a PDF. I'd like to maintain the layout I have for the content below, and I'd like to hide the form above when printing. Zurb has a fine "hide-for-print" css rule that seems like it should work just

Same print CSS as screen

有些话、适合烂在心里 提交于 2020-01-14 10:12:09
问题 It seems like there should really be an easy solution to this, but so far I've been unsuccessful in finding one. I'm using Zurb Foundation and I'm basically creating a live form that takes inputs from a form (above), and fills in a content (below) using angular.js. Users will then print the page to a PDF. I'd like to maintain the layout I have for the content below, and I'd like to hide the form above when printing. Zurb has a fine "hide-for-print" css rule that seems like it should work just

Foundation Zurb unable to change tooltip text

江枫思渺然 提交于 2020-01-14 09:43:49
问题 I’m having a problem changing the tooltip text on runtime after the tooltip text has already been set. Please see below for more information. Please can I have the correct code to change the tooltip text or a work around for the below problem? As an example I've created a blank html page, with one label, and 2 buttons: <body> <div class="row" style='padding-top:20px;'> <div class="large-12 columns"> <label id='labelID'> my Tooltip label</label> <input type='button' class='button' id=

How to add submenu to zurb foundation Side Nav

六眼飞鱼酱① 提交于 2020-01-13 05:54:14
问题 I am looking for a Side Nav with multilevel items. By default zurb foundation 5 does not support sub menus for some reason. http://jsfiddle.net/pvG7V/1/ <ul class="side-nav"> <li><a href="#">Link 1</a> </li> <li><a href="#">Link 2</a> </li> <li class="divider"></li> <li><a href="#">Link 3</a> </li> <ul> <li><a href="#">Link 1</a> </li> <li><a href="#">Link 2</a> </li> </ul> <li><a href="#">Link 4</a> </li> </ul> Can this be changed to support submenus with an indicator for sub menu like an

What version of Foundation is used in cakePHP3?

為{幸葍}努か 提交于 2020-01-13 05:01:11
问题 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. 回答1: The CakPHP application templates base.css file was last updated with foundation on September the 1st

HTML / Javascript - Expand and collapse table rows (childs) by clicking on a parent row

喜你入骨 提交于 2020-01-12 07:49:10
问题 I am trying to solve one issue since days and finally understood that I will not succeed without help ... I want to do a common thing that we see on internet everyday : be able to click on a table row in order to show more details. But here more details does not mean a block of text but child rows which have same shape as parent rows. Here is an example of HTML table : <table class="collapse table"> <tr> <th>Age</th> <th>Sex</th> <th>Name</th> <th>From</th> </tr> <tr class="parent"> <td>100<