Update admonition styles in MkDocs theme: (#2981)

* Apply admonition styles also to <details> tags
* Increase contrast of default admonitions
* Add some admonition styles (only for use on MkDocs' site for now)
This commit is contained in:
Oleh Prypin
2022-09-19 22:19:04 +02:00
committed by GitHub
parent 2a8ed44d9e
commit b33fb2ac67
3 changed files with 27 additions and 12 deletions

View File

@@ -29,6 +29,17 @@ div.admonition.new {
border-color: #bcf1e8;
}
.admonition.new, details.new {
color: #15654a;
background-color: #edfff9;
border-color: #bcf1e8;
}
.admonition.example, details.example {
color: #353579;
background-color: #f0f1ff;
border-color: #d8dcf0;
}
/* Definition List styles */
dd {

View File

@@ -140,7 +140,7 @@ There are three kinds of events: [Global Events], [Page Events] and
[Template Events].
<details class="card">
<summary class="card-header">
<summary>
See a diagram with relations between all the plugin events
</summary>
<div class="card-body">

View File

@@ -215,7 +215,7 @@ h1:hover .headerlink, h2:hover .headerlink, h3:hover .headerlink, h4:hover .head
.admonition {
.admonition, details {
padding: 15px;
margin-bottom: 20px;
border: 1px solid transparent;
@@ -223,29 +223,33 @@ h1:hover .headerlink, h2:hover .headerlink, h3:hover .headerlink, h4:hover .head
text-align: left;
}
.admonition.note { /* csslint allow: adjoining-classes */
color: #3a87ad;
background-color: #d9edf7;
.admonition.note, details.note { /* csslint allow: adjoining-classes */
color: #2e6b89;
background-color: #e2f0f7;
border-color: #bce8f1;
}
.admonition.warning { /* csslint allow: adjoining-classes */
color: #c09853;
background-color: #fcf8e3;
.admonition.warning, details.warning { /* csslint allow: adjoining-classes */
color: #7a6032;
background-color: #fffae5;
border-color: #fbeed5;
}
.admonition.danger { /* csslint allow: adjoining-classes */
color: #b94a48;
background-color: #f2dede;
.admonition.danger, details.danger { /* csslint allow: adjoining-classes */
color: #7f3130;
background-color: #fde3e3;
border-color: #eed3d7;
}
.admonition-title {
.admonition-title, summary {
font-weight: bold;
text-align: left;
}
.admonition>p:last-child, details>p:last-child {
margin-bottom: 0;
}
@media (max-width: 991.98px) {
.navbar-collapse.show { /* csslint allow: adjoining-classes */
overflow-y: auto;