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

force launch button styles for IE

Browse Source
This commit is contained in:
Heydon Pickering 2017-08-25 12:21:23 +01:00
parent 45c1f7ea5d
commit 26a64f4136
6 changed files with 41 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
docs/css/styles.css
View File

@ -84,7 +84,7 @@ div:not([tabindex]):focus {
display: block; display: block;
width: 100%; width: 100%;
padding: 0.75rem; padding: 0.75rem;
color: #fff; color: #fefefe;
background: #000; background: #000;
position: absolute; position: absolute;
top: -3rem; top: -3rem;
@ -145,7 +145,7 @@ code {
background: #111; background: #111;
} }
.cmd code { .cmd code {
color: #fff; color: #fefefe;
white-space: nowrap; white-space: nowrap;
} }
.cmd code::before { .cmd code::before {
@ -172,15 +172,18 @@ button {
border-radius: 0.125em; border-radius: 0.125em;
font-family: inherit; font-family: inherit;
background: #111; background: #111;
color: #fff; color: #fefefe;
padding: 0.75rem; padding: 0.75rem;
border: 0; border: 0;
} }
[data-launch] { [data-launch] {
font-size: 0.75rem; font-size: 0.75rem !important;
margin-top: 0.75rem; margin-top: 0.75rem !important;
padding: 0.5rem; padding: 0.5rem !important;
border-radius: 0; border-radius: 0 !important;
box-shadow: none !important;
background: #111 !important;
color: #fefefe !important
} }
/* Forms */ /* Forms */
@ -192,7 +195,7 @@ label {
[for="themer"] { [for="themer"] {
background: #111; background: #111;
border-radius: 0.125em; border-radius: 0.125em;
color: #fff; color: #fefefe;
padding: 0.25em 0.75em; padding: 0.25em 0.75em;
margin: 0.5rem; margin: 0.5rem;
} }
@ -244,7 +247,7 @@ th:empty {
.tested th { .tested th {
width: 100%; width: 100%;
background-color: #111; background-color: #111;
color: #fff; color: #fefefe;
outline-color: #111; outline-color: #111;
} }
.tested img { .tested img {
@ -360,7 +363,7 @@ caption {
background-position: 98% center; background-position: 98% center;
background-size: 125%; background-size: 125%;
background-repeat: no-repeat; background-repeat: no-repeat;
color: #fff; color: #fefefe;
padding: 0.5em 1em 0.5em; padding: 0.5em 1em 0.5em;
} }
/* menu button */ /* menu button */
@ -550,7 +553,7 @@ pre[class*=language-] code * {
overflow-y: hidden; overflow-y: hidden;
} }
.file-tree li { .file-tree li {
background: #fff; background: #fefefe;
position: relative; position: relative;
white-space: nowrap; white-space: nowrap;
} }
@ -693,7 +696,7 @@ h1 svg {
.colors span { .colors span {
line-height: 1; line-height: 1;
background-color: #111; background-color: #111;
color: #fff; color: #fefefe;
font-size: 0.75rem; font-size: 0.75rem;
padding: 0.25rem; padding: 0.25rem;
position: absolute; position: absolute;
@ -863,7 +866,7 @@ h1 svg {
content: ''; content: '';
} }
.cmd code { .cmd code {
background: #fff; background: #fefefe;
color: #111; color: #111;
} }
pre code { pre code {
@ -898,7 +901,7 @@ h1 svg {
} }
@media (-ms-high-contrast: active) { @media (-ms-high-contrast: active) {
img[src*=".svg"] { img[src*=".svg"] {
background: #fff; background: #fefefe;
padding: 0.5rem; padding: 0.5rem;
} }
.ticks li::before { .ticks li::before {

10
docs/patterns/coding/writing-inline-demos/index.html
View File

@ -506,6 +506,8 @@ toggle.addEventListener('click', function () {
(function() { (function() {
var root = document.getElementById('js-demo-285170a1c0812ad34ac4b853a052c8bd'); var root = document.getElementById('js-demo-285170a1c0812ad34ac4b853a052c8bd');
var template = document.getElementById('template-285170a1c0812ad34ac4b853a052c8bd'); var template = document.getElementById('template-285170a1c0812ad34ac4b853a052c8bd');
var demoDiv = document.createElement('div'); var demoDiv = document.createElement('div');
demoDiv.innerHTML = template.innerHTML; demoDiv.innerHTML = template.innerHTML;
var standaloneScript = demoDiv.querySelector('script'); var standaloneScript = demoDiv.querySelector('script');
@ -540,14 +542,6 @@ toggle.addEventListener('click', function () {
standalone.document.title = 'demo ' + "285170a1c0812ad34ac4b853a052c8bd"; standalone.document.title = 'demo ' + "285170a1c0812ad34ac4b853a052c8bd";
}); });
})(); })();
</script> </script>
</div> </div>

10
docs/print-version/index.html
View File

@ -1880,6 +1880,8 @@ toggle.addEventListener('click', function () {
(function() { (function() {
var root = document.getElementById('js-demo-285170a1c0812ad34ac4b853a052c8bd'); var root = document.getElementById('js-demo-285170a1c0812ad34ac4b853a052c8bd');
var template = document.getElementById('template-285170a1c0812ad34ac4b853a052c8bd'); var template = document.getElementById('template-285170a1c0812ad34ac4b853a052c8bd');
var demoDiv = document.createElement('div'); var demoDiv = document.createElement('div');
demoDiv.innerHTML = template.innerHTML; demoDiv.innerHTML = template.innerHTML;
var standaloneScript = demoDiv.querySelector('script'); var standaloneScript = demoDiv.querySelector('script');
@ -1914,14 +1916,6 @@ toggle.addEventListener('click', function () {
standalone.document.title = 'demo ' + "285170a1c0812ad34ac4b853a052c8bd"; standalone.document.title = 'demo ' + "285170a1c0812ad34ac4b853a052c8bd";
}); });
})(); })();
</script> </script>
</div> </div>

2
docs/service-worker.js
View File

File diff suppressed because one or more lines are too long

42
themes/infusion/layouts/shortcodes/demo.html
View File

@ -20,6 +20,8 @@
(function() { (function() {
var root = document.getElementById('js-demo-{{ $uniq }}'); var root = document.getElementById('js-demo-{{ $uniq }}');
var template = document.getElementById('template-{{ $uniq }}'); var template = document.getElementById('template-{{ $uniq }}');
// Save a version for the new window
var demoDiv = document.createElement('div'); var demoDiv = document.createElement('div');
demoDiv.innerHTML = template.innerHTML; demoDiv.innerHTML = template.innerHTML;
var standaloneScript = demoDiv.querySelector('script'); var standaloneScript = demoDiv.querySelector('script');
@ -56,45 +58,5 @@
standalone.document.title = 'demo ' + {{ $uniq }}; standalone.document.title = 'demo ' + {{ $uniq }};
}); });
})(); })();
/*(function() {
var root = document.getElementById('js-demo-{{ $uniq }}');
var template = document.getElementById('template-{{ $uniq }}');
var script = template.content.querySelector('script');
if (script) {
var standaloneScript = '(function() { document.getElementsByTagName(\'html\')[0].setAttribute(\'lang\', \'en\'); var demo = document; ' + script.textContent + ' })();';
var wrappedScript = '(function() { var demo = document.getElementById(\'js-demo-{{ $uniq }}\').shadowRoot;' + script.textContent + '})();';
script.textContent = wrappedScript;
}
if (document.head.attachShadow) {
root.attachShadow({mode: 'open'});
root.shadowRoot.appendChild(document.importNode(template.content, true));
} else {
root.innerHTML = '<p class="site-error"><strong style="font-weight:bold">Site error:</strong> A browser supporting Shadow DOM is needed to run encapsulated demos. You can launch the demo in a separate window ↓</p>';
}
var launchButton = document.querySelector('[data-launch="js-demo-{{ $uniq }}"]');
launchButton.addEventListener('click', function () {
var standalone = window.open();
script.innerHTML = standaloneScript;
var demoDiv = document.createElement('div');
demoDiv.innerHTML = template.innerHTML;
standalone.document.body.appendChild(demoDiv);
// For activating the script :-(
var newScript = standalone.document.createElement('script');
var oldScript = standalone.document.querySelector('script');
newScript.textContent = oldScript.textContent;
oldScript.parentNode.removeChild(oldScript);
standalone.document.body.appendChild(newScript);
{{ if .Get "backgroundColor" }}
standalone.document.body.style.backgroundColor = {{ .Get "backgroundColor" | safeCSS }};
{{ end }}
standalone.document.title = 'demo ' + {{ $uniq }};
});
})();*/
</script> </script>
</div> </div>

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

@ -84,7 +84,7 @@ div:not([tabindex]):focus {
display: block; display: block;
width: 100%; width: 100%;
padding: 0.75rem; padding: 0.75rem;
color: #fff; color: #fefefe;
background: #000; background: #000;
position: absolute; position: absolute;
top: -3rem; top: -3rem;
@ -145,7 +145,7 @@ code {
background: #111; background: #111;
} }
.cmd code { .cmd code {
color: #fff; color: #fefefe;
white-space: nowrap; white-space: nowrap;
} }
.cmd code::before { .cmd code::before {
@ -172,15 +172,18 @@ button {
border-radius: 0.125em; border-radius: 0.125em;
font-family: inherit; font-family: inherit;
background: #111; background: #111;
color: #fff; color: #fefefe;
padding: 0.75rem; padding: 0.75rem;
border: 0; border: 0;
} }
[data-launch] { [data-launch] {
font-size: 0.75rem; font-size: 0.75rem !important;
margin-top: 0.75rem; margin-top: 0.75rem !important;
padding: 0.5rem; padding: 0.5rem !important;
border-radius: 0; border-radius: 0 !important;
box-shadow: none !important;
background: #111 !important;
color: #fefefe !important
} }
/* Forms */ /* Forms */
@ -192,7 +195,7 @@ label {
[for="themer"] { [for="themer"] {
background: #111; background: #111;
border-radius: 0.125em; border-radius: 0.125em;
color: #fff; color: #fefefe;
padding: 0.25em 0.75em; padding: 0.25em 0.75em;
margin: 0.5rem; margin: 0.5rem;
} }
@ -244,7 +247,7 @@ th:empty {
.tested th { .tested th {
width: 100%; width: 100%;
background-color: #111; background-color: #111;
color: #fff; color: #fefefe;
outline-color: #111; outline-color: #111;
} }
.tested img { .tested img {
@ -360,7 +363,7 @@ caption {
background-position: 98% center; background-position: 98% center;
background-size: 125%; background-size: 125%;
background-repeat: no-repeat; background-repeat: no-repeat;
color: #fff; color: #fefefe;
padding: 0.5em 1em 0.5em; padding: 0.5em 1em 0.5em;
} }
/* menu button */ /* menu button */
@ -550,7 +553,7 @@ pre[class*=language-] code * {
overflow-y: hidden; overflow-y: hidden;
} }
.file-tree li { .file-tree li {
background: #fff; background: #fefefe;
position: relative; position: relative;
white-space: nowrap; white-space: nowrap;
} }
@ -693,7 +696,7 @@ h1 svg {
.colors span { .colors span {
line-height: 1; line-height: 1;
background-color: #111; background-color: #111;
color: #fff; color: #fefefe;
font-size: 0.75rem; font-size: 0.75rem;
padding: 0.25rem; padding: 0.25rem;
position: absolute; position: absolute;
@ -863,7 +866,7 @@ h1 svg {
content: ''; content: '';
} }
.cmd code { .cmd code {
background: #fff; background: #fefefe;
color: #111; color: #111;
} }
pre code { pre code {
@ -898,7 +901,7 @@ h1 svg {
} }
@media (-ms-high-contrast: active) { @media (-ms-high-contrast: active) {
img[src*=".svg"] { img[src*=".svg"] {
background: #fff; background: #fefefe;
padding: 0.5rem; padding: 0.5rem;
} }
.ticks li::before { .ticks li::before {