mirror of
https://github.com/squidfunk/mkdocs-material.git
synced 2024-06-14 11:52:32 +03:00
Fixed unnecessary nesting in SCSS, reducing final CSS by 20kb
This commit is contained in:
parent
11d1b839a1
commit
b65bda08a7
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
1
material/assets/javascripts/bundle.a9b5ac61.min.js.map
Normal file
1
material/assets/javascripts/bundle.a9b5ac61.min.js.map
Normal file
File diff suppressed because one or more lines are too long
@ -1,8 +1,8 @@
|
||||
{
|
||||
"assets/javascripts/bundle.js": "assets/javascripts/bundle.262abba4.min.js",
|
||||
"assets/javascripts/bundle.js.map": "assets/javascripts/bundle.262abba4.min.js.map",
|
||||
"assets/javascripts/bundle.js": "assets/javascripts/bundle.a9b5ac61.min.js",
|
||||
"assets/javascripts/bundle.js.map": "assets/javascripts/bundle.a9b5ac61.min.js.map",
|
||||
"assets/javascripts/worker/search.js": "assets/javascripts/worker/search.926ffd9e.min.js",
|
||||
"assets/javascripts/worker/search.js.map": "assets/javascripts/worker/search.926ffd9e.min.js.map",
|
||||
"assets/stylesheets/app-palette.scss": "assets/stylesheets/app-palette.865ff948.min.css",
|
||||
"assets/stylesheets/app.scss": "assets/stylesheets/app.bdffa146.min.css"
|
||||
"assets/stylesheets/app-palette.scss": "assets/stylesheets/app-palette.c0cd5d4d.min.css",
|
||||
"assets/stylesheets/app.scss": "assets/stylesheets/app.55d3176a.min.css"
|
||||
}
|
File diff suppressed because one or more lines are too long
1
material/assets/stylesheets/app-palette.c0cd5d4d.min.css
vendored
Normal file
1
material/assets/stylesheets/app-palette.c0cd5d4d.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
material/assets/stylesheets/app.55d3176a.min.css
vendored
Normal file
1
material/assets/stylesheets/app.55d3176a.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -43,9 +43,9 @@
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
{% block styles %}
|
||||
<link rel="stylesheet" href="{{ 'assets/stylesheets/app.bdffa146.min.css' | url }}">
|
||||
<link rel="stylesheet" href="{{ 'assets/stylesheets/app.55d3176a.min.css' | url }}">
|
||||
{% if palette.primary or palette.accent %}
|
||||
<link rel="stylesheet" href="{{ 'assets/stylesheets/app-palette.865ff948.min.css' | url }}">
|
||||
<link rel="stylesheet" href="{{ 'assets/stylesheets/app-palette.c0cd5d4d.min.css' | url }}">
|
||||
{% endif %}
|
||||
{% if palette.primary %}
|
||||
{% import "partials/palette.html" as map %}
|
||||
@ -195,7 +195,7 @@
|
||||
{% endblock %}
|
||||
</div>
|
||||
{% block scripts %}
|
||||
<script src="{{ 'assets/javascripts/bundle.262abba4.min.js' | url }}"></script>
|
||||
<script src="{{ 'assets/javascripts/bundle.a9b5ac61.min.js' | url }}"></script>
|
||||
{%- set translations = {} -%}
|
||||
{%- for key in [
|
||||
"clipboard.copy",
|
||||
|
@ -64,6 +64,7 @@
|
||||
@import "extensions/pymdown/critic";
|
||||
@import "extensions/pymdown/details";
|
||||
@import "extensions/pymdown/emoji";
|
||||
@import "extensions/pymdown/highlight";
|
||||
@import "extensions/pymdown/inlinehilite";
|
||||
@import "extensions/pymdown/tabbed";
|
||||
@import "extensions/pymdown/tasklist";
|
||||
|
@ -27,7 +27,7 @@
|
||||
// Scoped in typesetted content to match specificity of regular content
|
||||
.md-typeset {
|
||||
|
||||
// Admonition extension
|
||||
// Admonition
|
||||
.admonition {
|
||||
margin: 1.5625em 0;
|
||||
padding: 0 px2rem(12px);
|
||||
@ -58,41 +58,6 @@
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
// Title
|
||||
> .admonition-title {
|
||||
margin: 0 px2rem(-12px);
|
||||
padding: px2rem(8px) px2rem(12px) px2rem(8px) px2rem(40px);
|
||||
background-color: transparentize($clr-blue-a200, 0.9);
|
||||
font-weight: 700;
|
||||
|
||||
// Adjust for right-to-left languages
|
||||
[dir="rtl"] & {
|
||||
padding: px2rem(8px) px2rem(40px) px2rem(8px) px2rem(12px);
|
||||
}
|
||||
|
||||
// Reset spacing, if title is the only element
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
// Icon
|
||||
&::before {
|
||||
position: absolute;
|
||||
width: px2rem(20px);
|
||||
height: px2rem(20px);
|
||||
margin-left: px2rem(-28px);
|
||||
background-color: $clr-blue-a200;
|
||||
mask-image: url("{{ pencil }}");
|
||||
content: "";
|
||||
|
||||
// Adjust for right-to-left languages
|
||||
[dir="rtl"] & {
|
||||
margin-right: px2rem(-28px);
|
||||
margin-left: initial;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Build representational classes
|
||||
@each $names, $appearance in (
|
||||
abstract summary tldr: $clr-light-blue-a400 "text-subject",
|
||||
@ -127,7 +92,7 @@
|
||||
}
|
||||
|
||||
// Title
|
||||
> .admonition-title {
|
||||
> :first-child {
|
||||
background-color: transparentize($tint, 0.9);
|
||||
|
||||
// Icon
|
||||
@ -148,4 +113,39 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Admonition title
|
||||
.admonition-title {
|
||||
margin: 0 px2rem(-12px);
|
||||
padding: px2rem(8px) px2rem(12px) px2rem(8px) px2rem(40px);
|
||||
background-color: transparentize($clr-blue-a200, 0.9);
|
||||
font-weight: 700;
|
||||
|
||||
// Adjust for right-to-left languages
|
||||
[dir="rtl"] & {
|
||||
padding: px2rem(8px) px2rem(40px) px2rem(8px) px2rem(12px);
|
||||
}
|
||||
|
||||
// Reset spacing, if title is the only element
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
// Icon
|
||||
&::before {
|
||||
position: absolute;
|
||||
width: px2rem(20px);
|
||||
height: px2rem(20px);
|
||||
margin-left: px2rem(-28px);
|
||||
background-color: $clr-blue-a200;
|
||||
mask-image: url("{{ pencil }}");
|
||||
content: "";
|
||||
|
||||
// Adjust for right-to-left languages
|
||||
[dir="rtl"] & {
|
||||
margin-right: px2rem(-28px);
|
||||
margin-left: initial;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -210,9 +210,6 @@ $codehilite-whitespace: transparent;
|
||||
// Rules: layout
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
// Scoped in typesetted content to match specificity of regular content
|
||||
.md-typeset {
|
||||
|
||||
// Block with line numbers
|
||||
.codehilitetable {
|
||||
display: block;
|
||||
@ -266,7 +263,6 @@ $codehilite-whitespace: transparent;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
// TODO: refactor
|
||||
[data-linenos] {
|
||||
@ -290,6 +286,10 @@ $codehilite-whitespace: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Scoped in typesetted content to match specificity of regular content
|
||||
.md-typeset {
|
||||
|
||||
// Block with line numbers
|
||||
> .codehilitetable {
|
||||
@ -321,16 +321,4 @@ $codehilite-whitespace: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// When pymdownx.superfences is enabled but codehilite is disabled,
|
||||
// pymdownx.highlight will be used. When this happens, the outer
|
||||
// container and tables get this class names by default
|
||||
.highlight {
|
||||
@extend .codehilite;
|
||||
}
|
||||
|
||||
// Same as above, but for code blocks with line numbers enabled
|
||||
.highlighttable {
|
||||
@extend .codehilitetable;
|
||||
}
|
||||
}
|
||||
|
@ -59,16 +59,34 @@
|
||||
}
|
||||
}
|
||||
|
||||
// Make permalink visible on hover
|
||||
:hover .headerlink,
|
||||
:target .headerlink,
|
||||
.headerlink:focus {
|
||||
transform: translate(0, 0);
|
||||
transition:
|
||||
transform 250ms 250ms,
|
||||
color 250ms,
|
||||
opacity 125ms 250ms;
|
||||
// visibility 0ms;
|
||||
opacity: 1;
|
||||
// visibility: visible;
|
||||
}
|
||||
|
||||
// Active or targeted permalink
|
||||
.headerlink:focus,
|
||||
.headerlink:hover,
|
||||
:target .headerlink {
|
||||
color: $md-color-accent;
|
||||
}
|
||||
|
||||
// Correct anchor offset for link blurring
|
||||
@each $level, $delta in (
|
||||
h1: 8px,
|
||||
h2: 8px,
|
||||
h3: 8px,
|
||||
h1 h2 h3: 8px,
|
||||
h4: 9px,
|
||||
h5: 11px,
|
||||
h6: 11px
|
||||
h5 h6: 12px,
|
||||
) {
|
||||
#{$level}[id] {
|
||||
%#{nth($level, 1)} {
|
||||
|
||||
// Un-targeted anchor
|
||||
&::before {
|
||||
@ -83,26 +101,12 @@
|
||||
margin-top: -1 * px2rem(48px + 12px + $delta);
|
||||
padding-top: px2rem(48px + 12px + $delta);
|
||||
}
|
||||
|
||||
// Make permalink visible on hover
|
||||
&:hover .headerlink,
|
||||
&:target .headerlink,
|
||||
& .headerlink:focus {
|
||||
transform: translate(0, 0);
|
||||
transition:
|
||||
transform 250ms 250ms,
|
||||
color 250ms,
|
||||
opacity 125ms 250ms;
|
||||
// visibility 0ms;
|
||||
opacity: 1;
|
||||
// visibility: visible;
|
||||
}
|
||||
|
||||
// Active or targeted permalink
|
||||
&:hover .headerlink:hover,
|
||||
&:target .headerlink,
|
||||
& .headerlink:focus {
|
||||
color: $md-color-accent;
|
||||
// Define levels
|
||||
@for $n from 1 through length($level) {
|
||||
#{nth($level, $n)}[id] {
|
||||
@extend %#{nth($level, 1)};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
37
src/assets/stylesheets/extensions/pymdown/_highlight.scss
Normal file
37
src/assets/stylesheets/extensions/pymdown/_highlight.scss
Normal file
@ -0,0 +1,37 @@
|
||||
////
|
||||
/// Copyright (c) 2016-2020 Martin Donath <martin.donath@squidfunk.com>
|
||||
///
|
||||
/// Permission is hereby granted, free of charge, to any person obtaining a
|
||||
/// copy of this software and associated documentation files (the "Software"),
|
||||
/// to deal in the Software without restriction, including without limitation
|
||||
/// the rights to use, copy, modify, merge, publish, distribute, sublicense,
|
||||
/// and/or sell copies of the Software, and to permit persons to whom the
|
||||
/// Software is furnished to do so, subject to the following conditions:
|
||||
///
|
||||
/// The above copyright notice and this permission notice shall be included in
|
||||
/// all copies or substantial portions of the Software.
|
||||
///
|
||||
/// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
/// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
/// FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL
|
||||
/// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
/// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
/// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
|
||||
/// DEALINGS
|
||||
////
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
// Rules
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
// When pymdownx.superfences is enabled but codehilite is disabled,
|
||||
// pymdownx.highlight will be used. When this happens, the outer container
|
||||
// and tables get this class names by default
|
||||
.highlight {
|
||||
@extend .codehilite;
|
||||
}
|
||||
|
||||
// Same as above, but for code blocks with line numbers enabled
|
||||
.highlighttable {
|
||||
@extend .codehilitetable;
|
||||
}
|
@ -51,16 +51,13 @@
|
||||
}
|
||||
|
||||
// Show on container hover
|
||||
pre:hover &,
|
||||
.codehilite:hover & {
|
||||
pre:hover & {
|
||||
color: $md-color-black--light;
|
||||
}
|
||||
|
||||
// Focused or hovered icon
|
||||
pre &:focus,
|
||||
pre &:hover,
|
||||
.codehilite &:focus,
|
||||
.codehilite &:hover {
|
||||
pre &:hover {
|
||||
color: $md-color-accent;
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user