hugopoi/cupper-hugo-theme
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

IE SVG fix

Browse Source
This commit is contained in:
Heydon Pickering 2017-07-28 14:42:01 +01:00
parent 99da38d287
commit e56c5ea45d
5 changed files with 89 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
docs/css/styles.css
View File

@ -762,16 +762,25 @@ p:empty {
a svg, button svg, h1 svg {
height: 0.75em;
width: auto;
margin-right: 0.25em;
margin-right: 0.125em;
}
h1 svg {
h1 svg, li > svg, h2 a svg {
height: 1em;
margin-right: 0;
vertical-align: middle;
}
/* color palettes */
h1 svg {
margin-right: 0;
}
.svg-outer {
width: 0.75em;
display: inline-block;
vertical-align: middle;
}
/* Color palettes */
.colors {
display: flex;

31
docs/js/dom-scripts.js
View File

@ -70,3 +70,34 @@
}
})
}());
// SVG scaling fix for IE10-11
(function () {
if (window.matchMedia('(-ms-high-contrast: none), (-ms-high-contrast: active)').matches) {
// Get all the SVGs on the page except the symbol defs
var svgs = document.querySelectorAll('a svg, button svg, h1 svg')
// ... iterate over SVGs
Array.prototype.forEach.call(svgs, function(svg) {
// Set preserveAspectRatio to 'XMidYMin slice'
svg.setAttribute('preserveAspectRatio', 'xMidYMin slice')
// Turn the viewBox values into an array
var viewBox = svg.getAttribute('viewBox').split(' ')
// Calculate padding value needed (width/height x 100)
var padding = (viewBox[2] / viewBox[3]) * 100
// Set inline styles
svg.setAttribute('style', 'width: 100%; padding-bottom: ' + padding + '%; height: 1px; overflow: visible')
// Create span wrapper
var span = document.createElement('span')
span.setAttribute('class', 'svg-outer')
span.style.width = '0.75em'
svg.parentNode.insertBefore(span, svg)
span.appendChild(svg)
})
}
}());

2
docs/service-worker.js
View File

File diff suppressed because one or more lines are too long

17
themes/infusion/static/css/styles.css
View File

@ -762,16 +762,25 @@ p:empty {
a svg, button svg, h1 svg {
height: 0.75em;
width: auto;
margin-right: 0.25em;
margin-right: 0.125em;
}
h1 svg {
h1 svg, li > svg, h2 a svg {
height: 1em;
margin-right: 0;
vertical-align: middle;
}
/* color palettes */
h1 svg {
margin-right: 0;
}
.svg-outer {
width: 0.75em;
display: inline-block;
vertical-align: middle;
}
/* Color palettes */
.colors {
display: flex;

31
themes/infusion/static/js/dom-scripts.js
View File

@ -70,3 +70,34 @@
}
})
}());
// SVG scaling fix for IE10-11
(function () {
if (window.matchMedia('(-ms-high-contrast: none), (-ms-high-contrast: active)').matches) {
// Get all the SVGs on the page except the symbol defs
var svgs = document.querySelectorAll('a svg, button svg, h1 svg')
// ... iterate over SVGs
Array.prototype.forEach.call(svgs, function(svg) {
// Set preserveAspectRatio to 'XMidYMin slice'
svg.setAttribute('preserveAspectRatio', 'xMidYMin slice')
// Turn the viewBox values into an array
var viewBox = svg.getAttribute('viewBox').split(' ')
// Calculate padding value needed (width/height x 100)
var padding = (viewBox[2] / viewBox[3]) * 100
// Set inline styles
svg.setAttribute('style', 'width: 100%; padding-bottom: ' + padding + '%; height: 1px; overflow: visible')
// Create span wrapper
var span = document.createElement('span')
span.setAttribute('class', 'svg-outer')
span.style.width = '0.75em'
svg.parentNode.insertBefore(span, svg)
span.appendChild(svg)
})
}
}());