Website: Repositioned theme selector (#3146)

This commit is contained in:
Michael Schmidt 2021-10-19 14:52:13 +02:00 committed by GitHub
parent ccc02a55fd
commit ea361e5a2b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 83 additions and 40 deletions

View File

@ -244,27 +244,4 @@ var setTheme;
$$('.plugin-list').forEach(listPlugins);
// small polyfill for Element#matches
if (!Element.prototype.matches) {
Element.prototype.matches = Element.prototype.msMatchesSelector || Element.prototype.webkitMatchesSelector;
}
Prism && Prism.hooks.add('complete', function (env) {
var element = env.element;
requestAnimationFrame(function () {
if (!element.matches('div.code-toolbar > pre > code')) {
return;
}
var pre = element.parentElement;
var wrapper = pre.parentElement;
// transfer margin of pre to wrapper
wrapper.style.margin = window.getComputedStyle(pre).margin;
pre.style.margin = '0';
});
});
}());

View File

@ -188,7 +188,6 @@ footer:before {
}
#features {
width: 66em;
margin-top: 2em;
font-size: 80%;
}
@ -197,12 +196,16 @@ footer:before {
margin: 0 0 2em 0;
list-style: none;
display: inline-block;
width: 27em;
width: 49%;
box-sizing: border-box;
vertical-align: top;
}
#features li:nth-child(odd) {
margin-right: 5em;
padding-right: 2.5em;
}
#features li:nth-child(even) {
padding-left: 2.5em;
}
#features li:before {
@ -229,7 +232,7 @@ footer:before {
position: relative;
z-index: 1;
float: right;
margin-right: -1em;
margin-right: -9em;
text-align: center;
text-transform: uppercase;
letter-spacing: .2em;
@ -277,6 +280,7 @@ footer:before {
#theme > input {
position: absolute;
left: 0;
clip: rect(0,0,0,0);
}
@ -284,6 +288,81 @@ footer:before {
background: #7fab14;
}
@media (max-width: 1300px) and (min-width: 1051px) {
#theme {
position: relative;
z-index: 1;
float: left;
margin: 1em 0;
width: 100%;
}
#theme + * {
clear: both;
}
#theme > p {
margin-top: .5em;
}
#theme > label {
float: left;
font-size: 82.6%;
}
#theme > label:before {
display: none;
}
#theme > label:nth-of-type(n+2) {
margin-top: 0;
}
}
@media (max-width: 1050px) {
#theme {
position: relative;
z-index: 1;
float: left;
margin: 1em 0;
}
#theme + * {
clear: both;
}
#theme > p {
left: inherit;
right: -1em;
}
#theme > label {
float: left;
}
#theme > label:before {
display: none;
}
#theme > label:nth-of-type(n+2) {
margin-top: 0;
}
#theme > label:nth-of-type(n+5) {
margin-top: -2.5em;
}
#theme > label:nth-of-type(4n+1) {
margin-left: 12.5em;
}
}
@media (max-width: 800px) {
#theme > label:nth-of-type(4) {
margin-right: 4em;
}
#theme > label:nth-of-type(4n+1) {
margin-left: 4em;
}
}
footer {
margin-top: 2em;
background-position: bottom;
@ -435,12 +514,3 @@ ul.plugin-list {
ul.plugin-list > li > div {
margin-bottom: .5em;
}
/*
* Fix for Toolbar's overflow issue
*/
div.code-toolbar {
display: block;
overflow: auto;
}

View File

@ -8,10 +8,6 @@
<link rel="stylesheet" href="assets/style.css" />
<link rel="stylesheet" href="themes/prism.css" data-noprefix />
<style>
#theme {
margin-right: -9em;
}
textarea {
width: 100%;
height: 10em;