maqui: (Hope ☆ So kiss me.)
[personal profile] maqui posting in [community profile] bodhum
After some procrastination, I have finally gotten around to reworking the CSS for this layout; I named it Tomorrow's Dream as a reference to Hope Estheim's theme in Final Fantasy XIII-2 and, as such, the accent color is orange (yes, yes, I know they nixed the orange for him in XIII-2, but orange is a much more friendly color to work with than yellow when you're working with light backgrounds for text). As with Junk Dealer, I organized the CSS for this layout so it is easier for you to modify the colors and text as you see fit, though, so if you want some color other than orange, you'll be able to switch to it easily.

Click for a full preview.

As always, CSS and special mentions can be found beneath the cut.

☆ Includes custom entry pages.
☆ All font customization is found under in the Text section of the CSS, all color customization is found under the Colors section of the CSS, and the two image areas (for the two lines on the page background and for the header) are found in the Images section. This is all set up so you can easily place your own header image; just place the URL of the image between the single quotes in the "#header #journaltitles-container" definition at the bottom.
☆ Fonts used are Verdana and Georgia; to change either one, you'll only have to change the font family name in the Text section.
☆ The two orange accent colors are #e98f0d (text) and #f1af50 (elements). Each value only appears once, so just replace that with the color you want if you'd like to change it. For example, for my own personal use, I changed those colors with the reds I used for Junk Dealer.
☆ The base code does not have a header image; the preview just shows an example of one. For your reference, the white header area that will use a background image is 900 x 200 pixels.
☆ To set this up, select any Basic Boxes theme and then change the page layout to 1 Column (modules at top and bottom; no sidebar) Then, under Customize your theme, navigate to Custom CSS, uncheck the "Use layout's stylesheet(s)," and paste the CSS into the box; save your changes and then go to the Modules section. You should set your modules up to look something like this (you can use whatever tags display you would like); this will ensure the modules display properly. Please make sure to note the numbers for some of these sections! In particular, the tags module should be numbered so that it will be the first module for the secondary module section; this ensures that it will display properly. Also note that the module section at the bottom is confined to a certain height; modules that tend to take up the majority of that height (tags, calendar, page summary, recent active entries) should, thus, be used sparingly. I personally like to choose only two (tags and calendar) and then use some of the smaller modules so they fill in the center.



And that's that; enjoy!


Side Note . By the way, the CSS for Junk Dealer has been updated to fix an issue on entries and comments with no userpic.

Profile

bodhum: (Default)
Bodhum

The Seaside City of Bodhum

This community is a resource for any icons and layouts that I put together; I'm not particularly frequent about posting any - I mostly make icons when I feel like there's something new I'd like to have and my layouts are created on a whim - but it's nice to have them in a good, central location where I can share them with others.

I mostly create icons for whatever has caught my fancy; generally, this is whatever fandom I love. The ones that will likely get the most love are Ouran High School Host Club, Final Fantasy XIII, Tales of the Abyss, Tales of Vesperia, D.Gray-man, and Xenosaga.

As for layouts, I prefer clean layouts that generally provide some room for flexibility. I also like keeping any background images to a minimum, both to main that clean look and to offer versatility. I suppose this might be a nod toward the concept of "simple and elegant." None of my work is particularly stunning or groundbreaking, but it generally gets the job done well enough - and it's hopefully easy on the eyes.