Added accent colors to new palette integration

This commit is contained in:
squidfunk 2020-02-26 09:08:50 +01:00
parent 9590cc1c2b
commit 63a309bd72
7 changed files with 15 additions and 15 deletions

View File

@ -1,8 +1,8 @@
{ {
"assets/javascripts/bundle.js": "assets/javascripts/bundle.cc13a381.min.js", "assets/javascripts/bundle.js": "assets/javascripts/bundle.379e8f0f.min.js",
"assets/javascripts/bundle.js.map": "assets/javascripts/bundle.cc13a381.min.js.map", "assets/javascripts/bundle.js.map": "assets/javascripts/bundle.379e8f0f.min.js.map",
"assets/javascripts/worker/search.js": "assets/javascripts/worker/search.926ffd9e.min.js", "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/javascripts/worker/search.js.map": "assets/javascripts/worker/search.926ffd9e.min.js.map",
"assets/stylesheets/main.scss": "assets/stylesheets/main.1e2c5b46.min.css", "assets/stylesheets/main.scss": "assets/stylesheets/main.1e2c5b46.min.css",
"assets/stylesheets/palette.scss": "assets/stylesheets/palette.29415394.min.css" "assets/stylesheets/palette.scss": "assets/stylesheets/palette.f5f04e6f.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

@ -45,7 +45,7 @@
{% block styles %} {% block styles %}
<link rel="stylesheet" href="{{ 'assets/stylesheets/main.1e2c5b46.min.css' | url }}"> <link rel="stylesheet" href="{{ 'assets/stylesheets/main.1e2c5b46.min.css' | url }}">
{% if palette.primary or palette.accent %} {% if palette.primary or palette.accent %}
<link rel="stylesheet" href="{{ 'assets/stylesheets/palette.29415394.min.css' | url }}"> <link rel="stylesheet" href="{{ 'assets/stylesheets/palette.f5f04e6f.min.css' | url }}">
{% endif %} {% endif %}
{% if palette.primary %} {% if palette.primary %}
{% import "partials/palette.html" as map %} {% import "partials/palette.html" as map %}
@ -200,7 +200,7 @@
{% endblock %} {% endblock %}
</div> </div>
{% block scripts %} {% block scripts %}
<script src="{{ 'assets/javascripts/bundle.cc13a381.min.js' | url }}"></script> <script src="{{ 'assets/javascripts/bundle.379e8f0f.min.js' | url }}"></script>
{%- set translations = {} -%} {%- set translations = {} -%}
{%- for key in [ {%- for key in [
"clipboard.copy", "clipboard.copy",

View File

@ -40,7 +40,6 @@
// Rules: primary colors // Rules: primary colors
// ---------------------------------------------------------------------------- // ----------------------------------------------------------------------------
// Build primary colors
@each $name, $colors in ( @each $name, $colors in (
"red": $clr-red-400 $clr-red-200 $clr-red-600, "red": $clr-red-400 $clr-red-200 $clr-red-600,
"pink": $clr-pink-500 $clr-pink-200 $clr-pink-700, "pink": $clr-pink-500 $clr-pink-200 $clr-pink-700,
@ -161,11 +160,6 @@
// Rules: black // Rules: black
// ---------------------------------------------------------------------------- // ----------------------------------------------------------------------------
// Color tile for presentation in theme documentation
button[data-md-color-primary="black"] {
background-color: hsla(0, 0%, 0%, 1);
}
// Color palette // Color palette
[data-md-color-primary="black"] { [data-md-color-primary="black"] {
@ -220,7 +214,6 @@ button[data-md-color-primary="black"] {
// Rules: accent colors // Rules: accent colors
// ---------------------------------------------------------------------------- // ----------------------------------------------------------------------------
// Build accent colors
@each $name, $color in ( @each $name, $color in (
"red": $clr-red-a400, "red": $clr-red-a400,
"pink": $clr-pink-a400, "pink": $clr-pink-a400,
@ -242,6 +235,13 @@ button[data-md-color-primary="black"] {
// Color palette // Color palette
[data-md-color-accent="#{$name}"] { [data-md-color-accent="#{$name}"] {
--md-accent-fg-color: hsla(#{hex2hsl($color)}, 1);
--md-accent-fg-color--transparent: hsla(#{hex2hsl($color)}, 0.1);
// Inverted text for lighter shades
@if index("lime" "yellow" "amber" "orange", $name) {
--md-accent-bg-color: var(--md-default-fg-color);
--md-accent-bg-color--light: var(--md-default-fg-color--light);
}
} }
} }