Browse Source

Foundation 6.4.2. On garde cependant la grille 'float'. Dans la mesure du possible, on essaiera de réserver la grille XY à Foundation 7

svn/root/tags/v6.7.6
p@henix.be 5 years ago
parent
commit
c773fa3bca
  1. 6484
      lib/foundation-6/css/foundation.css
  2. 3
      lib/foundation-6/css/foundation.min.css
  3. 240
      lib/foundation-6/index.html
  4. 18842
      lib/foundation-6/js/vendor/foundation.js
  5. 9
      lib/foundation-6/js/vendor/foundation.min.js
  6. 3225
      lib/foundation-6/js/vendor/jquery.js
  7. 306
      lib/foundation-6/js/vendor/what-input.js

6484
lib/foundation-6/css/foundation.css vendored

File diff suppressed because it is too large Load Diff

3
lib/foundation-6/css/foundation.min.css vendored

File diff suppressed because one or more lines are too long

240
lib/foundation-6/index.html

@ -9,154 +9,156 @@
<link rel="stylesheet" href="css/app.css">
</head>
<body>
<div class="row">
<div class="large-12 columns">
<h1>Welcome to Foundation</h1>
<div class="grid-container">
<div class="grid-x grid-padding-x">
<div class="large-12 cell">
<h1>Welcome to Foundation</h1>
</div>
</div>
</div>
<div class="row">
<div class="large-12 columns">
<div class="callout">
<h3>We&rsquo;re stoked you want to try Foundation! </h3>
<p>To get going, this file (index.html) includes some basic styles you can modify, play around with, or totally destroy to get going.</p>
<p>Once you've exhausted the fun in this document, you should check out:</p>
<div class="row">
<div class="large-4 medium-4 columns">
<p><a href="http://foundation.zurb.com/docs">Foundation Documentation</a><br />Everything you need to know about using the framework.</p>
</div>
<div class="large-4 medium-4 columns">
<p><a href="http://zurb.com/university/code-skills">Foundation Code Skills</a><br />These online courses offer you a chance to better understand how Foundation works and how you can master it to create awesome projects.</p>
</div>
<div class="large-4 medium-4 columns">
<p><a href="http://foundation.zurb.com/forum">Foundation Forum</a><br />Join the Foundation community to ask a question or show off your knowlege.</p>
</div>
</div>
<div class="row">
<div class="large-4 medium-4 medium-push-2 columns">
<p><a href="http://github.com/zurb/foundation">Foundation on Github</a><br />Latest code, issue reports, feature requests and more.</p>
<div class="grid-x grid-padding-x">
<div class="large-12 cell">
<div class="callout">
<h3>We&rsquo;re stoked you want to try Foundation! </h3>
<p>To get going, this file (index.html) includes some basic styles you can modify, play around with, or totally destroy to get going.</p>
<p>Once you've exhausted the fun in this document, you should check out:</p>
<div class="grid-x grid-padding-x">
<div class="large-4 medium-4 cell">
<p><a href="http://foundation.zurb.com/docs">Foundation Documentation</a><br />Everything you need to know about using the framework.</p>
</div>
<div class="large-4 medium-4 cell">
<p><a href="http://zurb.com/university/code-skills">Foundation Code Skills</a><br />These online courses offer you a chance to better understand how Foundation works and how you can master it to create awesome projects.</p>
</div>
<div class="large-4 medium-4 cell">
<p><a href="http://foundation.zurb.com/forum">Foundation Forum</a><br />Join the Foundation community to ask a question or show off your knowlege.</p>
</div>
</div>
<div class="large-4 medium-4 medium-pull-2 columns">
<p><a href="https://twitter.com/ZURBfoundation">@zurbfoundation</a><br />Ping us on Twitter if you have questions. When you build something with this we'd love to see it (and send you a totally boss sticker).</p>
<div class="grid-x grid-padding-x">
<div class="large-4 medium-4 medium-push-2 cell">
<p><a href="http://github.com/zurb/foundation">Foundation on Github</a><br />Latest code, issue reports, feature requests and more.</p>
</div>
<div class="large-4 medium-4 medium-pull-2 cell">
<p><a href="https://twitter.com/ZURBfoundation">@zurbfoundation</a><br />Ping us on Twitter if you have questions. When you build something with this we'd love to see it (and send you a totally boss sticker).</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="large-8 medium-8 columns">
<h5>Here&rsquo;s your basic grid:</h5>
<!-- Grid Example -->
<div class="grid-x grid-padding-x">
<div class="large-8 medium-8 cell">
<h5>Here&rsquo;s your basic grid:</h5>
<!-- Grid Example -->
<div class="row">
<div class="large-12 columns">
<div class="primary callout">
<p><strong>This is a twelve column section in a row.</strong> Each of these includes a div.callout element so you can see where the columns are - it's not required at all for the grid.</p>
<div class="grid-x grid-padding-x">
<div class="large-12 cell">
<div class="primary callout">
<p><strong>This is a twelve cell section in a grid-x.</strong> Each of these includes a div.callout element so you can see where the cell are - it's not required at all for the grid.</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="large-6 medium-6 columns">
<div class="primary callout">
<p>Six columns</p>
<div class="grid-x grid-padding-x">
<div class="large-6 medium-6 cell">
<div class="primary callout">
<p>Six cell</p>
</div>
</div>
</div>
<div class="large-6 medium-6 columns">
<div class="primary callout">
<p>Six columns</p>
<div class="large-6 medium-6 cell">
<div class="primary callout">
<p>Six cell</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="large-4 medium-4 small-4 columns">
<div class="primary callout">
<p>Four columns</p>
<div class="grid-x grid-padding-x">
<div class="large-4 medium-4 small-4 cell">
<div class="primary callout">
<p>Four cell</p>
</div>
</div>
</div>
<div class="large-4 medium-4 small-4 columns">
<div class="primary callout">
<p>Four columns</p>
<div class="large-4 medium-4 small-4 cell">
<div class="primary callout">
<p>Four cell</p>
</div>
</div>
</div>
<div class="large-4 medium-4 small-4 columns">
<div class="primary callout">
<p>Four columns</p>
<div class="large-4 medium-4 small-4 cell">
<div class="primary callout">
<p>Four cell</p>
</div>
</div>
</div>
</div>
<hr />
<hr />
<h5>We bet you&rsquo;ll need a form somewhere:</h5>
<form>
<div class="row">
<div class="large-12 columns">
<label>Input Label</label>
<input type="text" placeholder="large-12.columns" />
</div>
</div>
<div class="row">
<div class="large-4 medium-4 columns">
<label>Input Label</label>
<input type="text" placeholder="large-4.columns" />
</div>
<div class="large-4 medium-4 columns">
<label>Input Label</label>
<input type="text" placeholder="large-4.columns" />
<h5>We bet you&rsquo;ll need a form somewhere:</h5>
<form>
<div class="grid-x grid-padding-x">
<div class="large-12 cell">
<label>Input Label</label>
<input type="text" placeholder="large-12.cell" />
</div>
</div>
<div class="large-4 medium-4 columns">
<div class="row collapse">
<div class="grid-x grid-padding-x">
<div class="large-4 medium-4 cell">
<label>Input Label</label>
<input type="text" placeholder="large-4.cell" />
</div>
<div class="large-4 medium-4 cell">
<label>Input Label</label>
<div class="input-group">
<input type="text" placeholder="small-9.columns" class="input-group-field" />
<span class="input-group-label">.com</span>
<input type="text" placeholder="large-4.cell" />
</div>
<div class="large-4 medium-4 cell">
<div class="grid-x">
<label>Input Label</label>
<div class="input-group">
<input type="text" placeholder="small-9.cell" class="input-group-field" />
<span class="input-group-label">.com</span>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="large-12 columns">
<label>Select Box</label>
<select>
<option value="husker">Husker</option>
<option value="starbuck">Starbuck</option>
<option value="hotdog">Hot Dog</option>
<option value="apollo">Apollo</option>
</select>
</div>
</div>
<div class="row">
<div class="large-6 medium-6 columns">
<label>Choose Your Favorite</label>
<input type="radio" name="pokemon" value="Red" id="pokemonRed"><label for="pokemonRed">Radio 1</label>
<input type="radio" name="pokemon" value="Blue" id="pokemonBlue"><label for="pokemonBlue">Radio 2</label>
<div class="grid-x grid-padding-x">
<div class="large-12 cell">
<label>Select Box</label>
<select>
<option value="husker">Husker</option>
<option value="starbuck">Starbuck</option>
<option value="hotdog">Hot Dog</option>
<option value="apollo">Apollo</option>
</select>
</div>
</div>
<div class="large-6 medium-6 columns">
<label>Check these out</label>
<input id="checkbox1" type="checkbox"><label for="checkbox1">Checkbox 1</label>
<input id="checkbox2" type="checkbox"><label for="checkbox2">Checkbox 2</label>
<div class="grid-x grid-padding-x">
<div class="large-6 medium-6 cell">
<label>Choose Your Favorite</label>
<input type="radio" name="pokemon" value="Red" id="pokemonRed"><label for="pokemonRed">Radio 1</label>
<input type="radio" name="pokemon" value="Blue" id="pokemonBlue"><label for="pokemonBlue">Radio 2</label>
</div>
<div class="large-6 medium-6 cell">
<label>Check these out</label>
<input id="checkbox1" type="checkbox"><label for="checkbox1">Checkbox 1</label>
<input id="checkbox2" type="checkbox"><label for="checkbox2">Checkbox 2</label>
</div>
</div>
</div>
<div class="row">
<div class="large-12 columns">
<label>Textarea Label</label>
<textarea placeholder="small-12.columns"></textarea>
<div class="grid-x grid-padding-x">
<div class="large-12 cell">
<label>Textarea Label</label>
<textarea placeholder="small-12.cell"></textarea>
</div>
</div>
</div>
</form>
</div>
</form>
</div>
<div class="large-4 medium-4 columns">
<h5>Try one of these buttons:</h5>
<p><a href="#" class="button">Simple Button</a><br/>
<a href="#" class="success button">Success Btn</a><br/>
<a href="#" class="alert button">Alert Btn</a><br/>
<a href="#" class="secondary button">Secondary Btn</a></p>
<div class="callout">
<h5>So many components, girl!</h5>
<p>A whole kitchen sink of goodies comes with Foundation. Check out the docs to see them all, along with details on making them your own.</p>
<a href="http://foundation.zurb.com/sites/docs/" class="small button">Go to Foundation Docs</a>
<div class="large-4 medium-4 cell">
<h5>Try one of these buttons:</h5>
<p><a href="#" class="button">Simple Button</a><br/>
<a href="#" class="success button">Success Btn</a><br/>
<a href="#" class="alert button">Alert Btn</a><br/>
<a href="#" class="secondary button">Secondary Btn</a></p>
<div class="callout">
<h5>So many components, girl!</h5>
<p>A whole kitchen sink of goodies comes with Foundation. Check out the docs to see them all, along with details on making them your own.</p>
<a href="http://foundation.zurb.com/sites/docs/" class="small button">Go to Foundation Docs</a>
</div>
</div>
</div>
</div>

