Title header color and text centering

[jmanion711]

Setup

• Browsers and versions: Chrome 83.0.4103.97
• MediaWiki version: 1.34.1
• Database version: MySQL (MariaDB 10.4)
• PHP version: 7.4.6 (apache2handler)
• Pivot version: 2.2.0
• Extension version (if connected to the issue):

Issue

I'm sure this is user error but I am having a devil of a time getting a header, of a defined column area, to display a color.

This pick is from the MediaWiki example:

This pick is from my implementation.

Also note that I am unable to center the text.

Not sure what I'm doing wrong. Thank you for your help in this matter.

[mbilsky]

I'm not sure why this is happening but it happened for me as well (even in version 2.1).

I fixed it by modifying /assets/stylesheets/foundations.css

There may be a better way but this one has worked for a year plus without any issues. It also seems to work in v2.2.

Changing the .subheader class to:

`.subheader { line-height: 1.4; / color: #6f6f6f;/ color: #fff; font-weight: normal; padding-top: 0.5em; padding-right: 0.5em; padding-bottom: 0.5em; padding-left: 0.5em; margin-top: 0.2rem; margin-bottom: 0.5rem; text-align: center; background: #517398;

}`

[jmanion711]

Awesome! Thank you!

[Hutchy68]

I fixed it by modifying /assets/stylesheets/foundations.css

ouch, you shouldn't change the actual code because when you update the version it will be lost. Please inspect the code on https://pivot.wikiproject.net and use the System Message MediaWiki:Pivot.css to change styling. That is the safe way.

Homepage code on page. Used tags <h3>

<h3 class="subheader"><span class="fa fa-th fa-lg" style="display:inline;"></span> Responsive Grid</h3>

Note the class="subheader" and then look at https://pivot.wikiproject.net/wiki/MediaWiki:Pivot.css

...
/* Style here are only to highlight functionality of Pivot */

/* make the main page subheaders solid bars */
.subheader {
    background: #517398;
    color: #fff;
    text-align: center;
    padding: .5em;
}
...

This will work for any element you give a class of subheader. Eg. <h2 class="subheader">

[jmanion711]

Got it. Thank you Tom.

On Fri, Jul 24, 2020 at 11:37 AM Tom Hutchison notifications@github.com wrote:

I fixed it by modifying /assets/stylesheets/foundations.css

ouch, you shouldn't change the actual code because when you update the version it will be lost. Please inspect the code on https://pivot.wikiproject.net and use the System Message MediaWiki:Pivot.css to change styling. That is the safe way.

Homepage code on page. Used tags

Responsive Grid

Note the class="subheader" and then look at https://pivot.wikiproject.net/wiki/MediaWiki:Pivot.css

... / Style here are only to highlight functionality of Pivot /

/ make the main page subheaders solid bars / .subheader { background: #517398; color: #fff; text-align: center; padding: .5em; } ...

This will work for any element you give a class of subheader. Eg. <h2 class="subheader">

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/Hutchy68/pivot/issues/97#issuecomment-663626930, or unsubscribe https://github.com/notifications/unsubscribe-auth/AP4LXU7O4CRWCZLLJDZWNEDR5G2FTANCNFSM4NYRQGRA .

[Hutchy68]

No problem, closing as answered.