64 - In a Reverie
Description
Name:
In a Reverie
Description:
Clean cut layout with accents of blue and yellow and with a grungy header.
General Information Layout Style: Expressive Tested in: Mozilla Firefox and Internet Explorer
Also checked the layout in browsershots and it looked okay in Safari and Opera as well. Best Resolution: 1024*768 and above Account Levels: Layouts work with all account levels (Basic, Plus, Paid). [ How to change add orientation] Works with Navigation Strip: To make it work with the navigation strip, you'll need to make adjustments in the codes. This will be explained bellow! [ How to enable/disable] Credit:
{Bigger} ~ {Live Preview}
Installation Go to Manage: Customize Select a new Theme:
Images & Code The images are hosted on my account, but it is recommended that you upload them yourself. Don't forget to change the URL's in the basic codes!
Step 1: Basic Codes
Bellow you can find the basic codes for the layout. Paste these codes in the "Custom stylesheet" box:
/*=================================================================================================================================================*/ /*----------------------------------------------------------- LAYOUT 64: IN A REVERIE -------------------------------------------------------------*/ /*------------------------------------------------------------- S2 STYLE: EXPRESSIVE --------------------------------------------------------------*/ /*------------------------------- AVAILABLE AT GAWARIEL_DESIGN (http://community.livejournal.com/gawariel_design/) -------------------------------*/ /*--------------------------------------------- CREATED BY GAWARIEL (http://gawariel.livejournal.com/) --------------------------------------------*/ /*---------------------------------------------------------- IMAGES MADE IN PHOTOSHOP CS ----------------------------------------------------------*/ /*=================================================================================================================================================*/ /*------------------------------*/ /*----- GENERAL FORMATTING -----*/ /*------------------------------*/ * {margin: 0px; padding: 0px; } body { margin: 0; padding: 0; background-color: #F5F7FA; background-repeat: repeat-x; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/bg.jpg); background-position: top left; font-family: lucida sans unicode, serif; font-size: 62.5%; overflow:-moz-scrollbars-vertical; } a { color: #0073AE; font-weight: bold; text-decoration: none; } a:hover { color: #9E6900; } /*--------------------------*/ /*----- PAGE STRUCTURE -----*/ /*--------------------------*/ #container { margin: 0 auto; padding: 0; width: 100%; height: 280px; } #container-inner { margin: 0 auto; width: 960px; padding: 10px; } #alpha { float: right; width: 720px; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/alpha.png); background-repeat: repeat-y; background-position: top center; } #alpha-inner { padding: 30px; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/alphabottom.jpg); background-repeat: no-repeat; background-position: bottom center; } #beta { float: left; width: 201px; margin: 20px 0 0 0; padding: 18px 0 0 0; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/sbtop.png); background-repeat: no-repeat; background-position: top left; } #beta-inner { padding: 0 0 70px 0; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/sbbottom.jpg); background-repeat: no-repeat; background-position: bottom center; } /*----------------------------*/ /*---------- HEADER ----------*/ /*----------------------------*/ #header { margin: 0; padding: 0; height: 270px; } /*--------------------------------*/ /*---------- NAVIGATION ----------*/ /*--------------------------------*/ ul.nav { position: absolute; top: 242px; list-style-type: none; font-family: georgia, serif; font-variant: small-caps; font-size: 2.0em; } ul.nav li.item { display: inline; padding: 0 25px 0 25px; } ul.nav li.item a { font-weight: normal; color: #0073AE; } ul.nav li.item a:hover { color: #003879; } /*-----------------------------------*/ /*---------- PREVIOUS/NEXT ----------*/ /*-----------------------------------*/ .stream-header, .stream-footer { display: block; } .stream-header { margin: 0 0 30px 0 ; } .prevnext { text-transform: uppercase; font-family: georgia, serif; font-size: 1.2em; color: #DCE9EF; } .prevnext a { background: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/comment.jpg) repeat-x top left; border: 1px solid #00C1E0; padding: 7px; font-weight: normal; } .prevnext a:hover { color: #003879; } /*-----------------------------------*/ /*---------- ENTRY STYLING ----------*/ /*-----------------------------------*/ .asset { clear:both; } .asset-body { text-align: justify; font-size: 1.15em; line-height: 1.5em; padding: 5px; color: #3B3F41; } .asset-body ul, .asset-body ol { margin: 10px 0 10px 50px; } blockquote { margin: 10px;; padding: 5px; border-top: 5px solid #00C1E0; border-bottom: 5px solid #F7AA10; } .asset-body textarea { font-size: 0.9em; border-top: 1px solid #00C1E0; border-left: 1px solid #00C1E0; border-bottom: 1px solid #F7AA10; border-right: 1px solid #F7AA10; } .asset-header { margin: 0 0 20px 0; } /*------ SUBJECT ------*/ h2.asset-name.page-header2 { font-family: georgia, serif; font-variant: small-caps; font-size: 2.8em; letter-spacing: 0.1em; } h2.asset-name.page-header2 a{ color: #565B5E; font-weight: normal; text-decoration: none; } /*------ ENTRY DATE ------*/ .asset-header .asset-meta-list { background:transparent; float: left; margin: 0; padding: 0 0 0 45px; } .asset-header .datetime { text-transform: uppercase; color: #D49E32; font-size: 1.2em; letter-spacing: 0.1em; } /*------ USERICON ------*/ .asset .user-icon { float:right; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/ico.jpg)!important; background-repeat: repeat-x; border: 1px solid #00C1E0; margin: 0 0 10px 10px; } .asset .user-icon img { padding: 8px; } .user-icon span{ display: block; padding: 0; margin: 0; background-color: #ACE9EE!important; text-align: center; } span.ljuser a b, .user-icon .ljuser a{ padding: 0; color: #0073AE; font-variant: small-caps; } span.ljuser a:hover b{ color: #9E6900; } .ljuser img { width: 0; height: 0; background-repeat: no-repeat; background-color:transparent; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/user.png); padding: 16px 0px 0 16px; } .ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] { background-color:transparent; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/user.png); padding: 16px 0px 0 9px; } .ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] { background-color:transparent; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/community.png); padding: 16px 0px 0px 12px; } /*------ METADATA ------*/ .lj-currents, .asset-tags-list { margin: 15px 0 0 0; padding: 5px; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/meta.jpg); border: 1px solid #9FA5A9; font-variant: small-caps; font-size: 1.1em; letter-spacing: 0.2em; color: #565B5E; } .lj-currents .entryMetadata-label { margin:0px 8px 0px 0px; color: #003879; } .lj-currents ul{ margin:0px; padding:0px; list-style-type:none; } .lj-currents a { font-weight: normal; } /*------ ENTRY TAGS ------*/ .asset-tags-list { margin: 0; } .asset-tags-header { margin: 15px 0 0 0; color: #003879; font-variant: small-caps; font-size: 1.1em; letter-spacing: 0.2em; font-weight: normal; } .asset-tags-list li.item { display:inline; } .asset-tags-list li.item a { color: #565B5E; font-weight: normal; border-top: 1px solid #F7AA10; border-bottom: 1px solid #F7AA10; } .asset-tags-list li.item a:hover { border-top: 1px solid #00C1E0; border-bottom: 1px solid #00C1E0; } /*------ COMMENT LINKS ------*/ .asset-meta-list{ margin: 20px 0 0 0; } ul.asset-meta-list { list-style-type:none; float: right; } li.asset-meta-comments{ display: inline; margin: 0 5px; text-transform: uppercase; font-family: georgia, serif; font-size: 1.2em; color: #DCE9EF; line-height: 3.0em; } li.asset-meta-comments a { background: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/comment.jpg) repeat-x top left; border: 1px solid #00C1E0; padding: 7px; font-weight: normal; } li.asset-meta-comments a:hover { color: #003879; } /*------ DIVIDER ------*/ .asset-footer { background: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/divider.jpg) no-repeat bottom center; margin: 80px 0 0 0; height: 118px; } /*---------------------------*/ /*----- SIDEBAR STYLING -----*/ /*---------------------------*/ .widget { color: #94989B; font-size: 1.1em; line-height: 1.4em; text-align: justify; background-color: #1F2224; } .widget-inner { padding: 0 10px; } h3.widget-header { padding: 0 0 5px 0; font-weight: normal; font-family: georgia, serif; font-variant: small-caps; font-size: 1.8em; letter-spacing: 0.1em; color: #5B89A1; border-bottom: 1px solid #D49E32; } h3.widget-header a{ color: #565B5E; font-weight: normal; text-decoration: none; color: #5B89A1; } .widget-footer { padding: 0 0 50px 0; } .widget-footer a { padding: 10px 0 0 0; float: right; } /*------ PROFILE WIDGET ------*/ .about-me-widget .user-pic { text-align: center; padding: 10px; } .about-me-widget .user-pic img{ background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/ico.jpg)!important; background-repeat: repeat-x; border: 1px solid #00C1E0; padding: 8px; } .about-me-widget dl { padding: 0 0 60px 0; } .profile-username { border-bottom: 1px dotted #3B3F41; } /*WEBSITE*/ .profile-name a{ float: right; padding: 5px 0 0 0; } /*------ LATEST MONTH WIDGET ------*/ .calendar-widget { padding: 0 0 20px 0; } .calendar-widget table { margin: 0 auto; } .calendar-widget table th { color: #F7AA10; text-align: center; font-weight: normal; border: 1px dotted #3B3F41; } .calendar-widget table td { padding: 1px; text-align:center; border: 1px dotted #3B3F41; } /*------ LINKS, TAGS, SUMMARY WIDGET ------*/ .typelist-widget, .categories-widget, .archive-widget, .customtext-widget { padding: 0 0 60px 0; } .typelist-widget .widget-list, .categories-widget .widget-list, .archive-widget .widget-list { list-style-type:none; margin: 0; padding: 0; font-variant: small-caps; font-size: 1.1em; letter-spacing: 0.2em; color: #565B5E; } .typelist-widget li a, .categories-widget li a, .archive-widget li a { display: block; padding:6px 5px 6px 5px; font-weight:normal; border-bottom:1px dotted #3B3F41; color: #94989B; } .typelist-widget li a:hover, .categories-widget li a:hover, .archive-widget li a:hover { color: #F7AA10; } /*------ CUSTOM TEXT WIDGETS ------*/ .customtext-widget .widget-content { padding: 10px 0 0 0; } /*------ NOT DISPLAYING OTHER WIDGETS ------*/ .syndicate-widget,.powered-widget,.designed-widget { display: none; } /*----------------------------------*/ /*---------- ARCHIVE PAGE ----------*/ /*----------------------------------*/ .yeartable { width: 100%; clear:both; padding: 10px; } td.yearmonth { padding: 20px 0; font-family: georgia, serif; font-variant: small-caps; font-size: 2.8em; letter-spacing: 0.1em; } td.yearmonth a { color: #565B5E; font-weight: normal; text-decoration: none; font-size: 0.5em; } .yearday { text-align: center; border: 1px dotted #3B3F41; font-variant: small-caps; font-size: 1.1em; letter-spacing: 0.2em; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/comment.jpg) repeat-x top left; border: 1px solid #00C1E0; color: #003879; } td.yeardate div { text-align:center; padding:4px; border: 1px dotted #3B3F41; } td.yeardate div a { font-weight:bold; } ul.year { list-style-type:none; margin:0px; padding:0px; } ul.year li { display:block; text-align: center; width: 50px; height: 10px; float:left; margin: 0 0 0 5px; padding: 10px 0px 0px 0px; font-size: 11px; font-weight: bold; } /*-----------------------------------*/ /*---------- COMMENT PAGES ----------*/ /*-----------------------------------*/ /*------ COMMENT BOXES ------*/ h2.comments-header { text-align: center; font-family: georgia, serif; font-variant: small-caps; font-size: 2.8em; letter-spacing: 0.1em; color: #565B5E; font-weight: normal; } #comments .comment{ margin:10px 10px 20px 10px; padding: 10px; color: #3B3F41; border: 1px solid #9FA5A9; background: #DCE9EF url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/meta.jpg); } html*#comments .comment{ width: 90%; } #comments .comment-odd .comment-links, #comments .comment-even .comment-links { clear: both; text-align: right; text-transform: uppercase; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/comment.jpg) repeat-x top left; border: 1px solid #00C1E0; padding: 7px; color: #00C1E0; } #comments .comment-odd .comment-links a, #comments .comment-even .comment-links a { font-weight: normal; } #comments .comment-odd .comment-links a:hover, #comments .comment-even .comment-links a:hover { color: #003879; } .comment .user-icon { float:right; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/ico.jpg)!important; background-repeat: repeat-x; border: 1px solid #00C1E0; margin: 0 0 10px 10px; padding: 7px; } .commenter-name { font-size: 1.1em; } .commenter-name b { font-weight: normal; font-size: 1.2em; } .comment-body { padding: 5px; text-align: justify; font-size: 1.1em; line-height: 1.8em; letter-spacing: 0.1em; } .comment-subject { margin: 5px 0 0 0; padding: 0; font-weight: normal; font-family: georgia, serif; font-variant: small-caps; font-size: 1.4em; letter-spacing: 0.1em; color: #5B89A1; border-bottom: 1px solid #D49E32; } .comment-date { display: block; text-align: right; padding: 5px 5px 10px 10px; font-size: 1.0em; text-transform: uppercase; color: #D49E32; letter-spacing: 0.1em; } .comments-nav { text-align:center; font-size: 1.1em; text-transform:uppercase; } .comments-nav a { font-weight: normal; } /*------ REPLY PAGE ------*/ .quickreply { border: 1px solid #9FA5A9; background: #DCE9EF url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/meta.jpg); } textarea#commenttext.textbox { width:90%; } form#postform { border: 1px solid #9FA5A9; background: #DCE9EF url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/meta.jpg); padding: 10px; } textarea, input#subject.textbox, select { border: 1px solid #BED5E0; background: #DCE9EF; margin:0px 0px 8px 0px; padding:2px; font-family: verdana, Georgia, sans-serif; font-size: 1.1em; color:#565B5E; } input { padding: 2px; background: #DCE9EF; border:1px solid #BED5E0!important; color:#003879; } option { background: #DCE9EF; border-bottom:1px solid #BED5E0; padding:1px; color:#003879!important; letter-spacing: 2px; font-size: 10px; } /*==========================================================================================================================*/ /* ----------------------------- PASTE THE CODE FOR YOUR CHOSEN HEADER UNDERNEATH THIS LINE ------------------------------- */ /*==========================================================================================================================*/
Step 2: I use the Navigation strip
If you want to use the navigation strip, you will need to make a small change in the basic code.
Find the following portion of codes:
#container { margin: 0 auto; padding: 0; width: 100%; height: 280px; } and replace the bold, blue part with the following line:
margin: -45px auto 0 auto; Step 3: Choose your header
Troubleshooting Before asking any questions, make sure you read all information above thoroughly and that your question isn't adressed in the FAQ. If your problem still isn't solved, you are welcome to ask your question here.
General Information Layout Style: Expressive Tested in: Mozilla Firefox and Internet Explorer
Also checked the layout in browsershots and it looked okay in Safari and Opera as well. Best Resolution: 1024*768 and above Account Levels: Layouts work with all account levels (Basic, Plus, Paid). [ How to change add orientation] Works with Navigation Strip: To make it work with the navigation strip, you'll need to make adjustments in the codes. This will be explained bellow! [ How to enable/disable] Credit:
- Pattern used was found at the inspirationgallery and was modified by me
- Original usericons belong to passing_girl and were modified by me
{Bigger} ~ {Live Preview}
Installation Go to Manage: Customize Select a new Theme:
- Check the box next to 'Only show themes available to me'
- Type 'Expressive' in the Search box
- Click search
- Apply any theme that you get in the search results
- Plus Accounts: Choose an Ad placement
- Apply the following: '2 Column (sidebar on left)'
- Click 'Customize Selected Theme'
- Leave a comment --> Reply
- 1 comment // # comments --> {1} // {#}
- Edit entry --> Edit
- Edit tags --> Tags
- ...etc
- Display of tags in sidebar: List
- Use layout's "Base Weblog" stylesheet: No
- Custom external stylesheet URL: Leave empty
- Custom stylesheet: Paste the codes (given bellow) in the box
Images & Code The images are hosted on my account, but it is recommended that you upload them yourself. Don't forget to change the URL's in the basic codes!
Step 1: Basic Codes
Bellow you can find the basic codes for the layout. Paste these codes in the "Custom stylesheet" box:
/*=================================================================================================================================================*/ /*----------------------------------------------------------- LAYOUT 64: IN A REVERIE -------------------------------------------------------------*/ /*------------------------------------------------------------- S2 STYLE: EXPRESSIVE --------------------------------------------------------------*/ /*------------------------------- AVAILABLE AT GAWARIEL_DESIGN (http://community.livejournal.com/gawariel_design/) -------------------------------*/ /*--------------------------------------------- CREATED BY GAWARIEL (http://gawariel.livejournal.com/) --------------------------------------------*/ /*---------------------------------------------------------- IMAGES MADE IN PHOTOSHOP CS ----------------------------------------------------------*/ /*=================================================================================================================================================*/ /*------------------------------*/ /*----- GENERAL FORMATTING -----*/ /*------------------------------*/ * {margin: 0px; padding: 0px; } body { margin: 0; padding: 0; background-color: #F5F7FA; background-repeat: repeat-x; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/bg.jpg); background-position: top left; font-family: lucida sans unicode, serif; font-size: 62.5%; overflow:-moz-scrollbars-vertical; } a { color: #0073AE; font-weight: bold; text-decoration: none; } a:hover { color: #9E6900; } /*--------------------------*/ /*----- PAGE STRUCTURE -----*/ /*--------------------------*/ #container { margin: 0 auto; padding: 0; width: 100%; height: 280px; } #container-inner { margin: 0 auto; width: 960px; padding: 10px; } #alpha { float: right; width: 720px; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/alpha.png); background-repeat: repeat-y; background-position: top center; } #alpha-inner { padding: 30px; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/alphabottom.jpg); background-repeat: no-repeat; background-position: bottom center; } #beta { float: left; width: 201px; margin: 20px 0 0 0; padding: 18px 0 0 0; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/sbtop.png); background-repeat: no-repeat; background-position: top left; } #beta-inner { padding: 0 0 70px 0; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/sbbottom.jpg); background-repeat: no-repeat; background-position: bottom center; } /*----------------------------*/ /*---------- HEADER ----------*/ /*----------------------------*/ #header { margin: 0; padding: 0; height: 270px; } /*--------------------------------*/ /*---------- NAVIGATION ----------*/ /*--------------------------------*/ ul.nav { position: absolute; top: 242px; list-style-type: none; font-family: georgia, serif; font-variant: small-caps; font-size: 2.0em; } ul.nav li.item { display: inline; padding: 0 25px 0 25px; } ul.nav li.item a { font-weight: normal; color: #0073AE; } ul.nav li.item a:hover { color: #003879; } /*-----------------------------------*/ /*---------- PREVIOUS/NEXT ----------*/ /*-----------------------------------*/ .stream-header, .stream-footer { display: block; } .stream-header { margin: 0 0 30px 0 ; } .prevnext { text-transform: uppercase; font-family: georgia, serif; font-size: 1.2em; color: #DCE9EF; } .prevnext a { background: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/comment.jpg) repeat-x top left; border: 1px solid #00C1E0; padding: 7px; font-weight: normal; } .prevnext a:hover { color: #003879; } /*-----------------------------------*/ /*---------- ENTRY STYLING ----------*/ /*-----------------------------------*/ .asset { clear:both; } .asset-body { text-align: justify; font-size: 1.15em; line-height: 1.5em; padding: 5px; color: #3B3F41; } .asset-body ul, .asset-body ol { margin: 10px 0 10px 50px; } blockquote { margin: 10px;; padding: 5px; border-top: 5px solid #00C1E0; border-bottom: 5px solid #F7AA10; } .asset-body textarea { font-size: 0.9em; border-top: 1px solid #00C1E0; border-left: 1px solid #00C1E0; border-bottom: 1px solid #F7AA10; border-right: 1px solid #F7AA10; } .asset-header { margin: 0 0 20px 0; } /*------ SUBJECT ------*/ h2.asset-name.page-header2 { font-family: georgia, serif; font-variant: small-caps; font-size: 2.8em; letter-spacing: 0.1em; } h2.asset-name.page-header2 a{ color: #565B5E; font-weight: normal; text-decoration: none; } /*------ ENTRY DATE ------*/ .asset-header .asset-meta-list { background:transparent; float: left; margin: 0; padding: 0 0 0 45px; } .asset-header .datetime { text-transform: uppercase; color: #D49E32; font-size: 1.2em; letter-spacing: 0.1em; } /*------ USERICON ------*/ .asset .user-icon { float:right; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/ico.jpg)!important; background-repeat: repeat-x; border: 1px solid #00C1E0; margin: 0 0 10px 10px; } .asset .user-icon img { padding: 8px; } .user-icon span{ display: block; padding: 0; margin: 0; background-color: #ACE9EE!important; text-align: center; } span.ljuser a b, .user-icon .ljuser a{ padding: 0; color: #0073AE; font-variant: small-caps; } span.ljuser a:hover b{ color: #9E6900; } .ljuser img { width: 0; height: 0; background-repeat: no-repeat; background-color:transparent; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/user.png); padding: 16px 0px 0 16px; } .ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] { background-color:transparent; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/user.png); padding: 16px 0px 0 9px; } .ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] { background-color:transparent; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/community.png); padding: 16px 0px 0px 12px; } /*------ METADATA ------*/ .lj-currents, .asset-tags-list { margin: 15px 0 0 0; padding: 5px; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/meta.jpg); border: 1px solid #9FA5A9; font-variant: small-caps; font-size: 1.1em; letter-spacing: 0.2em; color: #565B5E; } .lj-currents .entryMetadata-label { margin:0px 8px 0px 0px; color: #003879; } .lj-currents ul{ margin:0px; padding:0px; list-style-type:none; } .lj-currents a { font-weight: normal; } /*------ ENTRY TAGS ------*/ .asset-tags-list { margin: 0; } .asset-tags-header { margin: 15px 0 0 0; color: #003879; font-variant: small-caps; font-size: 1.1em; letter-spacing: 0.2em; font-weight: normal; } .asset-tags-list li.item { display:inline; } .asset-tags-list li.item a { color: #565B5E; font-weight: normal; border-top: 1px solid #F7AA10; border-bottom: 1px solid #F7AA10; } .asset-tags-list li.item a:hover { border-top: 1px solid #00C1E0; border-bottom: 1px solid #00C1E0; } /*------ COMMENT LINKS ------*/ .asset-meta-list{ margin: 20px 0 0 0; } ul.asset-meta-list { list-style-type:none; float: right; } li.asset-meta-comments{ display: inline; margin: 0 5px; text-transform: uppercase; font-family: georgia, serif; font-size: 1.2em; color: #DCE9EF; line-height: 3.0em; } li.asset-meta-comments a { background: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/comment.jpg) repeat-x top left; border: 1px solid #00C1E0; padding: 7px; font-weight: normal; } li.asset-meta-comments a:hover { color: #003879; } /*------ DIVIDER ------*/ .asset-footer { background: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/divider.jpg) no-repeat bottom center; margin: 80px 0 0 0; height: 118px; } /*---------------------------*/ /*----- SIDEBAR STYLING -----*/ /*---------------------------*/ .widget { color: #94989B; font-size: 1.1em; line-height: 1.4em; text-align: justify; background-color: #1F2224; } .widget-inner { padding: 0 10px; } h3.widget-header { padding: 0 0 5px 0; font-weight: normal; font-family: georgia, serif; font-variant: small-caps; font-size: 1.8em; letter-spacing: 0.1em; color: #5B89A1; border-bottom: 1px solid #D49E32; } h3.widget-header a{ color: #565B5E; font-weight: normal; text-decoration: none; color: #5B89A1; } .widget-footer { padding: 0 0 50px 0; } .widget-footer a { padding: 10px 0 0 0; float: right; } /*------ PROFILE WIDGET ------*/ .about-me-widget .user-pic { text-align: center; padding: 10px; } .about-me-widget .user-pic img{ background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/ico.jpg)!important; background-repeat: repeat-x; border: 1px solid #00C1E0; padding: 8px; } .about-me-widget dl { padding: 0 0 60px 0; } .profile-username { border-bottom: 1px dotted #3B3F41; } /*WEBSITE*/ .profile-name a{ float: right; padding: 5px 0 0 0; } /*------ LATEST MONTH WIDGET ------*/ .calendar-widget { padding: 0 0 20px 0; } .calendar-widget table { margin: 0 auto; } .calendar-widget table th { color: #F7AA10; text-align: center; font-weight: normal; border: 1px dotted #3B3F41; } .calendar-widget table td { padding: 1px; text-align:center; border: 1px dotted #3B3F41; } /*------ LINKS, TAGS, SUMMARY WIDGET ------*/ .typelist-widget, .categories-widget, .archive-widget, .customtext-widget { padding: 0 0 60px 0; } .typelist-widget .widget-list, .categories-widget .widget-list, .archive-widget .widget-list { list-style-type:none; margin: 0; padding: 0; font-variant: small-caps; font-size: 1.1em; letter-spacing: 0.2em; color: #565B5E; } .typelist-widget li a, .categories-widget li a, .archive-widget li a { display: block; padding:6px 5px 6px 5px; font-weight:normal; border-bottom:1px dotted #3B3F41; color: #94989B; } .typelist-widget li a:hover, .categories-widget li a:hover, .archive-widget li a:hover { color: #F7AA10; } /*------ CUSTOM TEXT WIDGETS ------*/ .customtext-widget .widget-content { padding: 10px 0 0 0; } /*------ NOT DISPLAYING OTHER WIDGETS ------*/ .syndicate-widget,.powered-widget,.designed-widget { display: none; } /*----------------------------------*/ /*---------- ARCHIVE PAGE ----------*/ /*----------------------------------*/ .yeartable { width: 100%; clear:both; padding: 10px; } td.yearmonth { padding: 20px 0; font-family: georgia, serif; font-variant: small-caps; font-size: 2.8em; letter-spacing: 0.1em; } td.yearmonth a { color: #565B5E; font-weight: normal; text-decoration: none; font-size: 0.5em; } .yearday { text-align: center; border: 1px dotted #3B3F41; font-variant: small-caps; font-size: 1.1em; letter-spacing: 0.2em; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/comment.jpg) repeat-x top left; border: 1px solid #00C1E0; color: #003879; } td.yeardate div { text-align:center; padding:4px; border: 1px dotted #3B3F41; } td.yeardate div a { font-weight:bold; } ul.year { list-style-type:none; margin:0px; padding:0px; } ul.year li { display:block; text-align: center; width: 50px; height: 10px; float:left; margin: 0 0 0 5px; padding: 10px 0px 0px 0px; font-size: 11px; font-weight: bold; } /*-----------------------------------*/ /*---------- COMMENT PAGES ----------*/ /*-----------------------------------*/ /*------ COMMENT BOXES ------*/ h2.comments-header { text-align: center; font-family: georgia, serif; font-variant: small-caps; font-size: 2.8em; letter-spacing: 0.1em; color: #565B5E; font-weight: normal; } #comments .comment{ margin:10px 10px 20px 10px; padding: 10px; color: #3B3F41; border: 1px solid #9FA5A9; background: #DCE9EF url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/meta.jpg); } html*#comments .comment{ width: 90%; } #comments .comment-odd .comment-links, #comments .comment-even .comment-links { clear: both; text-align: right; text-transform: uppercase; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/comment.jpg) repeat-x top left; border: 1px solid #00C1E0; padding: 7px; color: #00C1E0; } #comments .comment-odd .comment-links a, #comments .comment-even .comment-links a { font-weight: normal; } #comments .comment-odd .comment-links a:hover, #comments .comment-even .comment-links a:hover { color: #003879; } .comment .user-icon { float:right; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/ico.jpg)!important; background-repeat: repeat-x; border: 1px solid #00C1E0; margin: 0 0 10px 10px; padding: 7px; } .commenter-name { font-size: 1.1em; } .commenter-name b { font-weight: normal; font-size: 1.2em; } .comment-body { padding: 5px; text-align: justify; font-size: 1.1em; line-height: 1.8em; letter-spacing: 0.1em; } .comment-subject { margin: 5px 0 0 0; padding: 0; font-weight: normal; font-family: georgia, serif; font-variant: small-caps; font-size: 1.4em; letter-spacing: 0.1em; color: #5B89A1; border-bottom: 1px solid #D49E32; } .comment-date { display: block; text-align: right; padding: 5px 5px 10px 10px; font-size: 1.0em; text-transform: uppercase; color: #D49E32; letter-spacing: 0.1em; } .comments-nav { text-align:center; font-size: 1.1em; text-transform:uppercase; } .comments-nav a { font-weight: normal; } /*------ REPLY PAGE ------*/ .quickreply { border: 1px solid #9FA5A9; background: #DCE9EF url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/meta.jpg); } textarea#commenttext.textbox { width:90%; } form#postform { border: 1px solid #9FA5A9; background: #DCE9EF url(http://i19.photobucket.com/albums/b153/gawariel_design/64_In%20a%20Reverie/meta.jpg); padding: 10px; } textarea, input#subject.textbox, select { border: 1px solid #BED5E0; background: #DCE9EF; margin:0px 0px 8px 0px; padding:2px; font-family: verdana, Georgia, sans-serif; font-size: 1.1em; color:#565B5E; } input { padding: 2px; background: #DCE9EF; border:1px solid #BED5E0!important; color:#003879; } option { background: #DCE9EF; border-bottom:1px solid #BED5E0; padding:1px; color:#003879!important; letter-spacing: 2px; font-size: 10px; } /*==========================================================================================================================*/ /* ----------------------------- PASTE THE CODE FOR YOUR CHOSEN HEADER UNDERNEATH THIS LINE ------------------------------- */ /*==========================================================================================================================*/
;){kind=link}
;){kind=link}
;){kind=link}
;){kind=link}
;){kind=link}
!important;){kind=link}
;){kind=link}
;){kind=link}
;){kind=link}
Step 2: I use the Navigation strip
If you want to use the navigation strip, you will need to make a small change in the basic code.
Find the following portion of codes:
#container { margin: 0 auto; padding: 0; width: 100%; height: 280px; } and replace the bold, blue part with the following line:
margin: -45px auto 0 auto; Step 3: Choose your header
- Option 1: Use a premade header
I have made a total of 20 headers using quotes you guys suggested in this post.
To use one of these headers, paste the following code at the BOTTOM of the basic stylesheet and paste in the URL of the header you want!
#header-name, #header-description { display: none; } #container { background: url(URL OF YOUR HEADER) no-repeat top left; } - Option 2: Display your LJ title and subtitle
I'm not really a fan of this option, because it doesn't look as pretty... {Live Preview}
But because some of you asked for it, you can forego the option of a quote in the header and make it so your journal title and subtitle are displayed at the top. To do so, paste the following code at the BOTTOM of the basic stylesheet.
Extra image on top of basic images:
base.jpg
#header-name { padding: 80px 0 0 0; } #header-name a{ color: #00C1E0; font-variant: small-caps; font-size: 4.0em; font-family: georgia, serif; letter-spacing: 0.2em; font-weight: normal; } #header-description { padding: 0 0 0 40px; color: #F7AA10; font-variant: small-caps; font-size: 2.5em; letter-spacing: 0.2em; } #container { background: url(URL OF BASE HEADER) no-repeat top left; } - Option 3: Create your own header
- Download base.jpg
- Download the font "Bleeding Cowboys" here
- In your favourite graphics program, open "base.jpg" and use the font you downloaded to type the text of your choice
- Apply a gradient over the text (45°) using these two colours: #F7AA10 and #00C1E0
- Save your image, upload it and then follow the instruction written with "option 1" for the headers
20 headers In a reverie It has been said that art is a tryst, for in the joy of it maker and beholder meet Without freedom no art There is grace afoot in the world, and it will find you History puts a saint in every dream
Life is too deep for words What does the winter bring, if not yet another spring Just breathe Colors follow the changes of the emotions What fools these mortals be
Beauty in the breakdown Garden of everything Welcome to my universe Never ending dreams Shoot for the moon. Even if you miss, you land among stars
Love and let the rest go life's a color spectrum I shut my eyes in order to see Live for today Into my starlight reverie
Troubleshooting Before asking any questions, make sure you read all information above thoroughly and that your question isn't adressed in the FAQ. If your problem still isn't solved, you are welcome to ask your question here.