Author Topic: custom CSS to change the font size in code and quote tags for our forum  (Read 3805 times)

Offline ollydbg

  • Developer
  • Lives here!
  • *****
  • Posts: 5915
  • OpenCV and Robotics
    • Chinese OpenCV forum moderator
You may already noticed that after forum upgrade to 2.x, the font size in quote and code tags are smaller. See the screen shot below (I'm using the Core theme, this is much similar to our old 1.x forum theme.

To customize the font in those fields, I just find a simple way:

1, use the Stylish :: Add -ons for Firefox - Mozilla Add-ons
2, create a simple new style, and paste those code to the content of your new style. The original code font is "x-small", I just change it to "small".
Code
@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("forums.codeblocks.org") {
    .bbc_code {
    font-size: small !important;
    }
    .bbc_standard_quote {
    font-size: small !important;
    }
    .bbc_alternate_quote {
    font-size: small !important;
    }
}
3, enable your new style. Done. See the screen shot after this change.





PS: this is my first time to learn CSS, so my custom CSS may contains errors.
PS2: see this as a reference: How To Fix Small Annoyances On The Web With Stylish [Firefox & Chrome]
« Last Edit: February 04, 2015, 09:06:58 am by ollydbg »
If some piece of memory should be reused, turn them to variables (or const variables).
If some piece of operations should be reused, turn them to functions.
If they happened together, then turn them to classes.

Offline ollydbg

  • Developer
  • Lives here!
  • *****
  • Posts: 5915
  • OpenCV and Robotics
    • Chinese OpenCV forum moderator
2015-04-13, some update to the code tags font setting, note that there are many code tag types, but my script only handle few of them(such as cpp, text, diff).
Code
@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("forums.codeblocks.org") {
    .bbc_code {
    font-size: small !important;
    }
    .bbc_standard_quote {
    font-size: small !important;
    }
    .bbc_alternate_quote {
    font-size: small !important;
    }
    .cpp{
    font-size: small !important;   
    }
    .text{
    font-size: small   !important; 
    }
    .diff{
    font-size: small   !important; 
    }
}
If some piece of memory should be reused, turn them to variables (or const variables).
If some piece of operations should be reused, turn them to functions.
If they happened together, then turn them to classes.