New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add classnames to body element #526

Merged
merged 2 commits into from Sep 15, 2016

Conversation

Projects
None yet
3 participants
@vwchu
Contributor

vwchu commented Sep 14, 2016

Feature enhancement that adds the 2 related capabilities that enable users to:

  1. Detect the layout of a page via CSS or JavaScript, and
  2. Toggle various user-defined classes in the body tag's class attribute by assigning an array of classnames to the page.classes or layout.classes variables. If page.classes is defined, overrides layout.classes. (I would prefer concatenation, but that doesn't seem to work).

This enables users to specify custom styles to use for specific pages and components on that page.
For instances, the landing page might have specific styling that is only used on that page.

---
layout: splash
classes:
  - landing
  - dark-theme

---

Outputs:

<body class="layout--splash landing dark-theme">
@mmistakes

Looks useful. Thanks!

@mmistakes mmistakes merged commit 57449b3 into mmistakes:develop Sep 15, 2016

mmistakes added a commit that referenced this pull request Sep 15, 2016

Add classnames to body element (#526)
* Expose layout type as class name on body element

* Add ability to add classes to body via front matter

prakharbahuguna added a commit to prakharbahuguna/prakharbahuguna.github.io that referenced this pull request Sep 16, 2016

Add classnames to body element (mmistakes#526)
* Expose layout type as class name on body element

* Add ability to add classes to body via front matter

@vwchu vwchu deleted the vwchu:body-classes branch Sep 17, 2016

@mmistakes mmistakes referenced this pull request Sep 19, 2016

Closed

Header image aspect ratio depends on excerpt length #542

3 of 5 tasks complete
@DanielSank

This comment has been minimized.

Show comment
Hide comment
@DanielSank

DanielSank Sep 19, 2016

FYI the docs say this already exists, and it's not clear in the docs whether the classes are concatenated or completely overwrite the default ones.

https://mmistakes.github.io/minimal-mistakes/docs/layouts/

DanielSank commented Sep 19, 2016

FYI the docs say this already exists, and it's not clear in the docs whether the classes are concatenated or completely overwrite the default ones.

https://mmistakes.github.io/minimal-mistakes/docs/layouts/

@mmistakes

This comment has been minimized.

Show comment
Hide comment
@mmistakes

mmistakes Sep 19, 2016

Owner

@DanielSank They don't overwrite or concatenate, they're simply added to <body class=""> on the post/page you assign a class name to in YAML Front Matter.

And even when assigned they do nothing unless there is corresponding CSS for the classes somewhere.

Owner

mmistakes commented Sep 19, 2016

@DanielSank They don't overwrite or concatenate, they're simply added to <body class=""> on the post/page you assign a class name to in YAML Front Matter.

And even when assigned they do nothing unless there is corresponding CSS for the classes somewhere.

jluccisano added a commit to jluccisano/jluccisano.github.io that referenced this pull request May 6, 2017

Add classnames to body element (mmistakes#526)
* Expose layout type as class name on body element

* Add ability to add classes to body via front matter

antonizoon pushed a commit to antonizoon/antonizoon.github.io that referenced this pull request Jul 27, 2018

Add classnames to body element (mmistakes#526)
* Expose layout type as class name on body element

* Add ability to add classes to body via front matter
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment