diff --git a/sphinx_material/sphinx_material/layout.html b/sphinx_material/sphinx_material/layout.html
index e86343c25..040c5e3dc 100644
--- a/sphinx_material/sphinx_material/layout.html
+++ b/sphinx_material/sphinx_material/layout.html
@@ -58,6 +58,12 @@
{% if theme_touch_icon %}
{% endif %}
+
{{ super() }}
{% endblock %}
diff --git a/sphinx_material/sphinx_material/static/stylesheets/application-fixes.css b/sphinx_material/sphinx_material/static/stylesheets/application-fixes.css
index a65d194b7..ab9670a81 100644
--- a/sphinx_material/sphinx_material/static/stylesheets/application-fixes.css
+++ b/sphinx_material/sphinx_material/static/stylesheets/application-fixes.css
@@ -175,6 +175,14 @@ table.longtable.docutils.align-default {
}
}
+[data-md-color-primary=custom] .md-nav__extra_link:active {
+ color: var(--custom-color-primary)
+}
+
+[data-md-color-primary=custom] .md-nav__item--nested > .md-nav__extra_link {
+ color: inherit
+}
+
[data-md-color-primary=red] .md-nav__extra_link:active {
color: #ef5350
}
@@ -327,6 +335,10 @@ table.longtable.docutils.align-default {
color: inherit
}
+[data-md-color-accent=custom] .md-nav__extra_link:focus, [data-md-color-accent=custom] .md-nav__extra_link:hover {
+ color: var(--custom-color-accent)
+}
+
[data-md-color-accent=red] .md-nav__extra_link:focus, [data-md-color-accent=red] .md-nav__extra_link:hover {
color: #ff1744
}
diff --git a/sphinx_material/sphinx_material/static/stylesheets/application-palette.css b/sphinx_material/sphinx_material/static/stylesheets/application-palette.css
index 5eadc1c5b..9d95474bd 100644
--- a/sphinx_material/sphinx_material/static/stylesheets/application-palette.css
+++ b/sphinx_material/sphinx_material/static/stylesheets/application-palette.css
@@ -16,6 +16,28 @@ button[data-md-color-primary]:hover {
opacity: .75
}
+button[data-md-color-primary=custom] {
+ background-color: var(--custom-color-primary)
+}
+
+[data-md-color-primary=custom] .md-typeset a {
+ color: var(--custom-color-primary)
+}
+
+[data-md-color-primary=custom] .md-header,
+[data-md-color-primary=custom] .md-hero {
+ background-color: var(--custom-color-primary)
+}
+
+[data-md-color-primary=custom] .md-nav__link--active,
+[data-md-color-primary=custom] .md-nav__link:active {
+ color: var(--custom-color-primary)
+}
+
+[data-md-color-primary=custom] .md-nav__item--nested>.md-nav__link {
+ color: inherit
+}
+
button[data-md-color-primary=red] {
background-color: #ef5350
}
@@ -1138,6 +1160,10 @@ button[data-md-color-accent=deep-orange] {
}
@media only screen and (max-width:59.9375em) {
+ [data-md-color-primary=custom] .md-nav__source {
+ background-color: var(--custom-color-primary);
+ opacity: 0.0325;
+ }
[data-md-color-primary=red] .md-nav__source {
background-color: rgba(190, 66, 64, .9675)
}
@@ -1202,6 +1228,9 @@ button[data-md-color-accent=deep-orange] {
}
@media only screen and (max-width:76.1875em) {
+ html [data-md-color-primary=custom] .md-nav--primary .md-nav__title--site {
+ background-color: var(--custom-color-primary)
+ }
html [data-md-color-primary=red] .md-nav--primary .md-nav__title--site {
background-color: #ef5350
}
@@ -1269,6 +1298,9 @@ button[data-md-color-accent=deep-orange] {
}
@media only screen and (min-width:76.25em) {
+ [data-md-color-primary=custom] .md-tabs {
+ background-color: var(--custom-color-primary)
+ }
[data-md-color-primary=red] .md-tabs {
background-color: #ef5350
}
diff --git a/sphinx_material/sphinx_material/theme.conf b/sphinx_material/sphinx_material/theme.conf
index c77b5e4fc..586ce7134 100644
--- a/sphinx_material/sphinx_material/theme.conf
+++ b/sphinx_material/sphinx_material/theme.conf
@@ -55,14 +55,18 @@ theme_color = #3f51b5
# Primary colors:
# red, pink, purple, deep-purple, indigo, blue, light-blue, cyan,
# teal, green, light-green, lime, yellow, amber, orange, deep-orange,
-# brown, grey, blue-grey, white
+# brown, grey, blue-grey, white, custom
color_primary = blue-grey
# Accent colors:
# red, pink, purple, deep-purple, indigo, blue, light-blue, cyan,
-# teal, green, light-green, lime, yellow, amber, orange, deep-orange
+# teal, green, light-green, lime, yellow, amber, orange, deep-orange, custom
color_accent = blue
+# Custom colors:
+custom_color_primary = 546e7a
+custom_color_accent = 448aff
+
# Content Minification
# Minify pages after creation using htmlmin
html_minify = False