18842
lib/foundation-6/js/vendor/foundation.js vendored

File diff suppressed because it is too large Load Diff

9
lib/foundation-6/js/vendor/foundation.min.js vendored

File diff suppressed because one or more lines are too long

3225
lib/foundation-6/js/vendor/jquery.js vendored

File diff suppressed because it is too large Load Diff

306
lib/foundation-6/js/vendor/what-input.js vendored

@ -1,6 +1,6 @@
/**
* what-input - A global utility for tracking the current input method (mouse, keyboard or touch).
* @version v4.0.4
* @version v4.2.0
* @link https://github.com/ten1seven/what-input
* @license MIT
*/
@ -58,18 +58,14 @@ return /******/ (function(modules) { // webpackBootstrap
/************************************************************************/
/******/ ([
/* 0 */
/***/ function(module, exports) {
/***/ (function(module, exports) {
module.exports = (function() {
'use strict';
module.exports = function () {
/*
---------------
Variables
---------------
*/
// cache document.documentElement
var docElem = document.documentElement;
* variables
*/
// last used input type
var currentInput = 'initial';
@ -77,41 +73,54 @@ return /******/ (function(modules) { // webpackBootstrap
// last used input intent
var currentIntent = null;
// cache document.documentElement
var doc = document.documentElement;
// form input types
var formInputs = [
'input',
'select',
'textarea'
];
var formInputs = ['input', 'select', 'textarea'];
var functionList = [];
// list of modifier keys commonly used with the mouse and
// can be safely ignored to prevent false keyboard detection
var ignoreMap = [
16, // shift
17, // control
18, // alt
91, // Windows key / left Apple cmd
93 // Windows menu / right Apple cmd
var ignoreMap = [16, // shift
17, // control
18, // alt
91, // Windows key / left Apple cmd
93 // Windows menu / right Apple cmd
];
// list of keys for which we change intent even for form inputs
var changeIntentMap = [9 // tab
];
// mapping of events to input types
var inputMap = {
'keyup': 'keyboard',
'mousedown': 'mouse',
'mousemove': 'mouse',
'MSPointerDown': 'pointer',
'MSPointerMove': 'pointer',
'pointerdown': 'pointer',
'pointermove': 'pointer',
'touchstart': 'touch'
keydown: 'keyboard',
mousedown: 'mouse',
mousemove: 'mouse',
MSPointerDown: 'pointer',
MSPointerMove: 'pointer',
pointerdown: 'pointer',
pointermove: 'pointer',
touchstart: 'touch'
};
// array of all used input types
var inputTypes = [];
// boolean: true if touch buffer timer is running
// boolean: true if touch buffer is active
var isBuffering = false;
// boolean: true if the page is being scrolled
var isScrolling = false;
// store current mouse position
var mousePos = {
x: null,
y: null
};
// map of IE 10 pointer events
var pointerMap = {
2: 'touch',
@ -119,18 +128,23 @@ return /******/ (function(modules) { // webpackBootstrap
4: 'mouse'
};
// touch buffer timer
var touchTimer = null;
var supportsPassive = false;
try {
var opts = Object.defineProperty({}, 'passive', {
get: function get() {
supportsPassive = true;
}
});
/*
---------------
Set up
---------------
*/
window.addEventListener('test', null, opts);
} catch (e) {}
var setUp = function() {
/*
* set up
*/
var setUp = function setUp() {
// add correct mouse wheel event mapping to `inputMap`
inputMap[detectWheel()] = 'mouse';
@ -138,75 +152,63 @@ return /******/ (function(modules) { // webpackBootstrap
setInput();
};
/*
---------------
Events
---------------
*/
var addListeners = function() {
* events
*/
var addListeners = function addListeners() {
// `pointermove`, `MSPointerMove`, `mousemove` and mouse wheel event binding
// can only demonstrate potential, but not actual, interaction
// and are treated separately
// pointer events (mouse, pen, touch)
if (window.PointerEvent) {
docElem.addEventListener('pointerdown', updateInput);
docElem.addEventListener('pointermove', setIntent);
doc.addEventListener('pointerdown', updateInput);
doc.addEventListener('pointermove', setIntent);
} else if (window.MSPointerEvent) {
docElem.addEventListener('MSPointerDown', updateInput);
docElem.addEventListener('MSPointerMove', setIntent);
doc.addEventListener('MSPointerDown', updateInput);
doc.addEventListener('MSPointerMove', setIntent);
} else {
// mouse events
docElem.addEventListener('mousedown', updateInput);
docElem.addEventListener('mousemove', setIntent);
doc.addEventListener('mousedown', updateInput);
doc.addEventListener('mousemove', setIntent);
// touch events
if ('ontouchstart' in window) {
docElem.addEventListener('touchstart', touchBuffer);
doc.addEventListener('touchstart', touchBuffer);
doc.addEventListener('touchend', touchBuffer);
}
}
// mouse wheel
docElem.addEventListener(detectWheel(), setIntent);
doc.addEventListener(detectWheel(), setIntent, supportsPassive ? { passive: true } : false);
// keyboard events
docElem.addEventListener('keydown', updateInput);
docElem.addEventListener('keyup', updateInput);
doc.addEventListener('keydown', updateInput);
};
// checks conditions before updating new input
var updateInput = function(event) {
var updateInput = function updateInput(event) {
// only execute if the touch buffer timer isn't running
if (!isBuffering) {
var eventKey = event.which;
var value = inputMap[event.type];
if (value === 'pointer') value = pointerType(event);
if (
currentInput !== value ||
currentIntent !== value
) {
var activeInput = (
document.activeElement &&
formInputs.indexOf(document.activeElement.nodeName.toLowerCase()) === -1
) ? true : false;
if (
value === 'touch' ||
if (currentInput !== value || currentIntent !== value) {
var activeElem = document.activeElement;
var activeInput = false;
var notFormInput = activeElem && activeElem.nodeName && formInputs.indexOf(activeElem.nodeName.toLowerCase()) === -1;
// ignore mouse modifier keys
(value === 'mouse' && ignoreMap.indexOf(eventKey) === -1) ||
// don't switch if the current element is a form input
(value === 'keyboard' && activeInput)
) {
if (notFormInput || changeIntentMap.indexOf(eventKey) !== -1) {
activeInput = true;
}
if (value === 'touch' ||
// ignore mouse modifier keys
value === 'mouse' ||
// don't switch if the current element is a form input
value === 'keyboard' && eventKey && activeInput && ignoreMap.indexOf(eventKey) === -1) {
// set the current and catch-all variable
currentInput = currentIntent = value;
@ -217,119 +219,143 @@ return /******/ (function(modules) { // webpackBootstrap
};
// updates the doc and `inputTypes` array with new input
var setInput = function() {
docElem.setAttribute('data-whatinput', currentInput);
docElem.setAttribute('data-whatintent', currentInput);
var setInput = function setInput() {
doc.setAttribute('data-whatinput', currentInput);
doc.setAttribute('data-whatintent', currentInput);
if (inputTypes.indexOf(currentInput) === -1) {
inputTypes.push(currentInput);
docElem.className += ' whatinput-types-' + currentInput;
doc.className += ' whatinput-types-' + currentInput;
}
fireFunctions('input');
};
// updates input intent for `mousemove` and `pointermove`
var setIntent = function(event) {
var setIntent = function setIntent(event) {
// test to see if `mousemove` happened relative to the screen
// to detect scrolling versus mousemove
if (mousePos['x'] !== event.screenX || mousePos['y'] !== event.screenY) {
isScrolling = false;
mousePos['x'] = event.screenX;
mousePos['y'] = event.screenY;
} else {
isScrolling = true;
}
// only execute if the touch buffer timer isn't running
if (!isBuffering) {
// or scrolling isn't happening
if (!isBuffering && !isScrolling) {
var value = inputMap[event.type];
if (value === 'pointer') value = pointerType(event);
if (currentIntent !== value) {
currentIntent = value;
docElem.setAttribute('data-whatintent', currentIntent);
doc.setAttribute('data-whatintent', currentIntent);
fireFunctions('intent');
}
}
};
// buffers touch events because they frequently also fire mouse events
var touchBuffer = function(event) {
// clear the timer if it happens to be running
window.clearTimeout(touchTimer);
// set the current input
updateInput(event);
// set the isBuffering to `true`
isBuffering = true;
// run the timer
touchTimer = window.setTimeout(function() {
// if the timer runs out, set isBuffering back to `false`
var touchBuffer = function touchBuffer(event) {
if (event.type === 'touchstart') {
isBuffering = false;
}, 200);
// set the current input
updateInput(event);
} else {
isBuffering = true;
}
};
var fireFunctions = function fireFunctions(type) {
for (var i = 0, len = functionList.length; i < len; i++) {
if (functionList[i].type === type) {
functionList[i].function.call(undefined, currentIntent);
}
}
};
/*
---------------
Utilities
---------------
*/
* utilities
*/
var pointerType = function(event) {
if (typeof event.pointerType === 'number') {
var pointerType = function pointerType(event) {
if (typeof event.pointerType === 'number') {
return pointerMap[event.pointerType];
} else {
return (event.pointerType === 'pen') ? 'touch' : event.pointerType; // treat pen like touch
}
} else {
// treat pen like touch
return event.pointerType === 'pen' ? 'touch' : event.pointerType;
}
};
// detect version of mouse wheel event to use
// via https://developer.mozilla.org/en-US/docs/Web/Events/wheel
var detectWheel = function() {
return 'onwheel' in document.createElement('div') ?
'wheel' : // Modern browsers support "wheel"
var detectWheel = function detectWheel() {
var wheelType = void 0;
document.onmousewheel !== undefined ?
'mousewheel' : // Webkit and IE support at least "mousewheel"
'DOMMouseScroll'; // let's assume that remaining browsers are older Firefox
};
// Modern browsers support "wheel"
if ('onwheel' in document.createElement('div')) {
wheelType = 'wheel';
} else {
// Webkit and IE support at least "mousewheel"
// or assume that remaining browsers are older Firefox
wheelType = document.onmousewheel !== undefined ? 'mousewheel' : 'DOMMouseScroll';
}
return wheelType;
};
/*
---------------
Init
don't start script unless browser cuts the mustard
(also passes if polyfills are used)
---------------
*/
if (
'addEventListener' in window &&
Array.prototype.indexOf
) {
* init
*/
// don't start script unless browser cuts the mustard
// (also passes if polyfills are used)
if ('addEventListener' in window && Array.prototype.indexOf) {
setUp();
}
/*
---------------
API
---------------
*/
* api
*/
return {
// returns string: the current input type
// opt: 'loose'|'strict'
// 'strict' (default): returns the same value as the `data-whatinput` attribute
// 'loose': includes `data-whatintent` value if it's more current than `data-whatinput`
ask: function(opt) { return (opt === 'loose') ? currentIntent : currentInput; },
ask: function ask(opt) {
return opt === 'loose' ? currentIntent : currentInput;
},
// returns array: all the detected input types
types: function() { return inputTypes; }
types: function types() {
return inputTypes;
},
// overwrites ignored keys with provided array
ignoreKeys: function ignoreKeys(arr) {
ignoreMap = arr;
},
// attach functions to input and intent "events"
// funct: function to fire on change
// eventType: 'input'|'intent'
onChange: function onChange(funct, eventType) {
functionList.push({
function: funct,
type: eventType
});
}
};
}();
}());
/***/ }
/***/ })
/******/ ])
});
;
Loading…
Cancel
Save