$accent-color
Main color used for buttons, links, etc.
$body
general background of the content holders.
$body-bg
The actual background of the page.
$text-body
Your global text color.
$text-muted
The slightly fainter text like the one I'm using for this description.
$bg-faded
For most containers that are a different color than the body.
$bg-utility
The OTHER off color - stuff like progress bar backgrounds.
$navbar
The very top menu & the footer.
$navbar-bg-hover
Background hover color for the dropdown.
$navbar-text
Color of the standard - unhovered text.
$navbar-a-hover
Text hover color for all links and the main color for Toyhouse logo & the footer links.
$sidebar
Sidebar color - and color of the bar on the right side.
$sidebar-text
Color of the standard - unhovered text.
$sidebar-divider
Divider color...
$sidebar-a-hover
Color hover color for the links.
$sidebar-hover-line
Color line when you hover over a link.
$sidebar-fav
Color of the 'favorite' link when a character is favorited.
Sidebar Img
This image can not be removed. It's there forever.
$sidebar-img-color
Color of the header - useful for if you don't want an image or you're using the blend mode.
$sidebar-img-image
You can put an image URL between the parenthesis to add a BG! Otherwise, it's a solid color.
$sidebar-img-size
See
W3Schools or my troubleshoot page for more info.
$sidebar-img-position
See
W3Schools or my troubleshoot page for more info.
$sidebar-img-repeat
See
W3Schools or my troubleshoot page for more info.
$sidebar-img-attachment
See
W3Schools or my troubleshoot page for more info.
$sidebar-img-blend
See
W3Schools for more info.
$border
Color of the borders and hr's.
$btn-color
Text color for buttons, just in case your colors are too light or too dark.
$hover-action
- darken - darkens color
- lighten - lightens color
$character-header
Remove or leave the header at the very top of the character page.
$character-ownership-quip
Put in your own little quip before your name in the character header! You can see on this page, mine says 'Created by'.
$character-content-box
Removes the styling around custom content on character profiles.
$character-gallery
Removes character gallery on main character page.
$content-limit
If you DON'T like everything being squished to the middle, turn this off and it'll remove the right sidebar and adjust the content accordingly!
$sidebar-sticky
Makes the sidebar stick to the top of the page on scroll.
$font-family-header
Font for headers, navbar, and sidebar
$font-family-body
Font for everything else
Font Import
This must look like the old import! Toyhou.se will not accept the new import style from google fonts (I have put in a ticket for this).
New Import:
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500&family=Varela+Round&display=swap');
Old Import (This is what it needs to look like):
@import url("https://fonts.googleapis.com/css?family=Varela+Round|Montserrat:400,500");