class=terminal should be a toggle

[kinostl]

Description

Adds the ability to change the body's attributes, allowing users to disable the default class="terminal" which standardizes all headers to be the same size. Opening this PR as a float towards the idea before adding documentation, etc.

Testing

Manually tested by creating a mkdocs-terminal that overrides main.html with the following version.

{% extends "base.html" %}
{% block body_attrs %}
{% endblock body_attrs %}

Direction on where to add an automated test would be appreciated

Checklist

• [ ] I have added documentation for new/changed functionality in this PR or in mkdocs-terminal/documentation
• [ ] All active GitHub checks for tests, formatting, and security are passing

[ntno]

hi @kinostl ! thank you for taking the time to contribute this PR and test the change. i want to make sure i understand what you are trying to achieve.
are you purely interested in making the headers different sizes instead of all the same size?
for a change like this you can use the extra_css option that is built into the MkDocs framework: https://www.mkdocs.org/user-guide/customizing-your-theme/

extra_css example

i have made a quick example here:

• ntno/mkdocs-demo PR #36
• live site with full instructions

with extra_css

if you were to implement the above changes, you would get output where the <h1> headers are bigger than <h2> headers:

default

whereas in the original mkdocs-terminal theme the header tags are all the same size:

[ntno]

please let me know if there is something about the extra_css method that does not work for your use case. i would prefer not to remove theterminal CSS class as removing this class will remove much of the other mkdocs-terminal style settings

[kinostl]

I think that provides a solution. I'm concerned by the use of !important and how it would interact with other custom css, but thats probably a user-side issue to resolve since its already custom css.

[ntno]

re: important rule

you can remove the !important CSS rule if you further specify the selector like this:

.terminal h1 {
    font-size: 2.33em;
}
...

updated the previous example with the above change: http://ntno-mkdocs-demo-ci-pr-36.s3-website.us-east-1.amazonaws.com/header-override-example/

another option: extend extrahead block

another option would be to extend the extrahead block. this option is most similar to your original proposal. extending a theme block is discussed in the theme docs here: https://ntno.github.io/mkdocs-terminal/configuration/blocks/

full example in the mkdocs-demo repo:

• https://github.com/ntno/mkdocs-demo/pull/37
• live site with full instructions

example snippet:

{% extends "base.html" %} 
{%- block extrahead %}
<!-- START mkdocs-demo theme override; extrahead block -->
<link href="{{ 'css/multi-size-headers.css' | url }}" rel="stylesheet">
<!-- END mkdocs-demo theme override; extrahead block -->
{%- endblock extrahead %}

[ntno]

all that being said i do like your idea of making it easier to have multi-sized headers, @kinostl

if you are still interested in making a contribution that would do this i can let you know where the change would be made

i am thinking it would be similar to the style.links.underline.hide feature: https://ntno.github.io/mkdocs-terminal/configuration/features/#stylelinksunderlinehide

[ntno]

created feature issue: https://github.com/ntno/mkdocs-terminal/issues/135

[kinostl]

I'm good with all of that. I'm going to close this PR so that we can focus on the feature issue.