Other HTML Snippets
These are bits and pieces of additional HTML that you can add to your world pages, folders, or profiles: wherever you think they will work. They are meant to be pieced together as you see fit, rather than be a single layout for a single purpose. Feel free to add them into the tabbed HTML layout that comes with this CSS if you prefer to switch out the sections or add to them. Everything here is styled specifically to work with the CSS Layout and will not display correctly if not used with the CSS.
CARD LINKS
These card links work well as links to character folders, or world guides, etc. Can be whatever you like. You can change the titles and background images of these cards to whatever you want. They will link to whatever custom link you input. The card is set to a default height of 150px, but you can change that with inline styling if you prefer. If you want to add more, you can copy the individual columns or the entire row -- just make sure they are properly nested if you copy and paste them.
CALLOUT SECTION
Callout Header
Callout Subheader
This is basically a card, anything you want to draw attention to, or if you want to separate it from other information being displayed, using this may work well. You can also have bulleted lists:
- This is a list item. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- This is a list item. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- This is a list item. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
This works well for a list of Rules or other information you need to display concisely. If you want to remove the border, just remove the first div section that encloses the callout.
Callout Header
Callout Subheader
This is a dark version of the callout. You can use it as an alternate or your default.- This is a list item. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- This is a list item. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- This is a list item. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
This works well for a list of Rules or other information you need to display concisely. If you want to remove the border, just remove the first div section that encloses the callout.
BLOCK QUOTE
BANNER HEADER
Can be used as a header for a World Page or any other information you want it for. You can also add paragraphs of text under the title if you wish.
AESTHETIC IMAGES: ROW OF FOUR
If you want to add a second row, simply copy the row onto a new line.
AESTHETIC IMAGES: 3x3 MOOD BOARD
If you want the mood board to be smaller or larger you can adjust the maximum with in the inline style of the row. It's set to 750px as default, removing it will size the board to the page.