Closed Ahrak closed 9 months ago
I modified CSS for readthedocs
and mkdocs
themes.
theme_dir
: MkDocs provides custom_dir
option for creating a custom theme.theme
: I don't know whether one Page
of MkDocs can have two or more themes or not.thanks for your work!
The mkapi-readthedocs doesn't add the right styles but now it is better customizable with fewer css lines. I share my css code her if someone would have the original readthedocs style:
.mkapi-node {
font-family: "Lato","proxima-nova","Helvetica Neue",Arial,sans-serif;
}
.mkapi-section-name-parameters,
.mkapi-section-name-attributes,
.mkapi-section-name-returns,
.mkapi-section-name-yields,
.mkapi-section-name-raises,
.mkapi-section-name-methods,
.mkapi-section-name-functions,
.mkapi-section-name-classes {
background: none;
border-bottom: none;
}
div.mkapi-object.code,
h1.mkapi-object.code,
h2.mkapi-object.code,
h3.mkapi-object.code,
h4.mkapi-object.code {
background: none;
border: none;
margin: 6px 0;
margin-top: 6px;
padding: 6px;
padding-right: 12px;
border-left: solid 3px #ccc;
background: #f0f0f0;
color: #111;
width: max-content;
}
div.mkapi-object.code code.mkapi-object-signature {
color: #555;
font-style: italic;
font-size: 90%;
}
h1.mkapi-object.plain {
font-size: 150%;
margin-top: 0;
font-weight: 700;
font-family: "Roboto Slab","ff-tisa-web-pro","Georgia",Arial,sans-serif;
}
div.mkapi-object-class.code {
background: none;
border: none;
font-size: 90%;
line-height: normal;
background: #e7f2fa;
color: #2980B9;
border-top: solid 3px #6ab0de;
}
div.mkapi-object.code.mkapi-object-class code.mkapi-object-name {
color: #111;
}
div.mkapi-object.code.mkapi-object-class code.mkapi-object-signature {
color: #2980B9;
font-weight: 700;
}
.mkapi-object-kind.mkapi-object-kind-class {
color: inherit;
}
div.mkapi-object.code code.mkapi-object-prefix
{
color: #111;
}
.mkapi-args-type {
color: #2980B9;
cursor: pointer;
}
.mkapi-section-body-returns
{
padding-left: 48px;
}
.mkapi-node ul.mkapi-args-list {
padding-left: 32px;
/*margin-top: -32px;*/
}
Thanks for your sharing.
I reconstructed Jinja2 templates in Version 1.0.5 because I added a new feature that creates bidirectional link between document and source code. This broke CSS compatibility with previous version. I modified the current CSS referring to your code. If you find something wrong, I hope you will send PR. Thank you.
Is there a way to override the jinja2 templates in the current release (1.0.12)? @daizutabi
It would be nice to have the option to use different themes in mkdocs.
My suggestion: read the theme entry from
mkdocs.yml
and choose the corresponding theme from mkapi/theme folder. If the theme is not available than use the default one.Additionally i would like to have two options for the plugin:
Currently i am adding a custom css file to overwrite the theme to match the readthedocs-style, but this isn't ideal.