Premier Upload
This commit is contained in:
IsserTerrus
parent
0299612a81
commit
6af7ca0838
Binary file not shown.
|
After Width: | Height: | Size: 168 KiB |
|
|
@ -0,0 +1,500 @@
|
|||
/*
|
||||
|
||||
Holder - 2.2 - client side image placeholders
|
||||
(c) 2012-2013 Ivan Malopinsky / http://imsky.co
|
||||
|
||||
Provided under the MIT License.
|
||||
Commercial use requires attribution.
|
||||
|
||||
*/
|
||||
|
||||
var Holder = Holder || {};
|
||||
(function (app, win) {
|
||||
|
||||
var preempted = false,
|
||||
fallback = false,
|
||||
canvas = document.createElement('canvas');
|
||||
var dpr = 1, bsr = 1;
|
||||
var resizable_images = [];
|
||||
|
||||
if (!canvas.getContext) {
|
||||
fallback = true;
|
||||
} else {
|
||||
if (canvas.toDataURL("image/png")
|
||||
.indexOf("data:image/png") < 0) {
|
||||
//Android doesn't support data URI
|
||||
fallback = true;
|
||||
} else {
|
||||
var ctx = canvas.getContext("2d");
|
||||
}
|
||||
}
|
||||
|
||||
if(!fallback){
|
||||
dpr = window.devicePixelRatio || 1,
|
||||
bsr = ctx.webkitBackingStorePixelRatio || ctx.mozBackingStorePixelRatio || ctx.msBackingStorePixelRatio || ctx.oBackingStorePixelRatio || ctx.backingStorePixelRatio || 1;
|
||||
}
|
||||
|
||||
var ratio = dpr / bsr;
|
||||
|
||||
var settings = {
|
||||
domain: "holder.js",
|
||||
images: "img",
|
||||
bgnodes: ".holderjs",
|
||||
themes: {
|
||||
"gray": {
|
||||
background: "#eee",
|
||||
foreground: "#aaa",
|
||||
size: 12
|
||||
},
|
||||
"social": {
|
||||
background: "#3a5a97",
|
||||
foreground: "#fff",
|
||||
size: 12
|
||||
},
|
||||
"industrial": {
|
||||
background: "#434A52",
|
||||
foreground: "#C2F200",
|
||||
size: 12
|
||||
},
|
||||
"sky": {
|
||||
background: "#0D8FDB",
|
||||
foreground: "#fff",
|
||||
size: 12
|
||||
},
|
||||
"vine": {
|
||||
background: "#39DBAC",
|
||||
foreground: "#1E292C",
|
||||
size: 12
|
||||
},
|
||||
"lava": {
|
||||
background: "#F8591A",
|
||||
foreground: "#1C2846",
|
||||
size: 12
|
||||
}
|
||||
},
|
||||
stylesheet: ""
|
||||
};
|
||||
app.flags = {
|
||||
dimensions: {
|
||||
regex: /^(\d+)x(\d+)$/,
|
||||
output: function (val) {
|
||||
var exec = this.regex.exec(val);
|
||||
return {
|
||||
width: +exec[1],
|
||||
height: +exec[2]
|
||||
}
|
||||
}
|
||||
},
|
||||
fluid: {
|
||||
regex: /^([0-9%]+)x([0-9%]+)$/,
|
||||
output: function (val) {
|
||||
var exec = this.regex.exec(val);
|
||||
return {
|
||||
width: exec[1],
|
||||
height: exec[2]
|
||||
}
|
||||
}
|
||||
},
|
||||
colors: {
|
||||
regex: /#([0-9a-f]{3,})\:#([0-9a-f]{3,})/i,
|
||||
output: function (val) {
|
||||
var exec = this.regex.exec(val);
|
||||
return {
|
||||
size: settings.themes.gray.size,
|
||||
foreground: "#" + exec[2],
|
||||
background: "#" + exec[1]
|
||||
}
|
||||
}
|
||||
},
|
||||
text: {
|
||||
regex: /text\:(.*)/,
|
||||
output: function (val) {
|
||||
return this.regex.exec(val)[1];
|
||||
}
|
||||
},
|
||||
font: {
|
||||
regex: /font\:(.*)/,
|
||||
output: function (val) {
|
||||
return this.regex.exec(val)[1];
|
||||
}
|
||||
},
|
||||
auto: {
|
||||
regex: /^auto$/
|
||||
},
|
||||
textmode: {
|
||||
regex: /textmode\:(.*)/,
|
||||
output: function(val){
|
||||
return this.regex.exec(val)[1];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//getElementsByClassName polyfill
|
||||
document.getElementsByClassName||(document.getElementsByClassName=function(e){var t=document,n,r,i,s=[];if(t.querySelectorAll)return t.querySelectorAll("."+e);if(t.evaluate){r=".//*[contains(concat(' ', @class, ' '), ' "+e+" ')]",n=t.evaluate(r,t,null,0,null);while(i=n.iterateNext())s.push(i)}else{n=t.getElementsByTagName("*"),r=new RegExp("(^|\\s)"+e+"(\\s|$)");for(i=0;i<n.length;i++)r.test(n[i].className)&&s.push(n[i])}return s})
|
||||
|
||||
//getComputedStyle polyfill
|
||||
window.getComputedStyle||(window.getComputedStyle=function(e){return this.el=e,this.getPropertyValue=function(t){var n=/(\-([a-z]){1})/g;return t=="float"&&(t="styleFloat"),n.test(t)&&(t=t.replace(n,function(){return arguments[2].toUpperCase()})),e.currentStyle[t]?e.currentStyle[t]:null},this})
|
||||
|
||||
//http://javascript.nwbox.com/ContentLoaded by Diego Perini with modifications
|
||||
function contentLoaded(n,t){var l="complete",s="readystatechange",u=!1,h=u,c=!0,i=n.document,a=i.documentElement,e=i.addEventListener?"addEventListener":"attachEvent",v=i.addEventListener?"removeEventListener":"detachEvent",f=i.addEventListener?"":"on",r=function(e){(e.type!=s||i.readyState==l)&&((e.type=="load"?n:i)[v](f+e.type,r,u),!h&&(h=!0)&&t.call(n,null))},o=function(){try{a.doScroll("left")}catch(n){setTimeout(o,50);return}r("poll")};if(i.readyState==l)t.call(n,"lazy");else{if(i.createEventObject&&a.doScroll){try{c=!n.frameElement}catch(y){}c&&o()}i[e](f+"DOMContentLoaded",r,u),i[e](f+s,r,u),n[e](f+"load",r,u)}}
|
||||
|
||||
//https://gist.github.com/991057 by Jed Schmidt with modifications
|
||||
function selector(a){
|
||||
a=a.match(/^(\W)?(.*)/);var b=document["getElement"+(a[1]?a[1]=="#"?"ById":"sByClassName":"sByTagName")](a[2]);
|
||||
var ret=[]; b!==null&&(b.length?ret=b:b.length===0?ret=b:ret=[b]); return ret;
|
||||
}
|
||||
|
||||
//shallow object property extend
|
||||
function extend(a,b){
|
||||
var c={};
|
||||
for(var i in a){
|
||||
if(a.hasOwnProperty(i)){
|
||||
c[i]=a[i];
|
||||
}
|
||||
}
|
||||
for(var i in b){
|
||||
if(b.hasOwnProperty(i)){
|
||||
c[i]=b[i];
|
||||
}
|
||||
}
|
||||
return c
|
||||
}
|
||||
|
||||
//hasOwnProperty polyfill
|
||||
if (!Object.prototype.hasOwnProperty)
|
||||
/*jshint -W001, -W103 */
|
||||
Object.prototype.hasOwnProperty = function(prop) {
|
||||
var proto = this.__proto__ || this.constructor.prototype;
|
||||
return (prop in this) && (!(prop in proto) || proto[prop] !== this[prop]);
|
||||
}
|
||||
/*jshint +W001, +W103 */
|
||||
|
||||
function text_size(width, height, template) {
|
||||
height = parseInt(height, 10);
|
||||
width = parseInt(width, 10);
|
||||
var bigSide = Math.max(height, width)
|
||||
var smallSide = Math.min(height, width)
|
||||
var scale = 1 / 12;
|
||||
var newHeight = Math.min(smallSide * 0.75, 0.75 * bigSide * scale);
|
||||
return {
|
||||
height: Math.round(Math.max(template.size, newHeight))
|
||||
}
|
||||
}
|
||||
|
||||
function draw(args) {
|
||||
var ctx = args.ctx;
|
||||
var dimensions = args.dimensions;
|
||||
var template = args.template;
|
||||
var ratio = args.ratio;
|
||||
var holder = args.holder;
|
||||
var literal = holder.textmode == "literal";
|
||||
var exact = holder.textmode == "exact";
|
||||
|
||||
var ts = text_size(dimensions.width, dimensions.height, template);
|
||||
var text_height = ts.height;
|
||||
var width = dimensions.width * ratio,
|
||||
height = dimensions.height * ratio;
|
||||
var font = template.font ? template.font : "sans-serif";
|
||||
canvas.width = width;
|
||||
canvas.height = height;
|
||||
ctx.textAlign = "center";
|
||||
ctx.textBaseline = "middle";
|
||||
ctx.fillStyle = template.background;
|
||||
ctx.fillRect(0, 0, width, height);
|
||||
ctx.fillStyle = template.foreground;
|
||||
ctx.font = "bold " + text_height + "px " + font;
|
||||
var text = template.text ? template.text : (Math.floor(dimensions.width) + "x" + Math.floor(dimensions.height));
|
||||
if (literal) {
|
||||
var dimensions = holder.dimensions;
|
||||
text = dimensions.width + "x" + dimensions.height;
|
||||
}
|
||||
else if(exact && holder.exact_dimensions){
|
||||
var dimensions = holder.exact_dimensions;
|
||||
text = (Math.floor(dimensions.width) + "x" + Math.floor(dimensions.height));
|
||||
}
|
||||
var text_width = ctx.measureText(text).width;
|
||||
if (text_width / width >= 0.75) {
|
||||
text_height = Math.floor(text_height * 0.75 * (width / text_width));
|
||||
}
|
||||
//Resetting font size if necessary
|
||||
ctx.font = "bold " + (text_height * ratio) + "px " + font;
|
||||
ctx.fillText(text, (width / 2), (height / 2), width);
|
||||
return canvas.toDataURL("image/png");
|
||||
}
|
||||
|
||||
function render(mode, el, holder, src) {
|
||||
|
||||
var dimensions = holder.dimensions,
|
||||
theme = holder.theme,
|
||||
text = holder.text ? decodeURIComponent(holder.text) : holder.text;
|
||||
var dimensions_caption = dimensions.width + "x" + dimensions.height;
|
||||
theme = (text ? extend(theme, {
|
||||
text: text
|
||||
}) : theme);
|
||||
theme = (holder.font ? extend(theme, {
|
||||
font: holder.font
|
||||
}) : theme);
|
||||
el.setAttribute("data-src", src);
|
||||
holder.theme = theme;
|
||||
el.holder_data = holder;
|
||||
|
||||
if (mode == "image") {
|
||||
el.setAttribute("alt", text ? text : theme.text ? theme.text + " [" + dimensions_caption + "]" : dimensions_caption);
|
||||
if (fallback || !holder.auto) {
|
||||
el.style.width = dimensions.width + "px";
|
||||
el.style.height = dimensions.height + "px";
|
||||
}
|
||||
if (fallback) {
|
||||
el.style.backgroundColor = theme.background;
|
||||
} else {
|
||||
el.setAttribute("src", draw({ctx: ctx, dimensions: dimensions, template: theme, ratio:ratio, holder: holder}));
|
||||
|
||||
if(holder.textmode && holder.textmode == "exact"){
|
||||
resizable_images.push(el);
|
||||
resizable_update(el);
|
||||
}
|
||||
|
||||
}
|
||||
} else if (mode == "background") {
|
||||
if (!fallback) {
|
||||
el.style.backgroundImage = "url(" + draw({ctx:ctx, dimensions: dimensions, template: theme, ratio: ratio, holder: holder}) + ")";
|
||||
el.style.backgroundSize = dimensions.width + "px " + dimensions.height + "px";
|
||||
}
|
||||
} else if (mode == "fluid") {
|
||||
el.setAttribute("alt", text ? text : theme.text ? theme.text + " [" + dimensions_caption + "]" : dimensions_caption);
|
||||
if (dimensions.height.slice(-1) == "%") {
|
||||
el.style.height = dimensions.height
|
||||
} else {
|
||||
el.style.height = dimensions.height + "px"
|
||||
}
|
||||
if (dimensions.width.slice(-1) == "%") {
|
||||
el.style.width = dimensions.width
|
||||
} else {
|
||||
el.style.width = dimensions.width + "px"
|
||||
}
|
||||
if (el.style.display == "inline" || el.style.display === "" || el.style.display == "none") {
|
||||
el.style.display = "block";
|
||||
}
|
||||
if (fallback) {
|
||||
el.style.backgroundColor = theme.background;
|
||||
} else {
|
||||
resizable_images.push(el);
|
||||
resizable_update(el);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function dimension_check(el, callback) {
|
||||
var dimensions = {
|
||||
height: el.clientHeight,
|
||||
width: el.clientWidth
|
||||
};
|
||||
if (!dimensions.height && !dimensions.width) {
|
||||
if (el.hasAttribute("data-holder-invisible")) {
|
||||
throw new Error("Holder: placeholder is not visible");
|
||||
} else {
|
||||
el.setAttribute("data-holder-invisible", true)
|
||||
setTimeout(function () {
|
||||
callback.call(this, el)
|
||||
}, 1)
|
||||
return null;
|
||||
}
|
||||
} else {
|
||||
el.removeAttribute("data-holder-invisible")
|
||||
}
|
||||
return dimensions;
|
||||
}
|
||||
|
||||
function resizable_update(element) {
|
||||
var images;
|
||||
if (element.nodeType == null) {
|
||||
images = resizable_images;
|
||||
} else {
|
||||
images = [element]
|
||||
}
|
||||
for (var i in images) {
|
||||
if (!images.hasOwnProperty(i)) {
|
||||
continue;
|
||||
}
|
||||
var el = images[i]
|
||||
if (el.holder_data) {
|
||||
var holder = el.holder_data;
|
||||
var dimensions = dimension_check(el, resizable_update)
|
||||
if(dimensions){
|
||||
if(holder.fluid){
|
||||
el.setAttribute("src", draw({
|
||||
ctx: ctx,
|
||||
dimensions: dimensions,
|
||||
template: holder.theme,
|
||||
ratio: ratio,
|
||||
holder: holder
|
||||
}))
|
||||
}
|
||||
if(holder.textmode && holder.textmode == "exact"){
|
||||
holder.exact_dimensions = dimensions;
|
||||
el.setAttribute("src", draw({
|
||||
ctx: ctx,
|
||||
dimensions: holder.dimensions,
|
||||
template: holder.theme,
|
||||
ratio: ratio,
|
||||
holder: holder
|
||||
}))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function parse_flags(flags, options) {
|
||||
var ret = {
|
||||
theme: extend(settings.themes.gray, {})
|
||||
};
|
||||
var render = false;
|
||||
for (sl = flags.length, j = 0; j < sl; j++) {
|
||||
var flag = flags[j];
|
||||
if (app.flags.dimensions.match(flag)) {
|
||||
render = true;
|
||||
ret.dimensions = app.flags.dimensions.output(flag);
|
||||
} else if (app.flags.fluid.match(flag)) {
|
||||
render = true;
|
||||
ret.dimensions = app.flags.fluid.output(flag);
|
||||
ret.fluid = true;
|
||||
} else if (app.flags.textmode.match(flag)) {
|
||||
ret.textmode = app.flags.textmode.output(flag)
|
||||
} else if (app.flags.colors.match(flag)) {
|
||||
ret.theme = app.flags.colors.output(flag);
|
||||
} else if (options.themes[flag]) {
|
||||
//If a theme is specified, it will override custom colors
|
||||
if(options.themes.hasOwnProperty(flag)){
|
||||
ret.theme = extend(options.themes[flag], {});
|
||||
}
|
||||
} else if (app.flags.font.match(flag)) {
|
||||
ret.font = app.flags.font.output(flag);
|
||||
} else if (app.flags.auto.match(flag)) {
|
||||
ret.auto = true;
|
||||
} else if (app.flags.text.match(flag)) {
|
||||
ret.text = app.flags.text.output(flag);
|
||||
}
|
||||
}
|
||||
return render ? ret : false;
|
||||
}
|
||||
|
||||
for (var flag in app.flags) {
|
||||
if (!app.flags.hasOwnProperty(flag)) continue;
|
||||
app.flags[flag].match = function (val) {
|
||||
return val.match(this.regex)
|
||||
}
|
||||
}
|
||||
app.add_theme = function (name, theme) {
|
||||
name != null && theme != null && (settings.themes[name] = theme);
|
||||
return app;
|
||||
};
|
||||
app.add_image = function (src, el) {
|
||||
var node = selector(el);
|
||||
if (node.length) {
|
||||
for (var i = 0, l = node.length; i < l; i++) {
|
||||
var img = document.createElement("img")
|
||||
img.setAttribute("data-src", src);
|
||||
node[i].appendChild(img);
|
||||
}
|
||||
}
|
||||
return app;
|
||||
};
|
||||
app.run = function (o) {
|
||||
preempted = true;
|
||||
|
||||
var options = extend(settings, o),
|
||||
images = [],
|
||||
imageNodes = [],
|
||||
bgnodes = [];
|
||||
if (typeof (options.images) == "string") {
|
||||
imageNodes = selector(options.images);
|
||||
} else if (window.NodeList && options.images instanceof window.NodeList) {
|
||||
imageNodes = options.images;
|
||||
} else if (window.Node && options.images instanceof window.Node) {
|
||||
imageNodes = [options.images];
|
||||
}
|
||||
|
||||
if (typeof (options.bgnodes) == "string") {
|
||||
bgnodes = selector(options.bgnodes);
|
||||
} else if (window.NodeList && options.elements instanceof window.NodeList) {
|
||||
bgnodes = options.bgnodes;
|
||||
} else if (window.Node && options.bgnodes instanceof window.Node) {
|
||||
bgnodes = [options.bgnodes];
|
||||
}
|
||||
for (i = 0, l = imageNodes.length; i < l; i++) images.push(imageNodes[i]);
|
||||
var holdercss = document.getElementById("holderjs-style");
|
||||
if (!holdercss) {
|
||||
holdercss = document.createElement("style");
|
||||
holdercss.setAttribute("id", "holderjs-style");
|
||||
holdercss.type = "text/css";
|
||||
document.getElementsByTagName("head")[0].appendChild(holdercss);
|
||||
}
|
||||
if (!options.nocss) {
|
||||
if (holdercss.styleSheet) {
|
||||
holdercss.styleSheet.cssText += options.stylesheet;
|
||||
} else {
|
||||
holdercss.appendChild(document.createTextNode(options.stylesheet));
|
||||
}
|
||||
}
|
||||
var cssregex = new RegExp(options.domain + "\/(.*?)\"?\\)");
|
||||
for (var l = bgnodes.length, i = 0; i < l; i++) {
|
||||
var src = window.getComputedStyle(bgnodes[i], null)
|
||||
.getPropertyValue("background-image");
|
||||
var flags = src.match(cssregex);
|
||||
var bgsrc = bgnodes[i].getAttribute("data-background-src");
|
||||
if (flags) {
|
||||
var holder = parse_flags(flags[1].split("/"), options);
|
||||
if (holder) {
|
||||
render("background", bgnodes[i], holder, src);
|
||||
}
|
||||
} else if (bgsrc != null) {
|
||||
var holder = parse_flags(bgsrc.substr(bgsrc.lastIndexOf(options.domain) + options.domain.length + 1)
|
||||
.split("/"), options);
|
||||
if (holder) {
|
||||
render("background", bgnodes[i], holder, src);
|
||||
}
|
||||
}
|
||||
}
|
||||
for (l = images.length, i = 0; i < l; i++) {
|
||||
var attr_data_src, attr_src;
|
||||
attr_src = attr_data_src = src = null;
|
||||
try {
|
||||
attr_src = images[i].getAttribute("src");
|
||||
attr_datasrc = images[i].getAttribute("data-src");
|
||||
} catch (e) {}
|
||||
if (attr_datasrc == null && !! attr_src && attr_src.indexOf(options.domain) >= 0) {
|
||||
src = attr_src;
|
||||
} else if ( !! attr_datasrc && attr_datasrc.indexOf(options.domain) >= 0) {
|
||||
src = attr_datasrc;
|
||||
}
|
||||
if (src) {
|
||||
var holder = parse_flags(src.substr(src.lastIndexOf(options.domain) + options.domain.length + 1)
|
||||
.split("/"), options);
|
||||
if (holder) {
|
||||
if (holder.fluid) {
|
||||
render("fluid", images[i], holder, src)
|
||||
} else {
|
||||
render("image", images[i], holder, src);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return app;
|
||||
};
|
||||
contentLoaded(win, function () {
|
||||
if (window.addEventListener) {
|
||||
window.addEventListener("resize", resizable_update, false);
|
||||
window.addEventListener("orientationchange", resizable_update, false);
|
||||
} else {
|
||||
window.attachEvent("onresize", resizable_update)
|
||||
}
|
||||
preempted || app.run();
|
||||
});
|
||||
if (typeof define === "function" && define.amd) {
|
||||
define([], function () {
|
||||
return app;
|
||||
});
|
||||
}
|
||||
|
||||
})(Holder, window);
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,51 @@
|
|||
// NOTICE!! DO NOT USE ANY OF THIS JAVASCRIPT
|
||||
// IT'S JUST JUNK FOR OUR DOCS!
|
||||
// ++++++++++++++++++++++++++++++++++++++++++
|
||||
/*!
|
||||
* Copyright 2014-2015 Twitter, Inc.
|
||||
*
|
||||
* Licensed under the Creative Commons Attribution 3.0 Unported License. For
|
||||
* details, see https://creativecommons.org/licenses/by/3.0/.
|
||||
*/
|
||||
// Intended to prevent false-positive bug reports about Bootstrap not working properly in old versions of IE due to folks testing using IE's unreliable emulation modes.
|
||||
(function () {
|
||||
'use strict';
|
||||
|
||||
function emulatedIEMajorVersion() {
|
||||
var groups = /MSIE ([0-9.]+)/.exec(window.navigator.userAgent)
|
||||
if (groups === null) {
|
||||
return null
|
||||
}
|
||||
var ieVersionNum = parseInt(groups[1], 10)
|
||||
var ieMajorVersion = Math.floor(ieVersionNum)
|
||||
return ieMajorVersion
|
||||
}
|
||||
|
||||
function actualNonEmulatedIEMajorVersion() {
|
||||
// Detects the actual version of IE in use, even if it's in an older-IE emulation mode.
|
||||
// IE JavaScript conditional compilation docs: https://msdn.microsoft.com/library/121hztk3%28v=vs.94%29.aspx
|
||||
// @cc_on docs: https://msdn.microsoft.com/library/8ka90k2e%28v=vs.94%29.aspx
|
||||
var jscriptVersion = new Function('/*@cc_on return @_jscript_version; @*/')() // jshint ignore:line
|
||||
if (jscriptVersion === undefined) {
|
||||
return 11 // IE11+ not in emulation mode
|
||||
}
|
||||
if (jscriptVersion < 9) {
|
||||
return 8 // IE8 (or lower; haven't tested on IE<8)
|
||||
}
|
||||
return jscriptVersion // IE9 or IE10 in any mode, or IE11 in non-IE11 mode
|
||||
}
|
||||
|
||||
var ua = window.navigator.userAgent
|
||||
if (ua.indexOf('Opera') > -1 || ua.indexOf('Presto') > -1) {
|
||||
return // Opera, which might pretend to be IE
|
||||
}
|
||||
var emulated = emulatedIEMajorVersion()
|
||||
if (emulated === null) {
|
||||
return // Not IE
|
||||
}
|
||||
var nonEmulated = actualNonEmulatedIEMajorVersion()
|
||||
|
||||
if (emulated !== nonEmulated) {
|
||||
window.alert('WARNING: You appear to be using IE' + nonEmulated + ' in IE' + emulated + ' emulation mode.\nIE emulation modes can behave significantly differently from ACTUAL older versions of IE.\nPLEASE DON\'T FILE BOOTSTRAP BUGS based on testing in IE emulation modes!')
|
||||
}
|
||||
})();
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
/*!
|
||||
* IE10 viewport hack for Surface/desktop Windows 8 bug
|
||||
* Copyright 2014-2015 Twitter, Inc.
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||
*/
|
||||
|
||||
// See the Getting Started docs for more information:
|
||||
// http://getbootstrap.com/getting-started/#support-ie10-width
|
||||
|
||||
(function () {
|
||||
'use strict';
|
||||
|
||||
if (navigator.userAgent.match(/IEMobile\/10\.0/)) {
|
||||
var msViewportStyle = document.createElement('style')
|
||||
msViewportStyle.appendChild(
|
||||
document.createTextNode(
|
||||
'@-ms-viewport{width:auto!important}'
|
||||
)
|
||||
)
|
||||
document.querySelector('head').appendChild(msViewportStyle)
|
||||
}
|
||||
|
||||
})();
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,160 @@
|
|||
/*
|
||||
* Globals
|
||||
*/
|
||||
|
||||
/* Links */
|
||||
a,
|
||||
a:focus,
|
||||
a:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* Custom default button */
|
||||
.btn-secondary,
|
||||
.btn-secondary:hover,
|
||||
.btn-secondary:focus {
|
||||
color: #333;
|
||||
text-shadow: none; /* Prevent inheritance from `body` */
|
||||
background-color: #fff;
|
||||
border: .05rem solid #fff;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Base structure
|
||||
*/
|
||||
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
background-color: #333;
|
||||
}
|
||||
body {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
text-shadow: 0 .05rem .1rem rgba(0,0,0,.5);
|
||||
}
|
||||
|
||||
/* Extra markup and styles for table-esque vertical and horizontal centering */
|
||||
.site-wrapper {
|
||||
display: table;
|
||||
width: 100%;
|
||||
height: 100%; /* For at least Firefox */
|
||||
min-height: 100%;
|
||||
-webkit-box-shadow: inset 0 0 5rem rgba(0,0,0,.5);
|
||||
box-shadow: inset 0 0 5rem rgba(0,0,0,.5);
|
||||
}
|
||||
.site-wrapper-inner {
|
||||
display: table-cell;
|
||||
vertical-align: top;
|
||||
}
|
||||
.cover-container {
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
/* Padding for spacing */
|
||||
.inner {
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
|
||||
.masthead {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.masthead-brand {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.nav-masthead .nav-link {
|
||||
padding: .25rem 0;
|
||||
font-weight: bold;
|
||||
color: rgba(255,255,255,.5);
|
||||
background-color: transparent;
|
||||
border-bottom: .25rem solid transparent;
|
||||
}
|
||||
|
||||
.nav-masthead .nav-link:hover,
|
||||
.nav-masthead .nav-link:focus {
|
||||
border-bottom-color: rgba(255,255,255,.25);
|
||||
}
|
||||
|
||||
.nav-masthead .nav-link + .nav-link {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
.nav-masthead .active {
|
||||
color: #fff;
|
||||
border-bottom-color: #fff;
|
||||
}
|
||||
|
||||
@media (min-width: 48em) {
|
||||
.masthead-brand {
|
||||
float: left;
|
||||
}
|
||||
.nav-masthead {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Cover
|
||||
*/
|
||||
|
||||
.cover {
|
||||
padding: 0 1.5rem;
|
||||
}
|
||||
.cover .btn-lg {
|
||||
padding: .75rem 1.25rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
|
||||
.mastfoot {
|
||||
color: rgba(255,255,255,.5);
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Affix and center
|
||||
*/
|
||||
|
||||
@media (min-width: 40em) {
|
||||
/* Pull out the header and footer */
|
||||
.masthead {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
}
|
||||
.mastfoot {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
}
|
||||
/* Start the vertical centering */
|
||||
.site-wrapper-inner {
|
||||
vertical-align: middle;
|
||||
}
|
||||
/* Handle the widths */
|
||||
.masthead,
|
||||
.mastfoot,
|
||||
.cover-container {
|
||||
width: 100%; /* Must be percentage or pixels for horizontal alignment */
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 62em) {
|
||||
.masthead,
|
||||
.mastfoot,
|
||||
.cover-container {
|
||||
width: 42rem;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,57 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
<title>Profouzors - Serveur</title>
|
||||
<!-- Bootstrap core CSS -->
|
||||
<link href="bootstrap/css/bootstrap.css" rel="stylesheet">
|
||||
<!-- Custom styles for this template -->
|
||||
<link href="cover.css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div class="site-wrapper">
|
||||
<div class="background-center-center background-cover opacity-85 site-wrapper-inner">
|
||||
<div class="cover-container">
|
||||
<div class="masthead clearfix">
|
||||
<div class="inner">
|
||||
<h3 class="masthead-brand"><a href="http://www.profouzors.net">PROFOUZORS.NET</a></h3>
|
||||
<nav class="nav nav-masthead">
|
||||
<a class="nav-link" href="https://db.profouzors.net">Bases</a>
|
||||
<a class="nav-link" href="https://flux.profouzors.net">Flux</a>
|
||||
<a class="nav-link" href="https://linx.profouzors.net">Partages</a>
|
||||
<a class="nav-link" href="https://msg.profouzors.net">Gotify</a>
|
||||
<a class="nav-link" href="https://git.profouzors.net">Forge</a>
|
||||
<a class="nav-link" href="https://cockpit.profouzors.net">Admin</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
<div class="background-center-center bg-dark border border-primary cover inner">
|
||||
<p> <br><img src="./Profouzors_5.jpg" height="300px"></p>
|
||||
<h1 class="cover-heading">PROFOUZORS</h1>
|
||||
<p class="lead">Profouzors.Net est un petit serveur créé par le profouzors.<br>
|
||||
Possédant une forge Git pour ses projets personnels<br><i><b>Xojo, WinDev, WebDev, WinDev Mobile</b></i><br>et quelques autres services.</p>
|
||||
<p class="lead"> <br>
|
||||
<a href="https://db.profouzors.net" class="btn btn-lg btn-warning">Bases</a>
|
||||
<a href="https://git.profouzors.net" class="btn btn-lg btn-success"> == Forge Git ==</a>
|
||||
<a href="https://flux.profouzors.net" class="btn btn-lg btn-danger">Flux (NodeRed)</a> </p>
|
||||
</div>
|
||||
<div class="mastfoot">
|
||||
<div class="inner">
|
||||
<p>Le savoir est un trésor qui grandit quand on le partage !</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Bootstrap core JavaScript
|
||||
================================================== -->
|
||||
<!-- Placed at the end of the document so the pages load faster -->
|
||||
<script src="assets/js/jquery.min.js"></script>
|
||||
<script src="assets/js/popper.js"></script>
|
||||
<script src="bootstrap/js/bootstrap.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue