Reverted Admonitions back to mask-image

This commit is contained in:
squidfunk 2020-03-19 09:52:00 +01:00
parent 89f39117c0
commit 83a6b8b63c
8 changed files with 22 additions and 16 deletions

View File

@ -1,10 +1,10 @@
{ {
"assets/javascripts/bundle.js": "assets/javascripts/bundle.773bc13f.min.js", "assets/javascripts/bundle.js": "assets/javascripts/bundle.8f6f3473.min.js",
"assets/javascripts/bundle.js.map": "assets/javascripts/bundle.773bc13f.min.js.map", "assets/javascripts/bundle.js.map": "assets/javascripts/bundle.8f6f3473.min.js.map",
"assets/javascripts/vendor.js": "assets/javascripts/vendor.0c35f0aa.min.js", "assets/javascripts/vendor.js": "assets/javascripts/vendor.0c35f0aa.min.js",
"assets/javascripts/vendor.js.map": "assets/javascripts/vendor.0c35f0aa.min.js.map", "assets/javascripts/vendor.js.map": "assets/javascripts/vendor.0c35f0aa.min.js.map",
"assets/javascripts/worker/search.js": "assets/javascripts/worker/search.2613054f.min.js", "assets/javascripts/worker/search.js": "assets/javascripts/worker/search.2613054f.min.js",
"assets/javascripts/worker/search.js.map": "assets/javascripts/worker/search.2613054f.min.js.map", "assets/javascripts/worker/search.js.map": "assets/javascripts/worker/search.2613054f.min.js.map",
"assets/stylesheets/main.css": "assets/stylesheets/main.dfb60779.min.css", "assets/stylesheets/main.css": "assets/stylesheets/main.9753e9ae.min.css",
"assets/stylesheets/palette.css": "assets/stylesheets/palette.31180ff2.min.css" "assets/stylesheets/palette.css": "assets/stylesheets/palette.31180ff2.min.css"
} }

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -41,7 +41,7 @@
{% endif %} {% endif %}
{% endblock %} {% endblock %}
{% block styles %} {% block styles %}
<link rel="stylesheet" href="{{ 'assets/stylesheets/main.dfb60779.min.css' | url }}"> <link rel="stylesheet" href="{{ 'assets/stylesheets/main.9753e9ae.min.css' | url }}">
{% if palette.primary or palette.accent %} {% if palette.primary or palette.accent %}
<link rel="stylesheet" href="{{ 'assets/stylesheets/palette.31180ff2.min.css' | url }}"> <link rel="stylesheet" href="{{ 'assets/stylesheets/palette.31180ff2.min.css' | url }}">
{% endif %} {% endif %}
@ -178,7 +178,7 @@
{% endblock %} {% endblock %}
{% block scripts %} {% block scripts %}
<script src="{{ 'assets/javascripts/vendor.0c35f0aa.min.js' | url }}"></script> <script src="{{ 'assets/javascripts/vendor.0c35f0aa.min.js' | url }}"></script>
<script src="{{ 'assets/javascripts/bundle.773bc13f.min.js' | url }}"></script> <script src="{{ 'assets/javascripts/bundle.8f6f3473.min.js' | url }}"></script>
{%- set translations = {} -%} {%- set translations = {} -%}
{%- for key in [ {%- for key in [
"clipboard.copy", "clipboard.copy",

View File

@ -49,7 +49,11 @@ $admonitions: (
// Icon definitions // Icon definitions
:root { :root {
@each $names, $props in $admonitions { @each $names, $props in $admonitions {
--md-admonition-icon--#{nth($names, 1)}: url("{{ #{$props} }}"); $name: nth($names, 1);
$icon: nth($props, 1);
// Inline icon through string-replace-loader in webpack
--md-admonition-icon--#{$name}: url("{{ #{$icon} }}");
} }
} }
@ -127,7 +131,8 @@ $admonitions: (
left: px2rem(12px); left: px2rem(12px);
width: px2rem(20px); width: px2rem(20px);
height: px2rem(20px); height: px2rem(20px);
background-image: var(--md-admonition-icon--note); background-color: $clr-blue-a200;
mask-image: var(--md-admonition-icon--note);
content: ""; content: "";
// Adjust for right-to-left languages // Adjust for right-to-left languages
@ -168,7 +173,8 @@ $admonitions: (
// Icon // Icon
&::before { &::before {
background-image: var(--md-admonition-icon--#{$name}); background-color: $tint;
mask-image: var(--md-admonition-icon--#{$name});
} }
} }

View File

@ -27,7 +27,7 @@
// Icon definitions // Icon definitions
:root { :root {
--md-tasklist-icon: url("{{ checkbox-blank-circle }}"); --md-tasklist-icon: url("{{ checkbox-blank-circle }}");
--md-tasklist-icon--checked: url("{{ check-circle #{$clr-green-a400} }}"); --md-tasklist-icon--checked: url("{{ check-circle }}");
} }
// ---------------------------------------------------------------------------- // ----------------------------------------------------------------------------
@ -65,8 +65,8 @@
left: px2em(-24px); left: px2em(-24px);
width: px2em(20px); width: px2em(20px);
height: px2em(20px); height: px2em(20px);
background-image: var(--md-tasklist-icon); background-color: var(--md-default-fg-color--lightest);
opacity: 0.1; mask-image: var(--md-tasklist-icon);
content: ""; content: "";
// Adjust for right-to-left languages // Adjust for right-to-left languages
@ -78,8 +78,8 @@
// Checkbox icon in checked state // Checkbox icon in checked state
[type="checkbox"]:checked + .task-list-indicator::before { [type="checkbox"]:checked + .task-list-indicator::before {
background-image: var(--md-tasklist-icon--checked); background-color: $clr-green-a400;
opacity: 1; mask-image: var(--md-tasklist-icon--checked);
} }
// Hide original checkbox behind icon // Hide original checkbox behind icon