spire。

Closed.

daemon — Sat, 12 Feb 2011 14:08:14 GMT

CLOSED.
You could also say permanent hiatus, if you so wish. I realized that it was simply a farce to believe that I would make new layouts again. The fact is, not only have my interests changed, but I'm getting a lot more work from college now. LJ layout making is no longer something I have the patience for, especially when my other activities have more relevance to my desired career in game development, and/or actually have the potential to earn me a paycheck. I won't go into the details, as they'd just bore you fine folks, so in short: don't expect to see more layouts.

I'm really sorry about this -- I tried to delay the inevitable as much as possible. But it's just not going to happen anymore. So I'd like to redirect you to refutare, a layout community operated by two very talented friends of mine. You're probably watching them already, but if you aren't, get on it!

Anyway, I think I've rambled on long enough. Thank you for all the support over the years, and farewell. ♥

EDIT: The community will not be deleted. It will remain as an archive of my layouts. :)

Tutorial: Replace the Custom Userheads

daemon — Wed, 29 Sep 2010 13:52:42 GMT

Some of your friends have custom userheads, and as neat as this feature is, you may not like how they are messing the conformity of your custom tiny icons. While I couldn't help but buy a userhead that cheesily relates to my username, I can sympathize. Thus, it is with great pleasure that I reveal the code needed to correct this aberration. (This tutorial can also double as a simple introduction to replacing icons in your own layout.)

For clarification, many of my layouts (your mileage may vary with other maker's stuff) have something like the following code to replace the userheads with your own icons (code in red is used to apply the same custom icon to the ONTD, staff, Open ID, and anonymous icons, mostly not present in my older layouts):

img[src*="userinfo.gif"], img[src*="user_ontd.gif"], img[src*="userinfo-support.gif"], img[src*="openid-profile.gif"], img[src*="anonymous.gif"] {
background-image:url("http://irondevil.org/icon/categories/diagona%2010a/05.png") !important;
background-repeat:no-repeat !important;
height:0;
padding:15px 11px 0 0 !important;
width:0;
}

As you may have guessed, replacing the userheads is as easy as inserting the first code snippet in the list before the bracket. Don't forget the comma!

img[src*="userinfo.gif"], img[src*="user_ontd.gif"], img[src*="userinfo-support.gif"], img[src*="openid-profile.gif"], img[src*="anonymous.gif"], img[src*="userhead"]  {
background-image:url("http://irondevil.org/icon/categories/diagona%2010a/05.png") !important;
background-repeat:no-repeat !important;
height:0;
padding:15px 11px 0 0 !important;
width:0;
}

Note that I haven't tested this with every userhead, but I did a quick check on a couple and it appears that they all have "userhead" in the URL, which means this solution should work for them.

Theoretically, it's also possible to replace individual userheads with custom icons. I'm not sure why you'd put yourself through that, but it's as simple as finding the image URL for a particular userhead (my demon horns one, for instance, is http://files.livejournal.com/userhead/28) and inserting that "/28" part into the code.

Tada, no more demon horns userheads!

minimalism: new york

daemon — Sat, 24 Jul 2010 20:56:57 GMT

People wanted a Minimalism layout with a sidebar, so here you go. Named for my lovely state of birth. :) The layout will stretch to fit larger monitors.

EDIT: Added code for customized contextual pop-ups.

"Wait, who the hell is ~daemon and what happened to ~thrashmetal?!"

layout notes
account types	Basic, Paid
compatible browsers	Internet Explorer 8, Mozilla Firefox, Opera, Safari, Google Chrome Margin/padding issues in IE, as usual. Otherwise ok.
minimum resolution	1024x768
comment pages	Yes
navstrip	Optional
disabled	N/A
css stylesheet
stylesheet	/--------------------------------------------------- STYLESHEET CREATOR: daemon.livejournal.com STYLESHEET NAME: New York S2 STYLE: Minimalism DOWNLOAD: spire.livejournal.com *Please remember to credit!** -----------------------------------------------------/ body { background:none repeat scroll 0 0 #FFFFFF; color:#444444; font-family:Helvetica,Arial,Sans-serif; font-size:11px; line-height:20px; } textarea, input, select { background:none repeat scroll 0 0 #FFFFFF; border:1px solid #DDDDDD; color:#444444; font-size:12px; max-width:450px; } a, a:visited { color:#000000; text-decoration:none; } a:hover { text-decoration:underline; } blockquote { background:none repeat scroll 0 0 #DDDDDD; padding:14px; } .header { width:200px; } #page { padding-bottom:20px; position:absolute; top:70px; width:100%; } .content .header .userpic { display:inline; float:left; overflow:hidden; } .header .userpic-in, hr, .header h3, .header-sec h1 { display:none; } .header-sec h1 { display:none; font-size:12px; margin-top:-80px; position:absolute; text-align:right; width:60%; } .header h2 { background:none repeat scroll 0 0 #000000; color:#FFFFFF; font-size:22px; letter-spacing:-1px; padding:16px; position:absolute; top:24px; } ul.nav { font-size:22px; font-weight:bold; letter-spacing:-1px; line-height:31px; list-style-type:none; margin:0; padding:0; text-transform:lowercase; } ul.nav li { border-bottom:1px solid #DDDDDD; padding:2px 0; } ul.nav li a { color:#000000; } ul.nav li a:hover { color:#666666; text-decoration:none; } ul.nav-sub { display:none; } .layout { border-top:7px solid #DDDDDD; margin:121px auto; min-width:800px; padding-top:12px; width:60%; } .content { float:left; margin-right:-100%; width:100%; } .content-inner { margin-left:244px; margin-right:15px; margin-top:-176px; } .content .entry { margin:3.5em 0 0; overflow:hidden; position:relative; width:100%; } .content dd.entry-text { margin:0 auto; min-height:164px; } .metadata { line-height:16px; margin-left:22px; padding:11px 0; } .metadata dl { margin:0; padding:0; } .metadata dt, .metadata dd { display:inline; margin:2px; } dd.meta-music-value { background:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2014px/Headphones1414.PNG") no-repeat scroll 0 -1px transparent; padding-left:15px; } dd.meta-mood-value { background:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2014px/Contact1414.PNG") no-repeat scroll 0 -1px transparent; padding-left:15px; } dd.meta-location-value { background:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2014px/Earth1414.PNG") no-repeat scroll 0 -1px transparent; padding-left:15px; } dd.meta-groups-value { background:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2014px/MSN1414.PNG") no-repeat scroll 1px 0 transparent; padding-left:15px; } .meta-music-label, .meta-location-label, .meta-mood-label, .meta-groups-label { display:none !important; } .ljtags { margin-left:17px; margin-top:16px; } .ljtags a { color:#111111; } .vcard { text-align:right; } .vcard dd.username .ljuser a b { font-size:14px; } .vcard dt img { border:15px solid #111111; } .vcard .entry-date abbr { border:medium none; } .content .entry .entry-title { color:#000000; font-size:22px; font-weight:bold; letter-spacing:-1px; line-height:27px; margin:5px 163px 5px 0; } .content .entry .entry-title a { } .content .entry .entry-linkbar { margin-right:0; padding-bottom:0.5em; text-align:center; } .content .entry .entry-text .author { float:right; margin:-2.6em 0 1.2em 1.2em; } .content .entry .entry-text .author { margin-left:0; } .content .entry .entry-text .metadata dl { display:block; margin:0; padding:0; } .content .entry .entry-text .metadata dt, .content .entry .entry-text .metadata dd { display:inline; margin-left:0; } .content .entry .entry-text .metadata dt { font-weight:bold; margin-right:0.4em; } .content .entry .entry-text .metadata dd img { vertical-align:top; } .content .entry .entrymenu { margin:10px 0 0; padding:0; } .content .entry .entrymenu ul { background:none repeat scroll 0 0 #000000; margin-bottom:0; margin-left:0; margin-top:0; min-height:22px; padding:3px 11px; text-align:right; } .content .entry .entrymenu li { display:inline; margin-left:13px; } .content .entry .entrymenu li a { color:#FFFFFF; } li.tell_friend { display:none !important; } .content ul.page-nav { list-style:none outside none; margin:0; padding:29px 0; text-align:right; } .content ul.page-nav li { display:inline; margin:0 5px; } .content .page-nav a { background:none repeat scroll 0 0 #000000; color:#FFFFFF; font-size:22px; font-weight:bold; letter-spacing:-1px; padding:8px 13px; } .calendar-wrap table { margin:16px auto; width:400px; } .calendar-wrap td { background:none repeat scroll 0 0 #DDDDDD; padding-bottom:24px; padding-left:6px; } .calendar-wrap caption { font-size:22px; font-weight:bold; letter-spacing:-1px; } .sidebar { float:left; width:100%; } .sidebar-inner { width:200px; } .sidebar-block dd { margin:0; } dl.sidebar-links a { font-size:14px; font-weight:bold; } dl.sidebar-links dd { background:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2014px/Media-Player1414.PNG") no-repeat scroll 0 3px transparent; padding-left:17px; } .sidebar-block dt, .sidebar-powered { display:none; } .sidebar dd.calendar-wrap table { width:200px; } .sidebar dd.calendar-wrap table td { background:none repeat scroll 0 0 #DDDDDD; padding:0 4px 6px; } .sidebar dd.calendar-wrap caption { font-size:14px; font-weight:bold; letter-spacing:0; padding:4px 0; text-align:right; } .ljuser a b { background:none repeat scroll 0 0 transparent; text-decoration:none !important; } .ljuser a:hover b { background:none repeat scroll 0 0 transparent; border-bottom:0 none; text-decoration:none !important; } img[src="userinfo.gif"], img[src="userinfo-support.gif"], img[src="user_ontd.gif"], img[src="openid-profile.gif"], img[src="anonymous.gif"] { background:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2014px/Contact1414.PNG") no-repeat scroll 0 0 transparent; height:0; padding:18px 13px 0 0 !important; width:0; } #lj_controlstrip img[src="userinfo.gif"], #lj_controlstrip img[src="user_ontd.gif"] { background:url("http://irondevil.org/icon/categories/damniconsmini/user.gif") no-repeat scroll 0 0 transparent; } img[src="community.gif"], img[src="partnercomm.gif"] { background-image:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2014px/Home1414.PNG"); background-repeat:no-repeat !important; height:0; padding:17px 13px 0 0 !important; width:0; } img[src="newsinfo.gif"] { background-image:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2014px/Update1414.PNG") !important; background-repeat:no-repeat !important; height:0; padding:17px 13px 0 0 !important; width:0; } img[src="syndicated.gif"] { background-image:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2014px/RSS1414.PNG") !important; background-repeat:no-repeat !important; height:0; padding:17px 13px 0 0 !important; width:0; } img[src="icon_protected.gif"], img[src="icon_groups.gif"], img[src="icon_private.gif"] { background-image:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2020px/Lock.png") !important; background-position:0 0; background-repeat:no-repeat; height:0; padding:1px 26px 17px 0 !important; width:0; } .comments-links { background:none repeat scroll 0 0 #111111; color:#FFFFFF; padding:5px; text-align:center; } .entry-comments-text { } .comment-wrap { margin-bottom:11px; margin-top:24px; } .comment-upic img { border:14px solid #111111; float:left; height:75px; width:75px; } .comment-text { margin:14px 11px 0 114px; min-height:72px; } a.comment-permalink { margin:0 4px; } .comment-menu { background:none repeat scroll 0 0 #111111; color:#000000; padding:5px 10px; text-align:right; } .comment-menu a, .comments-links a { color:#FFFFFF; } .comment-head-in { font-size:10px; padding-left:114px; } .comment-head-in p { display:inline; } .comment-head-in .ljuser { font-size:18px; } .comment-head-in img[src*="userinfo.gif"] { background-image:none !important; height:0; padding:0 !important; width:0; } .comment-head-in h3 { color:#AAAAAA; font-size:22px; letter-spacing:-1px; margin-bottom:0; } #qrform table { border:medium none !important; } .content-tags { padding:10px; } #lj_controlstrip { background:none repeat scroll 0 0 #111111; color:#FFFFFF; } #lj_controlstrip td { border-bottom:medium none; color:#FFFFFF; } #lj_controlstrip a { color:#FFFFFF; } #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic { border-right:0 none; } #lj_controlstrip_login td { border-bottom:0 none; } #lj_controlstrip td td { border-bottom:0 none; } #lj_controlstrip_userpic { background-image:url("http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000"); } #lj_controlstrip_loggedout_userpic { background-image:url("http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000"); } #lj_controlstrip input { background:none repeat scroll 0 0 #333333 !important; border:medium none; color:#FFFFFF !important; } #lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember { background:none repeat scroll 0 0 #333333 !important; border:medium none; color:#FFFFFF !important; } #lj_controlstrip .ljuser a b { background:none repeat scroll 0 0 transparent; color:#FFFFFF; letter-spacing:0; text-decoration:none !important; } div.ContextualPopup div.Inner { background:#000 !important; border:1px solid #000; } div.ContextualPopup .Content { color:#ddd; font-family:Helvetica,Arial,Sans-serif; font-size:11px; margin:4px 59px 4px 4px; padding:10px; } div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited { color:#fff !important; text-decoration:none !important; font-weight:normal; } div.ContextualPopup div.Inner a:hover { text-decoration:underline !important; } div.ContextualPopup .Relation { font-size:17px; font-weight:bold; letter-spacing:-1px; color:#fff; } div.ContextualPopup .Userpic img { margin:7px; }

how to install
select journal style	Type Black Pit into the search box and apply the theme.
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	Tiny icons by brsev.

read the layout faq before asking questions!
commission a custom layout!

smooth sailing: hells bells

daemon — Thu, 08 Jul 2010 15:29:15 GMT

I recall someone saying something about wanting a dark layout, so here's a dark layout! I also hastily inverted the colors for a light version.

layout notes
account types	Basic, Plus, Paid (Horizontal ads)
compatible browsers	Internet Explorer 8, Mozilla Firefox, Opera, Safari, Google Chrome
minimum resolution	1024x768
comment pages	Yes
navstrip	Optional
disabled	Default header menu
css stylesheet
pick your layout:	• Hells Bells (Dark) • Hells Bells (Light)

how to install
select journal style	1. Apply any Smooth Sailing theme. 2. Scroll down to Choose a Page Setup and select 2 Column (sidebar on left).
entry text	Paste the following code into Format for Date and Time (Recent/Friends/Entry/Reply page) and Format for Date and Time (Day page only). %%mon%% %%dd%% %%yyyy%%
links list	Define your links. These are the links that show up underneath the title. I recommend adding no more than 5-6 links of moderate length.
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.
optional
upload images	The images in this layout are hosted on Tinypic. It is highly recommended that you re-upload them to your own server, as I won't replace them if they break. http://i29.tinypic.com/2vvs5c9.jpg http://i29.tinypic.com/ne6hl0.jpg http://i32.tinypic.com/2qd03kh.jpg http://i26.tinypic.com/dmwn14.jpg
other notes	This layout will work best with a short journal title.

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Icon by parle • Circular icons by Pro Theme Design • Inspired by the Simplified Clothing blog

read the layout faq before asking questions!
commission a custom layout!

minimalism: planet caravan

daemon — Wed, 30 Jun 2010 14:14:54 GMT

EDIT 2: Chrome/Safari bug is FIXED! :D

I decided to play around with Minimalism here -- the bar on the side of each entry varies between five different colors, depending on the entry ID. It's actually a lot more randomized than it looks in the preview; it ended up going from darkest -> lightest purely out of coincidence. Surprisingly enough, it didn't break in IE.

(Btw, I'm pretty sure there's one thing I'm forgetting to fix in the stylesheet, or address here, but I can't remember what. I'll edit this once I do. 8|)

layout notes
account types	Basic, Plus, Paid
compatible browsers	Internet Explorer 8, Mozilla Firefox, Opera, Safari, Google Chrome There are minor alignment issues in IE (as usual).
minimum resolution	1024x768
comment pages	Yes
navstrip	Optional
disabled	Sidebar
css stylesheet
stylesheet	/--------------------------------------------------- STYLESHEET CREATOR: scythe.livejournal.com STYLESHEET NAME: Planet Caravan S2 STYLE: Minimalism DOWNLOAD: thrashmetal.livejournal.com *Please remember to credit!** -----------------------------------------------------/ body { background:none repeat scroll 0 0 #FFFFFF; color:#111111; font-family:Helvetica,Arial,Sans-serif; font-size:11px; margin:0; } a, a:visited { color:#ED303C; text-decoration:none; } a:hover { color:#F5634A; text-decoration:underline; } blockquote { border-left:14px solid #111111; padding-left:10px; } a img { border:medium none; } li { margin:3px 0; } .layout { position:absolute; text-align:justify; top:0; width:100%; } hr { display:none; } .entry-title { font-size:24px; letter-spacing:-1px; line-height:27px; margin-left:4px; padding:16px 17px; text-align:left; } dt.entry-title a { color:#111111; } dt.entry-title a:hover { } .entry-wrap { margin:0 auto; width:645px; } dd.entry-text { margin:0; padding:0 18px; } .entry-content { line-height:17px; min-height:100px; padding-bottom:20px; } dl#post-sticky .entry-content { min-height:0; padding-bottom:15px; } .vcard { float:right; line-height:13px; text-align:right; } .vcard dd.username .ljuser a b { font-size:14px; } .vcard dd.username .ljuser a:hover { text-decoration:none; } .vcard dt { float:right; } .vcard dt img { border:19px solid #111111; margin-left:-710px; margin-top:-37px; position:absolute; } dd.username img[src="userinfo.gif"], dd.username img[src="user_ontd.gif"], dd.username img[src="userinfo-support.gif"], dd.username img[src="community.gif"], dd.username img[src="partnercomm.gif"], dd.username img[src="newsinfo.gif"], dd.username img[src="syndicated.gif"] { background:none repeat scroll 0 0 transparent !important; height:0; padding:0 !important; width:0; } abbr.updated { border:0 none; } .metadata { line-height:15px; margin-bottom:7px; margin-left:22px; } .metadata dl { line-height:15px; margin:0; padding:0; } .metadata dt, .metadata dd { display:inline; margin:2px; } dd.meta-music-value { background:url("http://irondevil.org/icon/categories/damniconsmini/musicnote.gif") no-repeat scroll 1px 3px transparent; padding-left:14px; } dd.meta-mood-value { background:url("http://irondevil.org/icon/categories/damniconsmini/heart.gif") no-repeat scroll 1px 3px transparent; padding-left:14px; } dd.meta-location-value { background:url("http://irondevil.org/icon/categories/damniconsmini/house.gif") no-repeat scroll 0 1px transparent; padding-left:14px; } dd.meta-groups-value { background:url("http://irondevil.org/icon/categories/damniconsmini/user.gif") no-repeat scroll 1px 0 transparent; padding-left:14px; } .meta-music-label, .meta-location-label, .meta-mood-label, .meta-groups-label { display:none !important; } .ljtags { background:url("http://i48.tinypic.com/28nqs7.gif") no-repeat scroll 0 2px transparent; line-height:13px; margin-left:17px; margin-top:16px; padding-left:12px; text-transform:lowercase; } .ljtags a { color:#111111; } .entrymenu { background:none repeat scroll 0 0 #111111; font-size:14px; margin:0 0 0 4px; padding:15px 4px; } dd.entrymenu ul { margin:0; padding:0; } dd.entrymenu ul li a { color:#FFFFFF; margin-left:8px; text-transform:lowercase; } dd.entrymenu li { display:inline; } dd.entrymenu li.comments { background:url("http://irondevil.org/icon/categories/icondock%20-%20marker%20icons%20WHITE/comment.png") no-repeat scroll 0 0 transparent; display:block; float:right; height:32px; line-height:19px; margin-top:-7px; padding:3px 6px 5px 0; text-align:center; width:32px; } dd.entrymenu li.comments a { color:#FFFFFF; font-size:12px; font-weight:bold; letter-spacing:-1px; margin:0; padding:5px; } dd.entrymenu li.comments a:hover { color:#AAAAAA; text-decoration:none; } dd.entrymenu li.postcomment { background:url("http://irondevil.org/icon/categories/icondock%20-%20marker%20icons%20WHITE/pencil.png") no-repeat scroll 0 0 transparent; display:block; float:right; height:32px; margin-right:5px; margin-top:-7px; width:32px; } dd.entrymenu li.postcomment a { color:#000000; display:block; font-size:0; margin-left:0; padding:16px 5px; } ul.nav { display:inline; margin:0; padding:0; text-align:center; } .header { background:none repeat scroll 0 0 #111111; margin-bottom:4px; padding:100px 0 28px; } .header-in { text-align:center; } .header-sec { display:inline; } .header li { margin:0; padding:0; } .header ul.nav li.item { display:inline; list-style:none outside none; margin:0 5px; padding:0; } .header li.item a { color:#FFFFFF; font-size:24px; letter-spacing:-2px; text-transform:lowercase; } .header li.item-selected a { color:#AAAAAA; } .header li.item-selected a:hover { text-decoration:none; } ul.nav-sub { display:inline; margin:0; padding:0; } ul.nav-sub li { display:inline; margin:0 9px 0 0; } .userpic { display:none; } .header h2, .header h3, .header h1 { display:none; } .sidebar { display:none; } .ljuser a b { background:none repeat scroll 0 0 transparent; text-decoration:none !important; } .ljuser a:hover b { background:none repeat scroll 0 0 transparent; border-bottom:0 none; text-decoration:none !important; } img[src="userinfo.gif"], img[src="userinfo-support.gif"], img[src="user_ontd.gif"], img[src="openid-profile.gif"], img[src="anonymous.gif"] { background:url("http://irondevil.org/icon/categories/damniconsmini/user.gif") no-repeat scroll 0 0 transparent; height:0; padding:15px 8px 0 0 !important; width:0; } #lj_controlstrip img[src="userinfo.gif"], #lj_controlstrip img[src="user_ontd.gif"] { background:url("http://irondevil.org/icon/categories/damniconsmini/user.gif") no-repeat scroll 0 0 transparent; } img[src="community.gif"], img[src="partnercomm.gif"] { background-image:url("http://irondevil.org/icon/categories/damniconsmini/house.gif"); background-repeat:no-repeat !important; height:0; padding:15px 12px 0 0 !important; width:0; } img[src="newsinfo.gif"], img[src="syndicated.gif"] { background-image:url("http://irondevil.org/icon/categories/damniconsmini/note2.gif") !important; background-repeat:no-repeat !important; height:0; padding:14px 10px 0 0 !important; width:0; } img[src="icon_protected.gif"], img[src="icon_groups.gif"], img[src="icon_private.gif"] { background-image:url("http://irondevil.org/icon/categories/icondock%20-%20marker%20icons/link.png") !important; background-position:0 0; background-repeat:no-repeat; height:0; padding:1px 31px 28px 0 !important; width:0; } ul.page-nav { background:none repeat scroll 0 0 #111111; font-size:14px; list-style:none outside none; margin:0; min-height:10px; padding:17px; text-align:center; } ul.page-nav li { display:inline; margin:0 8px; padding:0; } ul.page-nav li a { color:#111111; font-size:0; } li.prev a { background:url("http://irondevil.org/icon/categories/icondock%20-%20marker%20icons%20WHITE/arrow-left.png") no-repeat scroll 0 50% transparent; padding:17px 0 17px 33px; } li.next a { background:url("http://irondevil.org/icon/categories/icondock%20-%20marker%20icons%20WHITE/arrow-right.png") no-repeat scroll 100% 50% transparent; padding:17px 0 17px 33px; } ul.page-nav a { color:#FFFFFF; text-transform:lowercase; } dl#post-sticky.entry { padding-bottom:14px; } dl#post-sticky.entry .entry-title { padding:16px 17px 10px; } .view-month .entry-text { font-size:14px; } .view-archive .entry-wrap li { display:inline; font-size:14px; margin-right:3px; } .calendar-wrap table { margin:16px auto; width:400px; } .calendar-wrap td { background:none repeat scroll 0 0 #DDDDDD; padding-bottom:24px; padding-left:6px; } a.month { font-size:24px; letter-spacing:-2px; } a.year { font-size:24px; letter-spacing:-2px; } .entry-linkbar { float:right; padding:10px 12px !important; } img[src="btn_prev.gif"] { background-image:url("http://i48.tinypic.com/b4g35w.jpg") !important; background-repeat:no-repeat !important; height:0; padding:15px 15px 0 0 !important; width:0; } img[src="btn_edit.gif"] { background-image:url("http://i45.tinypic.com/qrmbtl.jpg") !important; background-repeat:no-repeat !important; height:0; padding:15px 17px 0 0 !important; width:0; } img[src="btn_edittags.gif"] { background-image:url("http://i48.tinypic.com/2wewg8i.jpg") !important; background-repeat:no-repeat !important; height:0; padding:15px 16px 0 0 !important; width:0; } img[src="btn_memories.gif"] { background-image:url("http://i47.tinypic.com/35je874.jpg") !important; background-repeat:no-repeat !important; height:0; padding:14px 15px 0 0 !important; width:0; } img[src="btn_track.gif"] { background-image:url("http://i49.tinypic.com/286wup0.jpg") !important; background-repeat:no-repeat !important; height:0; padding:15px 15px 0 0 !important; width:0; } img[src="btn_next.gif"] { background-image:url("http://i48.tinypic.com/14t0i6e.jpg") !important; background-repeat:no-repeat !important; height:0; padding:15px 15px 0 0 !important; width:0; } img[src="http://p-stat.livejournal.com/img/button-flag.gif"] { background-image:url("http://i49.tinypic.com/2gt2ip5.jpg") !important; background-repeat:no-repeat !important; height:0; padding:15px 15px 0 0 !important; width:0; } img[src="btn_del.gif"] { background-image:url("http://i50.tinypic.com/sw32v7.jpg") !important; background-repeat:no-repeat !important; height:0; padding:15px 15px 0 0 !important; width:0; } img[src="btn_scr.gif"], img[src="btn_unscr.gif"] { background-image:url("http://i50.tinypic.com/zjcbhc.jpg") !important; background-repeat:no-repeat !important; height:0; padding:15px 15px 0 0 !important; width:0; } img[src="btn_freeze.gif"] { background-image:url("http://i49.tinypic.com/2gt2ip5.jpg") !important; background-repeat:no-repeat !important; height:0; padding:15px 16px 0 0 !important; width:0; } textarea, input, select { background:none repeat scroll 0 0 white; border:1px solid #E9E9E9; color:#333333; font-size:12px; max-width:450px; } .comments-links { background:none repeat scroll 0 0 #111111; color:#FFFFFF; font-size:14px; padding:12px; text-align:center; } .entry-comments-text { } .comment-wrap { margin-bottom:11px; margin-top:24px; } .comment-upic img { border:14px solid #111111; float:left; height:75px; width:75px; } .comment-text { margin:14px 11px 0 114px; min-height:72px; } a.comment-permalink { margin:0 4px; } .comment-menu { background:none repeat scroll 0 0 #111111; color:#000000; padding:7px; text-align:right; } .comment-menu a, .comments-links a { color:#FFFFFF; } .comment-head-in { font-size:10px; padding-left:114px; } .comment-head-in p { display:inline; } .comment-head-in .ljuser { font-size:18px; } .comment-head-in img[src="userinfo.gif"] { background-image:none !important; height:0; padding:0 !important; width:0; } .comment-head-in h3 { color:#AAAAAA; font-size:24px; font-weight:normal; letter-spacing:-2px; margin-bottom:0; } #qrform table { border:medium none !important; } .content-tags { padding:10px; } div.ContextualPopup img { border:0 none; } div.ContextualPopup div.Inner { background:none repeat scroll 0 0 transparent !important; border:0 none; color:#222222 !important; font-family:Helvetica,Arial,Sans-Serif; font-size:11px; padding:3px; width:23em; } div.ContextualPopup .Content { background:none repeat scroll 0 0 white; line-height:1.4; margin-right:81px; padding:7px 9px; } div.ContextualPopup .Relation { font-weight:bold !important; } div.ContextualPopup .Content .OnlineStatus { font-weight:bold; } div.ContextualPopup .Userpic { padding:0; } div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { color:#000000 !important; font-weight:normal; text-decoration:none !important; } #lj_controlstrip { background:none repeat scroll 0 0 #111111; color:#FFFFFF; } #lj_controlstrip td { border-bottom:medium none; color:#FFFFFF; } #lj_controlstrip a { color:#FFFFFF; } #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic { border-right:0 none; } #lj_controlstrip_login td { border-bottom:0 none; } #lj_controlstrip td td { border-bottom:0 none; } #lj_controlstrip_userpic { background-image:url("http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000"); } #lj_controlstrip_loggedout_userpic { background-image:url("http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000"); } #lj_controlstrip input { background:none repeat scroll 0 0 #333333 !important; border:medium none; color:#FFFFFF !important; } #lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember { background:none repeat scroll 0 0 #333333 !important; border:medium none; color:#FFFFFF !important; } #lj_controlstrip .ljuser a b { background:none repeat scroll 0 0 transparent; color:#FFFFFF; letter-spacing:0; text-decoration:none !important; } a[st_page="home"] { display:none; } dl[id^="post"] { border-left-style:solid; border-left-width:78px; margin:0 0 4px; } / Codes for the colors to the left of the entries */ dl[id$="4"], dl[id$="9"] { border-color:#FAD089; } dl[id$="2"], dl[id$="8"] { border-color:#FF9C5B; } dl[id$="3"], dl[id$="6"] { border-left-color:#F5634A; } dl[id$="7"], dl[id$="1"] { border-color:#ED303C; } dl[id$="5"], dl[id$="0"] { border-color:#FAE589; }

how to install
select journal style	Type Deep Ocean into the search box and apply the theme.
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.
optional
upload images	The following icons were uploaded to Tinypic, which I've known to be pretty good with not deleting stuff, but you might want to up them to your own account to ensure that they stick around. http://i48.tinypic.com/28nqs7.gif http://i48.tinypic.com/b4g35w.jpg http://i45.tinypic.com/qrmbtl.jpg http://i48.tinypic.com/2wewg8i.jpg http://i47.tinypic.com/35je874.jpg http://i49.tinypic.com/286wup0.jpg http://i48.tinypic.com/14t0i6e.jpg http://i50.tinypic.com/sw32v7.jpg http://i50.tinypic.com/zjcbhc.jpg http://i49.tinypic.com/2gt2ip5.jpg
change the colors	At the end of the stylesheet, you can find this block of code: `dl[id$="4"], dl[id$="9"] { border-color:#FAD089; } dl[id$="2"], dl[id$="8"] { border-color:#FF9C5B; } dl[id$="3"], dl[id$="6"] { border-left-color:#F5634A; } dl[id$="7"], dl[id$="1"] { border-color:#ED303C; } dl[id$="5"], dl[id$="0"] { border-color:#FAE589; }` Simply change the hex values to your own colors.

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Icons by Icon Dock and damnicons. • Userpic by kush. • Based on the Maddening Caravan palette.

read the layout faq before asking questions!
commission a custom layout!

smooth sailing: moderne

daemon — Fri, 18 Jun 2010 19:27:55 GMT

UPDATE JULY 6, 2010: Added a new minimalist icon set that better matches the layout. If you want to install it in your layout, simply scroll down to the "Optional" section of the instructions.

I was really touched by all the welcome back messages on the last layout, seriously. ;; Thank you so much for all of your support. As a way of showing that I whipped up another layout! Apologies if you aren't a big fan of this minimalist stuff (or if you don't have a 1200px+ wide monitor, for that matter), but hey -- this one has a banner option. 8)b Enjoy!

layout notes
account types	Basic, Paid
compatible browsers	Internet Explorer 8, Mozilla Firefox, Opera, Safari, Google Chrome
minimum resolution	1200px+/widescreen recommended
comment pages	Yes
navstrip	Optional
disabled	• Sidebar titles
css stylesheet
pick your layout:	• Moderne - Banner • Moderne - No Banner

how to install
select journal style	1. Apply any Smooth Sailing theme. 2. Scroll down to Choose a Page Setup and select 2 Column (sidebar on left).
display	Make sure Userinfo Position in Entries and Userinfo Position in Comments (if using custom comment pages) is set to Left Side of Entry Text.
entry text	Paste the code into its respective boxes: Format for Date and Time (Recent/Friends/Entry/Reply page) and Format for Date and Time (Day page only) %%mm%% %%dd%% %%yy%%
sidebar	IF YOU ARE USING THE BANNER VERSION: Scroll down to Free Text #2 Position and set the drop down box to any unoccupied position; it doesn't matter which. See "Add your banner image" below for further instructions. IF YOU ARE USING THE NO-BANNER VERSION: Nothing more needs to be done, just rearrange your sidebar widgets as you please. :)
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.
optional
add your banner image	Find `http://i50.tinypic.com/jkj9lt.jpg` in the CSS and replace it with the URL of your own 680x140 image.
minimalist icons	NEW: I recently acquired a new set of icons that better matches this layout's minimalist look. If you'd like to replace them, simply paste the following code at the end of your stylesheet. img[src="userinfo.gif"], img[src="user_ontd.gif"], img[src="userinfo-support.gif"], img[src="openid-profile.gif"], img[src="anonymous.gif"] { background-image:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2014px/Contact1414.PNG"); background-repeat:no-repeat !important; height:0; padding:17px 14px 0 0 !important; width:0; } img[src="community.gif"], img[src="partnercomm.gif"] { background-image:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2014px/Home1414.PNG") !important; background-repeat:no-repeat !important; height:0; padding:16px 14px 0 0 !important; width:0; } img[src="newsinfo.gif"] { background-image:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2014px/Task%20Manager1414.PNG"); background-repeat:no-repeat !important; height:0; padding:16px 15px 0 0 !important; width:0; } img[src="syndicated.gif"] { background-image:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2014px/RSS1414.PNG"); background-repeat:no-repeat !important; height:0; padding:16px 15px 0 0 !important; width:0; } img[src="icon_protected.gif"] { background-image:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2020px/Lock.png") !important; background-repeat:no-repeat !important; height:0; padding:18px 21px 0 0 !important; width:0; } img[src="icon_groups.gif"] { background-image:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2020px/MSN.png") !important; background-repeat:no-repeat; height:0; padding:16px 21px 0 0 !important; width:0; } img[src="icon_private.gif"] { background-image:url("http://irondevil.org/icon/categories/brsev%20Token%20Dark%2020px/Xion.png") !important; background-repeat:no-repeat; height:0; padding:16px 21px 0 0 !important; width:0; } You can also go in and manually replace the old user icon code yourself.

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Default circular icons by Pro Theme Design • Minimalist icons by brsev.

read the layout faq before asking questions!
commission a custom layout!

tutorial: remove the "share this" link

daemon — Thu, 17 Jun 2010 13:52:06 GMT

If you don't like the Share This link, or if it's just messing up your layout (ie: Spin the Record), here's how to remove it with one little code snippet:

a[st_page*="home"] {display:none;}

Voila!

Bear in mind that this will create extra padded space where the removed link used to be, unless you went in and altered the padding attribute yourself. See the second part of my linkbar tutorial for more information.

Layouts This Works With: Smooth Sailing, Bloggish, Flexible Squares, Opal

Note: I've only tested this on Smooth Sailing layouts, as I'm not sure if this link even shows up on other styles. From what I've seen it doesn't, but let me know if you see otherwise. (thanks, saifai!)

smooth sailing: palaven

daemon — Fri, 11 Jun 2010 01:05:03 GMT

I actually made another layout! It's been more than a year, geez. Long story short, I was hit by some pretty hefty IRL problems and it killed off my creativity, big time. I hope this means the end of that era and a return to regular layout updates!

This layout was actually created a few months ago for my personal journal, and now I've finally taken the time to refine the code for public consumption. :) I'm super rusty so yeah, do let me know if any bugs pop up. It is designed for a widescreen monitor, so I wouldn't recommend using it if you're still using a monitor from 1997. :P

~~Garrrruuuuusssss ♥~~

EDIT: Found the first bug! If the userpic is waaaaaaay off to the right, check under the newly-added "Display" heading in the instructions below.

EDIT 2: Added a fix for the same problem in the comment pages.

EDIT 3: Made the comment username font match up with the one used on the friend page usernames. Yeah you can tell I coded the comment pages in a hurry.

layout notes
account types	Basic, Plus, Paid (Ads on vertical*.)
compatible browsers	Internet Explorer 8, Mozilla Firefox, Opera, Safari, Google Chrome
minimum resolution	1200px+ wide recommended
comment pages	Yes
navstrip	Optional
disabled	All sidebar stuff but the Links List and Free Text.
css stylesheet
stylesheet	/--------------------------------------------------- STYLESHEET CREATOR: scythe.livejournal.com STYLESHEET NAME: Palaven S2 STYLE: Smooth Sailing DOWNLOAD: thrashmetal.livejournal.com *Please remember to credit!** -----------------------------------------------------/ body { color:#333333; font-family:Courier New; font-size:12px; line-height:1.3em; margin:0; } textarea, input, select { background:none repeat scroll 0 0 #FFFFFF; border:1px solid #CCCCCC; color:#333333; font-size:11px; padding:2px 3px; } a, a:visited { color:#17CBDC; text-decoration:none; } a:hover { color:#555555; } a img { border:medium none; } li { -moz-background-inline-policy:continuous; background:url("http://lj.irondevil.org/components/grayli.png") no-repeat scroll 0 7px transparent; color:#555555; list-style-type:none; margin:4px 0; padding:0 0 0 13px; } blockquote { -moz-background-inline-policy:continuous; background:none repeat scroll 0 0 #EEEEEE; padding:15px; } .header-title { color:#000000; font-size:53px; letter-spacing:-4px; margin-left:51px; text-transform:uppercase; } .header-title:first-letter { color:#17CBDC; } .header-subtitle { display:none; } .pagefooterblock { display:none; } .bodyblock { margin:0 auto; padding-left:35px; padding-top:26px; } .bodynavblock { font-size:11px; margin-bottom:10px; padding:0; text-transform:uppercase; width:491px; } .body-title { display:none; } .body-midtitle { display:none; } .entryHolder { color:#333333; margin-bottom:40px; margin-left:22px; margin-top:10px; width:491px; } .entryUserinfo { margin-left:510px; margin-top:-51px; position:absolute; } .entryUserinfo-username { margin-top:6px; text-align:center; } .entryUserinfo-username .ljuser a b, .commentUserinfo-username .ljuser a b { color:#000000; font-size:11px; font-weight:normal; text-transform:uppercase; font-family:"Courier New"; } .entryUserinfo-usericon img, .commentUserinfo-usericon img { border:1px solid #DDDDDD; padding:7px; } .entryText { font-family:Helvetica,Arial,Sans-serif; font-size:11px; min-height:50px; text-align:justify; } .entryText img { max-width:300px; } .entryHeader { border-bottom:0 none; border-top:5px solid #000000; color:#666666; font-size:0; padding:11px 0 6px; } .entryHeader a { color:#000000; font-size:17px; } .entryHeaderSubject { color:#FFFFFF; display:block; } .entryHeaderDate { color:#000000; float:right; font-size:10px; margin:-30px 0 0 425px; position:absolute; text-align:right; text-transform:uppercase; width:66px; } .entryLinkbar { -moz-background-inline-policy:continuous; background:none repeat scroll 0 0 #EEEEEE; color:#000000; margin-top:12px; padding:4px 11px; text-align:right; text-transform:lowercase; } .entryLinkbar a { color:#555555; font-size:11px; margin-left:12px; text-transform:uppercase; } .entryLinkbar ul { margin-bottom:0 !important; margin-left:0 !important; margin-top:0 !important; padding:0; } .entryLinkbar li { -moz-background-inline-policy:continuous; background:none repeat scroll 0 0 transparent; display:inline; margin:0; padding:0; } .entryMetadata ul { font-size:11px; margin:15px 0 0; padding:0; text-transform:uppercase; } .entryMetadata li { background:none repeat scroll 0 0 transparent; margin:0; padding:0; } .entryMetadata-label { color:#000000; margin-right:3px; text-transform:uppercase; } .entryMetadata a { color:#555555; } .entryMetadata a:hover { color:#000000; } .yearlinks { text-align:right; } .yearlink { padding-left:4px; padding-right:4px; } .month { -moz-background-inline-policy:continuous; background:none repeat scroll 0 0 transparent; margin:13px auto; padding:0 0 12px; width:420px; } .daysubjects { padding:0 8px 10px 40px; } .daytitles { border:1px solid #FFFFFF; color:#000000; text-align:center; text-transform:uppercase; } .day { -moz-background-inline-policy:continuous; background:none repeat scroll 0 0 #EEEEEE; border:1px solid #FFFFFF; margin-bottom:0; padding:3px; } .day-date { font-family:Helvetica,Arial,Sans-serif; font-size:10px; text-align:center; width:50%; } .day-count { float:right; font-size:20px; text-align:center; width:50%; } .day-count a { color:#000000; font-family:Helvetica,Arial,Sans-serif; font-size:19px; font-weight:normal; padding:3px; } .sidebar { margin-left:20px; width:309px; } .sidebox { float:left; font-family:Helvetica,Arial,Sans-serif; font-size:11px; margin-right:12px; margin-top:0; text-align:justify; } .sideboxTitle { display:none; } .sidebox #freetext { width:160px; } .sidebox #systemlinks { width:100px; } .sidebox #systemlinks a:link, .sidebox #systemlinks a:active, .sidebox #systemlinks a:visited { color:#000000; font-family:"Courier New"; text-transform:uppercase; } .sidebox #systemlinks a:hover { color:#555555 !important; } .sidebox #profile, .sidebox #summary, .sidebox #latestmonth, .sidebox #search, .sidebox #tags_sidebox { display:none; } .listtitle { display:none; } .pageblock { } .pageheaderblock { margin:65px auto 0; } .header-menu { -moz-background-inline-policy:continuous; background:none repeat scroll 0 0 #000000; margin-top:20px; padding-bottom:10px; padding-left:77px; padding-top:9px; } .header-menu a { color:#FFFFFF; font-size:12px; text-transform:lowercase; } .header-menu a:hover { color:#17CBDC; } #footer-menu { border-top:5px solid #000000; font-size:11px; margin-bottom:10px; margin-left:22px; text-align:right; width:491px; } #footer-menu a, .footer-menu a:visited { color:#000000; margin-left:19px; text-transform:uppercase; } #footer-menu ul { margin:0; padding:5px 0 0; } #footer-menu li { -moz-background-inline-policy:continuous; background:none repeat scroll 0 0 transparent; display:inline; margin:0; padding:0; } .header-menu ul { margin:0 auto; padding:0; } .header-menu li { -moz-background-inline-policy:continuous; background:none repeat scroll 0 0 transparent; display:inline; list-style:none outside none; margin-right:11px; } .taglist { padding-bottom:10px; } .ljuser a b { -moz-background-inline-policy:continuous; background:none repeat scroll 0 0 transparent; color:#000000; } img[src="userinfo.gif"], img[src="userinfo-support.gif"], img[src="user_ontd.gif"] { background-image:url("http://irondevil.org/icon/categories/tutorial9/user.png") !important; background-repeat:no-repeat !important; height:0; padding:13px 12px 0 0 !important; width:0; } img[src="community.gif"], img[src="partnercomm.gif"] { background-image:url("http://irondevil.org/icon/categories/tutorial9/community.png") !important; background-repeat:no-repeat !important; height:0; padding:12px 11px 0 0 !important; width:0; } img[src="newsinfo.gif"] { background-image:url("http://irondevil.org/icon/categories/tutorial9/community.png") !important; background-repeat:no-repeat !important; height:0; padding:12px 12px 0 0 !important; width:0; } img[src="syndicated.gif"] { background-image:url("http://irondevil.org/icon/categories/tutorial9/rss.png"); background-repeat:no-repeat !important; height:0; padding:13px 13px 0 0 !important; width:0; } img[src="icon_protected.gif"] { background-image:url("http://irondevil.org/icon/categories/tutorial9/locked.png") !important; background-repeat:no-repeat !important; height:0; padding:11px 14px 0 0 !important; width:0; } img[src="icon_groups.gif"] { background-image:url("http://irondevil.org/icon/categories/tutorial9/groups.png") !important; background-repeat:no-repeat; height:0; padding:11px 14px 0 0 !important; width:0; } img[src="icon_private.gif"] { background-image:url("http://irondevil.org/icon/categories/tutorial9/private.png") !important; background-repeat:no-repeat; height:0; padding:11px 14px 0 0 !important; width:0; } div.ContextualPopup img { border:0 none; } div.ContextualPopup div.Inner { border:medium none; color:#000000 !important; font-family:Helvetica; font-size:11px; padding:7px; width:20em; } div.ContextualPopup .Content { line-height:1.4; margin-right:50px; padding:2px 4px 6px; } div.ContextualPopup .Relation { font-weight:bold !important; } div.ContextualPopup .Content .OnlineStatus { font-weight:bold; } div.ContextualPopup .Userpic { padding:8px 8px 0 0; } div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited { color:#000000 !important; font-weight:normal; text-decoration:none !important; } .entryLinkbar a[href="subscriptions"], .entryLinkbar a[href="tellafriend"], .entryLinkbar a[st_page="home"] { display:none; } #lj_controlstrip { -moz-background-inline-policy:continuous !important; background:none repeat scroll 0 0 transparent !important; } #lj_controlstrip_statustext { color:#333333; } #lj_controlstrip a { color:#333333; } #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic { border-right:0 none; } #lj_controlstrip_userpic { background-image:url("http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000"); } #lj_controlstrip_loggedout_userpic { background-image:url("http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000"); } #lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember, #lj_controlstrip input { -moz-background-inline-policy:continuous !important; background:none repeat scroll 0 0 transparent !important; border:0 none; color:#17CBDC !important; } #lj_controlstrip_search { visibility:hidden; } .commentHeader, .commentHeaderScreened { border-bottom:5px solid #000000; color:#000000; font-family:"Courier New"; font-size:10px; margin-bottom:11px; text-transform:uppercase; } .commentHolder { font-family:Helvetica,Arial,Sans-serif; font-size:11px; margin:22px; min-height:149px; text-align:justify; width:491px; } .commentText { margin-left:12px; } .commentUserinfo { color:#FFFFFF; margin-left:-129px; margin-top:-27px; position:absolute; text-align:center; } .commentUserinfo-username { margin-top:3px; } .commentLinkbar { margin-top:12px; padding:4px 11px; } .commentLinkbar ul { margin:0; padding:0; text-align:right; } .commentLinkbar li { background:none repeat scroll 0 0 transparent; display:inline; } .commentLinkbar a { color:#555555; font-family:"Courier New"; font-size:10px; text-transform:uppercase; } form#qrform table { border:0 none !important; margin-top:10px; }

how to install
select journal style	1. Apply any Smooth Sailing theme. 2. Scroll down to Choose a Page Setup and select 2 Column (sidebar on left).
display	Make sure Userinfo Position in Entries and Userinfo Position in Comments (if using custom comment pages) is set to Left Side of Entry Text.
entry text	Paste the code into its respective boxes: Format for Date and Time (Recent/Friends/Entry/Reply page) and Format for Date and Time (Day page only) %%dd%% %%mon%% %%yyyy%%
sidebar	Set these drop down boxes to the following: Links Visibility - 1 Free Text Position - 2 Hide all other Position boxes.
links list	Define your links. Define your links. These are the links that show up in the left sidebar.
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Mini icons by Tutorial9. • Garrus icon by kikoshou!

read the layout faq before asking questions!

Tutorial: Remove the Userpic "Float" Effect in Expressive

daemon — Sun, 26 Apr 2009 12:55:36 GMT

A tutorial for achieving the effect I have used in my journal. This should work in all browsers. However, please note that I have only tested this hack with Life's a Spectrum -- if it doesn't work with other Expressive/Mixit layouts, it's up to you to adjust it as needed. I'm in the middle of end-of-semester project mire and don't really have the time or energy to offer CSS help.

1. Find .asset-body. Replace the code between the brackets with the following:

color:#4F4F4F; line-height:1.7; margin-bottom:18px; padding-left:154px; padding-right:25px;;

color:#4F4F4F; line-height:1.7; margin-bottom:18px; padding-right:25px;

2. Find .asset-body .user-icon. Replace the code between the brackets with the following (this also removes the extraneous height:100%; I accidentally left in):

display:inline; float:none; margin-left:-149px; padding-right:7px; position:absolute; text-align:center; width:133px !important;

display:inline; float:none; margin-left:-149px; padding-right:7px; position:absolute; text-align:center; width:133px !important;

3. Add the following to .asset-content:

padding-left:154px;

expressive: life's a spectrum

daemon — Sun, 19 Apr 2009 14:50:22 GMT

A layout I made for my personal journal, but I'm sharing because I'm nice. It was loosely based on the Adobe site and I've created a few custom color schemes based on the software palette.

layout notes
account types	Basic, Paid
compatible browsers	Internet Explorer 7, Mozilla Firefox, Opera, Safari, Google Chrome Date is not properly oriented in Safari or Chrome, but is otherwise negligible.
minimum resolution	1024x768
comment pages	Yes
navstrip	Optional
disabled	• All of the sidebar except the links list
css stylesheet
stylesheet	/--------------------------------------------------- STYLESHEET CREATOR: scythe.livejournal.com STYLESHEET NAME: S2 STYLE: DOWNLOAD: thrashmetal.livejournal.com *Please remember to credit!** ----------------------------------------------------- CUSTOM COLORS (PHOTOSHOP SCHEME): #0063BE #22217F / { border:medium none !important; } body { background:#222222 none repeat scroll 0 0; color:#000000; font-family:helvetica,arial,sans-serif; font-size:13px; margin:0; padding:35px 0 0 !important; } a { color:#0063BE; text-decoration:none; } a:hover { color:#22217F; } a img { border:medium none; } li { margin:0; padding:0; } ul { list-style-image:none; list-style-position:outside; list-style-type:square; margin:0; } blockquote { border-bottom:5px solid #F2F2F2 !important; font-family:Cambria,Georgia,Times New Roman; font-size:14px; padding:10px; } hr { display:none; } select, textarea, input { border:1px solid #F2F2F2 !important; color:#111111; font-family:Cambria,Georgia,Courier New,Monospace; font-size:14px; padding:3px; } ul.year { list-style-image:none; list-style-position:outside; list-style-type:none; margin:0; padding:19px 19px 10px; } ul.year li { color:#555555; display:inline; font-family:"Helvetica-Light","Arial Narrow",Helvetica; font-size:18px; } .yearday { text-transform:lowercase; } .yeardate { height:42px; } .yearmonth { color:#0063BE; font-family:"Helvetica-Light","Arial Narrow",Helvetica; font-size:31px; letter-spacing:-3px; text-transform:lowercase; } .yearmonth a { color:#111111; font-size:17px; letter-spacing:-1px; } .hidden { display:none; } .item { list-style-image:none; list-style-position:outside; list-style-type:none; margin:0; padding:0; } .widget-list a { color:#FFFFFF; font-family:arial; font-size:12px; font-weight:bold; padding:6px; } .user-icon { float:left; margin:10px; } .user-icon img { background:#101010 none repeat scroll 0 0; border-left:7px solid #0063BE !important; padding-left:18px; } .page-header2 { margin:0; } #container { position:absolute; width:100%; } #page { width:100%; } #header { padding:0; position:absolute; top:54px; width:100%; } #header-inner { margin:0 auto; width:835px; } ul.nav { background:#000000 none repeat scroll 0 0; margin:0 auto; padding:10px; position:absolute; top:72px; z-index:300; } .nav li { display:inline; float:left; margin-left:12px; margin-right:-13px; padding:0; } .nav li a { color:#CCCCCC; font-size:15px; margin-right:23px; text-transform:uppercase; } .nav li.first { border-left:medium none; padding-left:0; } .nav li.current a { text-decoration:none; } .nav li a[title="Recent"] { background:transparent url(http://irondevil.org/icon/categories/dryicons%20stickers/home.png) no-repeat scroll 0 0; display:block; font-size:0; height:16px; text-indent:-9999px; width:16px; } .nav li a[title="Friends"] { background:transparent url(http://irondevil.org/icon/categories/dryicons%20stickers/comment_bubble.png) no-repeat scroll 0 0; display:block; font-size:0; height:16px; text-indent:-9999px; width:16px; } .nav li a[title="Archive"] { background:transparent url(http://irondevil.org/icon/categories/dryicons%20stickers/calendar.png) no-repeat scroll 0 0; display:block; font-size:0; height:16px; text-indent:-9999px; width:16px; } .nav li a[title="User"] { background:transparent url(http://irondevil.org/icon/categories/dryicons%20stickers/user.png) no-repeat scroll 0 0; display:block; font-size:0; height:16px; text-indent:-9999px; width:16px; } .nav li a[title="Memories"] { background:transparent url(http://irondevil.org/icon/categories/dryicons%20stickers/favorite.png) no-repeat scroll 0 0; display:block; font-size:0; height:16px; text-indent:-9999px; width:16px; } #header-name { } #header-name a { background:#0063BE none repeat scroll 0 0; border-right:72px solid #22217F !important; color:#FFFFFF; display:block; font-family:"Helvetica-Light","Arial Narrow",Helvetica; font-size:35px; height:42px; letter-spacing:-2px; padding:17px 20px 49px; text-transform:lowercase; } #header-description { display:none; } #header-content-decor { } #header-decor { } #content { padding:0; } #content-inner { } #alpha { position:absolute; top:162px; width:100%; } #alpha-inner { background:#FFFFFF none repeat scroll 0 0; color:#4F4F4F; margin:0 auto; text-align:justify; width:835px; } .stream-header { display:none; } .stream-footer { background:#101010 none repeat scroll 0 0; color:#101010; font-size:0; margin-bottom:13px; padding-bottom:17px; padding-left:18px; padding-top:17px; text-align:left; } .stream-footer a { color:#FFFFFF; font-size:12px; text-transform:lowercase; } .prevnext { background:#101010 none repeat scroll 0 0; color:#101010; margin:0; padding-right:20px; text-align:right; } .prevnext a[href="dir=prev"] { background:transparent url(http://irondevil.org/icon/categories/dryicons%20stickers/left_arrow.png) no-repeat scroll 0 0; color:#FFFFFF; font-size:12px; height:16px; margin-right:2px; padding-left:21px; text-transform:lowercase; } .prevnext a[href="dir=next"] { background:transparent url(http://irondevil.org/icon/categories/dryicons%20stickers/right_arrow.png) no-repeat scroll 0 0; color:#FFFFFF; font-size:12px; height:16px; margin-right:2px; padding-left:21px; text-transform:lowercase; } .prevnext .prev, .prevnext .next, .prevnext a[href="home"] { height:16px; margin-right:15px; padding-left:22px; } .prevnext .prev { background:transparent url(http://irondevil.org/icon/categories/dryicons%20stickers/left_arrow.png) no-repeat scroll 0 0; } .prevnext .next { background:transparent url(http://irondevil.org/icon/categories/dryicons%20stickers/right_arrow.png) no-repeat scroll 0 0; } .prevnext a[href="home"] { background:transparent url(http://irondevil.org/icon/categories/dryicons%20stickers/up_arrow.png) no-repeat scroll 0 0; padding-bottom:1px; padding-left:20px; } .asset-name-hover { display:none; } .post-asset { margin-bottom:7px; } .asset-inner { } .asset-header { } a.subj-link, .asset-name a { color:#EEEEEE; font-family:"Helvetica-Light","Arial Narrow",Helvetica; font-size:19px; font-weight:normal; } .asset-header-content-inner { background:#101010 none repeat scroll 0 0; } .asset-name { background:#101010 none repeat scroll 0 0; padding:12px 22px 17px; text-indent:0 !important; width:635px; } .asset-name page-header2 { color:#E42F17; font-family:arial; font-size:39px; font-weight:normal; letter-spacing:-4px; text-decoration:none; text-transform:lowercase; } .asset-meta { margin:10px 0 0; padding:0 10px; } .asset-meta-list a { color:#101010; font-family:arial; font-size:9px; text-transform:uppercase; } .asset-meta-list .datetime { color:#AAAAAA; font-family:arial; font-size:10px; margin-left:-152px; margin-top:-42px; position:absolute; text-align:left; text-transform:uppercase; } .asset-content { margin-left:10px; min-height:164px; } .asset-body { color:#4F4F4F; line-height:1.7; margin-bottom:18px; padding-left:16px; padding-right:25px; padding-top:16px; } .asset-body .user-icon { height:100%; padding-right:7px; text-align:center; width:133px !important; } .lj-currents ul li { line-height:1.3; list-style-image:none; list-style-position:outside; list-style-type:none; } .ljuser a b { color:#222222; } .ljuser img { background:transparent none repeat scroll 0 0; border:medium none !important; } .entryMetadata-label { font-weight:bold; } .entryMetadata-content { margin-left:4px; } .asset-tags { font-size:13px; line-height:1.3; margin-left:40px; } .asset-tags-header { float:left; margin:0; } .asset-tags-list { line-height:18px; } ul.asset-tags-list li { display:inline; margin-right:1px; } ul.asset-tags-list li a { font-weight:normal; } .asset-meta-comments { text-transform:uppercase; } .asset-meta-no-comments { } ul.asset-meta-list { margin:0; padding:0; text-align:right; } .asset-meta-list li.asset-meta-comments { display:inline; margin:0 3px; text-align:left; text-transform:lowercase; } .asset-footer { } .quickreply { margin:1em; padding-bottom:10px; padding-top:5px; width:90%; } #comments { } .comment { margin:20px 0; } .comment-odd { } .comment-even { } .comments-inner { } .comments-header { background:#101010 none repeat scroll 0 0; color:#EEEEEE; font-family:"Helvetica-Light","Arial Narrow",Helvetica; font-size:19px; font-weight:normal; padding:16px; text-transform:lowercase; } .comments-body { } .comments-nav { text-align:center; } .comment-inner { margin-bottom:28px; margin-top:5px; } .comment-meta { } .commenter-name { } .comment-date { } .comment-date .datetime { font-size:x-small; } .comment-subject { font-weight:bold; } .comment-body { line-height:1.7; padding:12px 10px; } .comment-links { border-bottom:1px solid #EFEFEF; font-family:arial; font-size:9px; padding:10px 10px 0; text-align:right; text-transform:uppercase; } .permalink { } #beta { position:absolute; text-align:right; top:16px; width:100%; z-index:0; } #beta-inner { margin:0 auto; width:824px; } .about-me-widget { display:none; } .categories-widget { display:none; } .archive-widget { display:none; } .syndicate-widget { display:none; } .powered-widget { display:none; } .customtext-widget { } .customtext-widget .widget-content { color:#5A140A; font-family:courier new; font-size:11px; line-height:14px; text-align:justify; } #gamma { margin:0; width:180px; } #gamma-inner { } .widget { } .widget a { } .widget a:hover { background:#000000 none repeat scroll 0 0; } .widget-inner { margin:0 8px; } .widget-header { display:none; } .widget-header a { text-decoration:none; } .widget-content { padding:0 5px; } .widget-list { padding:0; } ul.widget-list { margin:0; padding:0; } ul.widget-list li.item { display:inline; } .widget-footer { } .about-me-widget { display:none; } .about-me-widget div.user-pic { text-align:center; } .profile-list { } .profile-username { } .profile-name { } .calendar-widget { display:none; } .calendar-widget div.widget-content { padding-left:2em; } .calendar-widget table { font-size:xx-small; } .typelist-widget { padding-top:9px; } .categories-widget { } .tagcloud { display:none; } .powered-widget { padding-bottom:10px; } .lj-view-friends .powered-widget { margin-top:40px; } .lj-view-entry .powered-widget { margin-top:40px; } .archive-widget widget { display:none; } #footer { background:transparent url() repeat-x scroll left top; float:left; height:60px; width:100%; } #footer-inner { } #ad-5linkunit { clear:both; } #ad-leaderboard { margin-bottom:10px; } img[src="userinfo.gif"] { background:transparent url(http://irondevil.org/icon/categories/dryicons%20stickers/user.png) no-repeat scroll 0 0; height:0; padding:20px 15px 0 0 !important; width:0; } img[src="openid-profile.gif"] { background-image:url(http://irondevil.org/icon/categories/dryicons%20stickers/world_globe.png) !important; background-repeat:no-repeat !important; height:0; padding:15px 16px 0 0 !important; width:0; } img[src="anonymous.gif"] { background-image:url(http://irondevil.org/icon/categories/dryicons%20stickers/help.png) !important; background-repeat:no-repeat !important; height:0; padding:16px 17px 0 0 !important; width:0; } img[src="community.gif"] { background-image:url(http://irondevil.org/icon/categories/dryicons%20stickers/users.png) !important; background-repeat:no-repeat !important; height:0; padding:20px 16px 0 0 !important; width:0; } img[src="partnercomm.gif"] { background-image:url(http://irondevil.org/icon/categories/dryicons%20stickers/process.png) !important; background-repeat:no-repeat !important; height:0; padding:19px 16px 0 0 !important; width:0; } img[src="newsinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/dryicons%20stickers/attachment.png) !important; background-repeat:no-repeat !important; height:0; padding:20px 16px 0 0 !important; width:0; } img[src="syndicated.gif"] { background-image:url(http://irondevil.org/icon/categories/dryicons%20stickers/rss_feed.png) !important; background-repeat:no-repeat !important; height:0; padding:21px 16px 0 0 !important; width:0; } img[src="icon_protected.gif"], img[src="icon_groups.gif"] { background-image:url(http://irondevil.org/icon/categories/dryicons%20stickers/lock.png) !important; background-repeat:no-repeat; height:0; padding:15px 17px 0 0 !important; width:0; } img[src="icon_private.gif"] { background-image:url(http://irondevil.org/icon/categories/dryicons%20stickers/login.png) !important; background-repeat:no-repeat; height:0; padding:15px 17px 0 0 !important; width:0; } div.ContextualPopup { margin:5px 0 0 20px; } div.ContextualPopup img { border:0 none; } div.ContextualPopup div.Inner { background-color:#FFFFFF !important; border:medium none; color:#4F4F4F !important; font-family:Helvetica,Arial; font-size:12px; padding:0; width:20em; } div.ContextualPopup .Content { line-height:1.4; margin-right:50px; padding:2px 4px 6px; } div.ContextualPopup .Relation { font-weight:bold !important; } div.ContextualPopup .Content .OnlineStatus { font-weight:bold; } div.ContextualPopup .Userpic { padding:8px 8px 0 0; } div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { color:#0063BE !important; font-weight:normal; text-decoration:none !important; } #lj_controlstrip { background:#000000 none repeat scroll 0 0 !important; } #lj_controlstrip td { border-bottom:medium none; } #lj_controlstrip_statustext { color:#0063BE; } #lj_controlstrip a { color:#AAAAAA; } #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic { border-right:0 none; } #lj_controlstrip_login td { border-bottom:0 none; } #lj_controlstrip td td { border-bottom:0 none; } #lj_controlstrip_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000); } #lj_controlstrip_loggedout_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000); } #lj_controlstrip input, #lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember { background:#101010 none repeat scroll 0 0 !important; border:0 none !important; color:#AAAAAA !important; } #lj_controlstrip img[src="userinfo.gif"] { display:none; } #lj_controlstrip .ljuser a b { background:transparent none repeat scroll 0 0; color:#0063BE; letter-spacing:0; text-decoration:none !important; } img[src*="piximix.gif"] { display:none; } #dayyymmmmmdddd h2 { color:#101010; font-size:0; margin:0; text-indent:-9999px; } .skiplinks { background:#101010 none repeat scroll 0 0; color:#101010; margin-bottom:15px; padding:14px; } .skiplinks a { color:#FFFFFF; font-size:12px; text-transform:lowercase; }

how to install
select journal style	1. Apply any Expressive or Mixit theme. (Please note that some Expressive/Mixit themes may come with attribution images. If these show up in your layout, please comment here.) 2. Scroll down to Choose a Page Setup and select 2 Column (sidebar on left).
links list	Define your links. These are the links that show up at the very top of the page.
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.
optional
custom color schemes	If you want to give the layout a different color scheme, replace (CTRL+H) the `#0063BE` (lighter color) and `#22217F` (darker color) in the code. Below are some suggested schemes based on Adobe's software. `#C2CD23 #72BC43` Dreamweaver `#E53039 #B10535` Flash `#FFBC00 #FD5701` Illustrator `#DB0862 #521302` InDesign `#B3A2CE #191262` Premiere

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Mini icons by Dry Icons. • Icon by enjoyelsilence

read the layout faq before asking questions!

smooth sailing: methane

daemon — Sat, 18 Apr 2009 03:21:34 GMT

Modified version of my personal layout that has been sitting around for way too long.

(Reposted this because I left out an important part of the instructions. I'm way too tired.)

layout notes
account types	Basic, Plus, Paid
compatible browsers	Internet Explorer 7, Mozilla Firefox, Opera, Safari, Google Chrome
minimum resolution	1024x768
comment pages	Yes
navstrip	Optional
disabled	• Sidebar
css stylesheet
stylesheet	/--------------------------------------------------- STYLESHEET CREATOR: scythe.livejournal.com STYLESHEET NAME: Methane S2 STYLE: Smooth Sailing DOWNLOAD: thrashmetal.livejournal.com *Please remember to credit!** -----------------------------------------------------/ body { background:transparent url(http://i40.tinypic.com/nffcs3.jpg) repeat scroll 0 0; color:#AAAAAA; font-family:arial; font-size:11px; margin:0; } .pageblock { position:absolute; top:55px; width:100%; } a, a:visited { color:#FFFFFF; text-decoration:none; } a:hover { color:#F2F2F2; } a img { border:medium none; } ul { list-style-type:square; } blockquote { background:transparent url(http://i44.tinypic.com/2lm1ap5.jpg) repeat scroll 0 0; color:#666666; line-height:19px; padding:12px; } .header-title { color:#FFFFFF; font-family:helvetica; font-size:61px; font-weight:bold; height:58px; letter-spacing:-6px; margin:0 auto; overflow:hidden; text-align:left; width:700px; } .header-subtitle { display:none; } .pageheaderblock { margin:0 auto; text-align:center; width:700px; z-index:1000; } .pagefooterblock { display:none; } .bodyblock { margin:0 auto; padding-top:5px; width:700px; } .bodyheaderblock, .body-title, .body-midtitle { display:none; } .bodynavblock { font-size:11px; margin:0 33px; padding:0; } .entryHolder { width:700px; background:transparent url(http://www.cdupload.com/files/50947_k4lzq/body_bgds.jpg) repeat-y scroll 507px 0; border-left:medium none; margin-bottom:10px; } .entryUserinfo { text-align:center; width:185px; } .commentUserinfo-username img[src="userinfo.gif"], .entryUserinfo-username img[src="userinfo.gif"], .entryUserinfo-username img[src="community.gif"], .entryUserinfo-username img[src="partnercomm.gif"], .entryUserinfo-username img[src="newsinfo.gif"], .entryUserinfo-username img[src="syndicated.gif"] { display:none; } .entryUserinfo-username { line-height:15px; margin-top:7px; } .entryUserinfo-username .ljuser a b { color:#000000; font-size:16px; letter-spacing:-1px; text-decoration:none !important; text-transform:lowercase; } .entryUserinfo-username .ljuser a b:hover { color:#FFFFFF; } .entryUserinfo-usericon img { background:#111111 url(http://i41.tinypic.com/16jikia.jpg) repeat scroll 50% 40%; padding:15px; } .entryUserinfo-usericon img:hover { background:transparent url(http://www.cdupload.com/files/50943_59amx/opacblack.png) repeat scroll 0 0; padding:15px; } .entryText { background:transparent url(http://www.cdupload.com/files/50943_59amx/opacblack.png) repeat scroll 0 0; line-height:20px; margin-right:8px; min-height:216px; padding:7px 16px 0 21px; text-align:justify; width:469px; } .entryText img { max-width:380px; } .entryHeader { background:transparent url(http://www.cdupload.com/files/50943_59amx/opacblack.png) repeat scroll 0 0; min-height:20px; padding:10px 21px 0; text-align:left; width:464px; } .entryHeader a { color:#FFFFFF; font-family:helvetica; font-size:18px; text-transform:lowercase; } .entryHeader a:hover { color:#F2F2F2; text-decoration:none; } .entryHeaderDate { color:#FFFFFF; font-family:arial; font-size:45px; font-variant:small-caps; font-weight:bold; letter-spacing:-4px; line-height:33px; margin-left:-84px; position:absolute; text-align:right; text-decoration:none; width:51px; } .entryHeaderSubject { font-size:0; } .entryMetadata { background:transparent url(http://www.cdupload.com/files/50943_59amx/opacblack.png) repeat scroll 0 0; font-family:arial; margin-bottom:0; padding:18px 27px; width:453px; } .entryMetadata a, .entryMetadata a:visited { text-transform:uppercase; } .entryMetadata a:hover { border-bottom:0 none; color:#AAAAAA; text-decoration:none; } .entryMetadata ul { margin:0; padding:0; } .entryMetadata li { background:transparent none repeat scroll 0 0; display:block; list-style-image:none; list-style-position:outside; list-style-type:none; padding-bottom:0; padding-right:10px; } .entryMetadata-label { font-weight:bold; padding-right:4px; text-transform:uppercase; } .entryLinkbar { background:#111111 url(http://www.cdupload.com/files/50946_6esfd/mixremix.png) repeat scroll 19% 48%; color:#000000; float:right; font-size:12px; margin-left:507px; margin-top:-61px; min-height:51px; padding:5px 3px 5px 5px; position:absolute; text-align:right; text-transform:lowercase; width:185px; } .entryLinkbar a { color:#AAAAAA; display:block; font-size:10px; font-weight:normal; letter-spacing:1px; margin-right:4px; padding:2px; text-transform:uppercase; } .entryLinkbar a:hover { background:transparent url(http://www.cdupload.com/files/36469_b3snu/transbg.png) repeat scroll 0 0; color:#FFFFFF; text-decoration:none; } .entryLinkbar ul { margin:0; padding:0; } .entryLinkbar li { background:transparent none repeat scroll 0 0; display:inline; float:right; margin:0; padding:0; width:50%; } .yearlinks { text-align:right; } .yearlink { padding-left:4px; padding-right:4px; } .month { background:transparent url(http://www.cdupload.com/files/50943_59amx/opacblack.png) repeat scroll 0 0; color:#444444; font-size:10px; padding:21px 0 ; width:508px; } .daysubjects { background:transparent url(http://www.cdupload.com/files/50943_59amx/opacblack.png) repeat scroll 0 0; padding:8px 8px 11px 26px; width:474px; } .daytitles { color:#FFFFFF; font-size:15px; text-align:center; text-transform:lowercase; } .day-blank { } td.day { margin:1px; } .day { background:transparent url(http://i44.tinypic.com/2lm1ap5.jpg) repeat scroll 0 0; padding:3px; } .day-date { font-family:arial; text-align:center; width:50%; } .day-count { float:right; font-size:20px; text-align:center; width:40%; } .day-count a { color:#FFFFFF; font-size:18px; font-weight:normal; padding:4px; text-decoration:none; } .sidebar { display:none; } .header-menu { font-family:helvetica; margin:10px 0 0; text-align:left; width:700px; } .header-menu a, .header-menu a:visited { color:#FFFFFF; font-size:13px; font-weight:normal; padding:8px 6px; text-decoration:none; text-transform:lowercase; white-space:nowrap; } .header-menu a:hover { background:transparent url(http://i44.tinypic.com/2lm1ap5.jpg) repeat scroll 0 0; } #footer-menu { font-size:11px; margin-bottom:10px; margin-left:0; margin-top:23px; text-align:center; } #footer-menu a, .footer-menu a:visited { font-size:11px; margin-right:6px; text-align:left; text-transform:lowercase; white-space:nowrap; } #footer-menu a:hover { text-decoration:none; } .header-menu ul, #footer-menu ul { line-height:1; margin:0; padding:9px 0; } #footer-menu li { background:transparent none no-repeat scroll 0 0; display:inline; padding:0; } .header-menu li { background:transparent none repeat scroll 0 0; display:inline; margin:0 5px 0 0; padding:0; } .header-menu li:hover { } .tagstable, .tagstable td { border:0 none; } textarea, input, select { background:transparent url(http://i44.tinypic.com/2lm1ap5.jpg) repeat scroll 0 0; border:1px solid #101010; color:#6F6F6F; font-family:helvetica; font-size:12px; line-height:normal; margin:2px; padding:2px; } textarea:focus, input:focus, select:focus { border:1px solid #222222; } .ljuser a b { background:transparent none repeat scroll 0 0; color:#FFFFFF; letter-spacing:0; text-decoration:none !important; } .ljuser a { text-decoration:none !important; } .ljuser a:hover b { } img[src="userinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/05.png) !important; background-repeat:no-repeat !important; height:0; padding:15px 12px 0 0 !important; width:0; } img[src="community.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/45.png) !important; background-repeat:no-repeat !important; height:0; padding:15px 11px 0 0 !important; width:0; } img[src="partnercomm.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010c/47.png) !important; background-repeat:no-repeat !important; height:0; padding:13px 11px 0 0 !important; width:0; } img[src="newsinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010b/28.png) !important; background-repeat:no-repeat !important; height:0; padding:13px 11px 0 0 !important; width:0; } img[src="syndicated.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/01.png) !important; background-repeat:no-repeat !important; height:0; padding:13px 11px 0 0 !important; width:0; } img[src="anonymous.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010c/50.png) !important; background-repeat:no-repeat !important; height:0; padding:13px 11px 0 0 !important; width:0; } img[src="openid-profile.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/02.png) !important; background-repeat:no-repeat !important; height:0; padding:13px 11px 0 0 !important; width:0; } img[src="icon_protected.gif"], img[src="icon_groups.gif"] { background-image:url(http://irondevil.org/icon/categories/dodoki%20gray/key.png) !important; background-repeat:no-repeat !important; height:0; margin-top:0; padding:14px 18px 0 0 !important; width:0; } img[src="icon_private.gif"] { background-image:url(http://irondevil.org/icon/categories/dodoki%20gray/stop.png) !important; background-repeat:no-repeat !important; height:0; margin-top:0; padding:14px 18px 0 0 !important; width:0; } div.ContextualPopup img { border:0 none; } div.ContextualPopup div.Inner { background:#FFFFFF none repeat scroll 0 0; border:medium none; color:#222222; font-family:helvetica; font-size:11px; padding:7px; width:20em; } div.ContextualPopup .Content { line-height:13px; margin-right:50px; padding:2px 4px 6px; } div.ContextualPopup .Relation { font-family:helvetica; font-size:15px; margin-bottom:5px; } div.ContextualPopup .Content .OnlineStatus { font-weight:bold; } div.ContextualPopup .Userpic { background:#222222 url(http://i42.tinypic.com/2upbblt.jpg) repeat scroll 0 0; padding:6px; } div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { color:#5F5F5F !important; font-weight:normal; text-decoration:none !important; } #lj_controlstrip { background:transparent none repeat scroll 0 0 !important; color:black; } #lj_controlstrip td { border-bottom:medium none; } #lj_controlstrip_statustext { color:#555555; } #lj_controlstrip a { color:#555555; } #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic { border-right:0 none; } #lj_controlstrip_login td { border-bottom:0 none; } #lj_controlstrip td td { border-bottom:0 none; } #lj_controlstrip_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000); } #lj_controlstrip_loggedout_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000); } #lj_controlstrip input, #lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember { background:transparent url(http://i44.tinypic.com/2lm1ap5.jpg) repeat scroll 0 0 !important; color:#AAAAAA !important; } #lj_controlstrip .ljuser a b { background:transparent none repeat scroll 0 0; color:#555555; letter-spacing:0; text-decoration:none !important; } ul.taglist { padding-right:11px; } ul.taglist li { background:transparent none no-repeat scroll 0 0; border-bottom:1px solid #F5F5F5; list-style-image:none; list-style-position:outside; list-style-type:decimal-leading-zero; padding:0 3px 3px 9px; } li { background:transparent url(http://lj.irondevil.org/components/grayli.png) no-repeat scroll 0 6px; color:#555555; list-style-type:none; margin:2px 0; padding:0 0 2px 9px; } .entryLinkbar a[href="subscriptions"], .entryLinkbar a[href*="tellafriend"] { display:none; } .currents { background:transparent url(http://www.cdupload.com/files/50943_59amx/opacblack.png) repeat scroll 0 0; line-height:14px; padding:14px; width:479px; } .commentHolder { background:transparent url(http://www.cdupload.com/files/50943_59amx/opacblack.png) repeat scroll 0 0; margin:18px 0; padding:10px 0 0; } .commentUserinfo { color:#EEEEEE; font-size:0; margin-right:3px; margin-top:4px; text-align:center; width:160px; } .commentUserinfo .ljuser a b { color:#000000; font-size:16px; letter-spacing:-1px; text-decoration:none !important; text-transform:lowercase; } .commentUserinfo-usericon img { background:transparent url(http://www.cdupload.com/files/50943_59amx/opacblack.png) repeat scroll 0 0; padding:15px; } .commentUserinfo-usericon img:hover { background:transparent url(http://i44.tinypic.com/2lm1ap5.jpg) repeat scroll 0 0; } .commentText { line-height:20px; min-height:114px; padding:10px 20px; text-align:justify; } .commentHeader, .commentHeaderScreened { display:none; } .commentLinkbar { background:transparent url(http://www.cdupload.com/files/50947_k4lzq/body_bgds.jpg) repeat scroll 0 0; padding:4px 4px 1px; text-align:right; } .commentLinkbar ul { margin:0 0 9px; padding:0; } .commentLinkbar li { background:transparent none no-repeat scroll 0 0; display:inline; font-size:10px; letter-spacing:1px; text-transform:uppercase; } .commentLinkbar a { color:#AAAAAA; } .commentLinkbar a:hover { color:#474747; text-decoration:none; } .replyform { background:transparent url(http://www.cdupload.com/files/50943_59amx/opacblack.png) repeat scroll 0 0; padding:17px; } #qrform { border:medium none !important; color:#FFFFFF; padding:16px; } #qrform table { border:0 none !important; color:#AAAAAA; width:98%; }

how to install
select journal style	1. Apply any Smooth Sailing theme. 2. Scroll down to Choose a Page Setup and select 2 Column (sidebar on left).
display	1. Set Userinfo Position in Entries to Right side of the entry text. 2. Set Wrap Entry text under userinfo to No.
entry text	1. Paste the code into its respective boxes: Format for Date and Time (Recent/Friends/Entry/Reply page) and Format for Date and Time (Day page only)%%mm%% %%dd%% %%yy%% *2. (Optional)* Scroll down to the Comments section and shorten the text for Link text to read comments, otherwise, it will overflow when an entry has comments in the hundreds.
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.
optional
upload images	http://www.cdupload.com/files/50943_59amx/opacblack.png http://i44.tinypic.com/2lm1ap5.jpg http://www.cdupload.com/files/50947_k4lzq/body_bgds.jpg http://i40.tinypic.com/nffcs3.jpg Upload the images to a site like Tinypic or Photobucket, then replace the old URLs.

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Icon by puncture.

read the layout faq before asking questions!

smooth sailing: high society

daemon — Mon, 30 Mar 2009 00:31:42 GMT

This layout was inspired by the Esquire theme for Tumblr, originally created by Matthew Buchanan.

I make use of a Vista/Office 2007-only font called Cambria in this layout. The font isn't required for the layout to display, but you can download it here if you wish.

layout notes
account types	Basic, Plus, Paid
compatible browsers	Mozilla Firefox, Opera, Safari, Google Chrome
minimum resolution	1024x768
comment pages	Yes
navstrip	Optional
disabled	N/A
css stylesheet
stylesheet	/--------------------------------------------------- STYLESHEET CREATOR: scythe.livejournal.com STYLESHEET NAME: High Society S2 STYLE: Smooth Sailing DOWNLOAD: thrashmetal.livejournal.com *Please remember to credit!** -----------------------------------------------------/ body { background:#FFFFFF none repeat scroll 0 0; font-family:Cambria,Georgia,Times New Roman; font-size:12px; margin:0; } textarea, input, select { background:#FFFFFF none repeat scroll 0 0; border:1px solid #EEEEEE; color:#333333; font-family:cambria,georgia; font-size:15px; } .entryText a, .entryText a:visited { border-bottom:1px dotted #BBBBBB; padding-bottom:1px; } a, a:visited { color:#000000; letter-spacing:0; text-decoration:none; } a img { border:medium none; } li { background:transparent url(http://lj.irondevil.org/components/grayli.png) no-repeat scroll 0 7px; list-style-type:none; margin:5px 0; padding:0 0 0 11px; } blockquote { color:#5F5F5F; font-size:13px; padding:15px; } .header-title, .header-subtitle, .pagefooterblock, .bodyheaderblock, .body-title, .body-midtitle { display:none; } .bodyblock { margin-left:31px; width:768px; } .bodynavblock { margin:0 33px; padding:0; } .entryHolder { border-left:11px solid #000000; margin-bottom:0; margin-left:85px; } .entryUserinfo { margin-left:474px; position:absolute; } .entryUserinfo-username { margin-top:6px; text-align:center; } .entryUserinfo-username .ljuser a b { font-size:14px; } .entryUserinfo-usericon img { border:13px solid #000000; } .entryText:first-letter { background:#FF3300 none repeat scroll 0 0; color:#FFFFFF; float:left; font-size:63px; margin-right:10px; margin-top:1px; padding:4px 12px 7px 5px; } .entryText { font-size:14px; letter-spacing:0; line-height:20px; min-height:94px; padding:5px 19px 0 36px; text-align:justify; width:405px; } .entryText img { max-width:380px; } .entryHeader { line-height:17px; padding:25px 36px 0; text-transform:lowercase; } .entryHeader a { color:#000000; font-size:29px; } .entryHeaderSubject { color:#000000; font-size:0; } .entryHeaderDate { background:#000000 none repeat scroll 0 0; color:#FFFFFF; display:block; font-size:19px; letter-spacing:2px; line-height:23px; margin-left:-101px; margin-right:0; padding:15px 4px 8px; position:absolute; text-align:center; text-transform:uppercase; width:51px; } .entryHeaderDate:first-line { color:#FFFF66; font-size:37px; } .entryMetadata { margin-bottom:0; padding:8px 40px 10px; } .entryMetadata a, .entryMetadata a:visited { text-transform:lowercase; } .entryMetadata a:hover { border-bottom:0 none; text-decoration:none; } .entryMetadata ul { margin:0; padding:0; } .entryMetadata li { background:transparent none repeat scroll 0 0; display:block; list-style-image:none; list-style-position:outside; list-style-type:none; padding-right:10px; } .entryMetadata-label { font-weight:bold; padding-right:4px; text-transform:lowercase; } .entryLinkbar { background:#EEEEEE none repeat scroll 0 0; color:#000000; font-family:"Adobe Caslon Pro",Cambria,Georgia,Times New Roman; font-size:12px; margin-left:29px; padding:2px; text-align:right; text-transform:lowercase; } .entryLinkbar a { background:transparent none repeat scroll 0 0; color:#888888; letter-spacing:0; margin-right:7px; padding:0; text-transform:lowercase; } .entryLinkbar a:hover { color:#3399FF; } .entryLinkbar ul { margin-bottom:0 !important; margin-left:0 !important; margin-top:0 !important; padding:0; } .entryLinkbar li { background:transparent none repeat scroll 0 0; display:inline; margin:0; padding:0; } .yearlinks { text-align:right; } .yearlink { padding-left:4px; padding-right:4px; } .month { background:transparent none repeat scroll 0 0; margin:13px auto; padding:6px 0 12px; width:420px; } .daysubjects { padding:8px 8px 8px 40px; } .daytitles { font-size:17px; text-align:center; text-transform:lowercase; } .day { background:#FFFF66 none repeat scroll 0 0; border:1px solid #FFFFFF; padding:3px; } .day-date { text-align:center; width:50%; } .day-count { float:right; font-size:20px; text-align:center; width:50%; } .day-count a { font-size:19px; font-weight:normal; padding:1px; text-decoration:none; } .sidebar { background:#FFFF66 url(http://i374.photobucket.com/albums/oo181/lightmass/sidebar-bg.png) no-repeat scroll 0 103%; font-size:14px; line-height:17px; margin-right:10px; margin-top:25px; padding:23px 0 25px; top:0; width:197px; } .sidebar a, .sidebar a:visited { } .sidebar a:hover { color:#000000; } .sidebox { color:#000000; margin-bottom:26px; margin-right:auto; margin-top:0; padding:2px 25px 0; } .sideboxTitle { font-size:18px; text-transform:uppercase; } .sideboxContent { } .sidebox #profile { text-align:center; } .profile-label { display:none; } .profile-content { display:none; } .profile-userpic { border:13px solid #000000; } .sidebox #latestmonth table { font-size:9px; margin-left:auto; margin-right:auto; margin-top:4px; width:90%; } .sidebox #latestmonth a { color:#000000; font-size:12px; text-transform:lowercase; } .latestmonth-inactive { background:#000000 none repeat scroll 0 0; color:#FFFFFF; height:19px; margin:1px; padding-left:5px; width:15px; } .latestmonth-active { background:#000000 none repeat scroll 0 0; height:19px; margin:1px; padding-left:5px; text-align:left; width:15px; } .latestmonth-active:hover, .latestmonth-inactive:hover { color:#AAAAAA; } .latestmonth-active a { color:#FFFFFF !important; font-size:12px !important; } .sidebox #tags_sidebox { color:#131313; font-size:0 !important; line-height:12px; text-align:left; } .sidebox #tags_sidebox a { font-size:10px !important; margin-right:5px; } .sidebox #systemlinks { line-height:normal; margin-bottom:0; padding:0; text-align:left; top:0; } .sidebox #systemlinks a:link, .sidebox #systemlinks a:active, .sidebox #systemlinks a:visited { } .sidebox #systemlinks a:hover, .sidebox #systemlinks a:active { text-decoration:none; } .listitem { } .listtitle { display:none; } .pageheaderblock { margin:0 auto; } .header-menu { background:#000000 none repeat scroll 0 0; padding:13px 15px; } .header-menu a, .header-menu a:visited { background:#000000 none repeat scroll 0 0; color:#FFFFFF; font-size:12px; letter-spacing:1px; padding:1px 3px; text-transform:uppercase; } .header-menu a:hover { } .header-menu ul { margin:0 auto; padding:0; } .header-menu li { display:inline; } #footer-menu { font-size:11px; margin-bottom:10px; margin-left:0; margin-top:22px; padding:0 0 10px; text-align:right; } #footer-menu a, .footer-menu a:visited { letter-spacing:1px; text-transform:uppercase; } .header-menu ul, #footer-menu ul { margin:0; padding:0; } .header-menu li, #footer-menu li { background:transparent none repeat scroll 0 0; display:inline; } .taglist, .tagstable { padding-bottom:10px; } .ljuser a b { background:transparent none repeat scroll 0 0; font-weight:normal; letter-spacing:0; text-decoration:none !important; } .ljuser a { text-decoration:none !important; } .ljuser a:hover b { background:transparent none repeat scroll 0 0; border-bottom:0 none; text-decoration:none !important; } img[src="userinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue2/user_business.png); background-repeat:no-repeat !important; height:0; padding:17px 17px 0 0 !important; width:0; } img[src="openid-profile.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue2/user_orange.png); background-repeat:no-repeat !important; height:0; padding:17px 17px 0 0 !important; width:0; } img[src="anonymous.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue2/user_silhouette.png); background-repeat:no-repeat !important; height:0; padding:17px 17px 0 0 !important; width:0; } img[src="community.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue2/users.png) !important; background-repeat:no-repeat !important; height:0; padding:17px 17px 0 0 !important; width:0; } img[src="partnercomm.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue2/users.png) !important; background-repeat:no-repeat !important; height:0; padding:17px 17px 0 0 !important; width:0; } img[src="newsinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue2/newspaper.png); background-repeat:no-repeat !important; height:0; padding:17px 17px 0 0 !important; width:0; } img[src="syndicated.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue2/feed.png); background-repeat:no-repeat !important; height:0; padding:17px 17px 0 0 !important; width:0; } img[src="icon_protected.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue/lock.png) !important; background-repeat:no-repeat !important; height:0; padding:16px 18px 0 0 !important; width:0; } img[src="icon_groups.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue/lock.png) !important; background-repeat:no-repeat; height:0; padding:16px 18px 0 0 !important; width:0; } img[src="icon_private.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue/key.png) !important; background-repeat:no-repeat; height:0; padding:17px 18px 0 0 !important; width:0; } div.ContextualPopup img { border:0 none; } div.ContextualPopup div.Inner { background-color:#FFFFFF !important; border:medium none; color:#000000 !important; font-family:Cambria,Georgia,Times New Roman; padding:7px; width:20em; } div.ContextualPopup .Content { line-height:1.4; margin-right:50px; padding:2px 4px 6px; } div.ContextualPopup .Relation { font-weight:bold !important; } div.ContextualPopup .Content .OnlineStatus { font-weight:bold; } div.ContextualPopup .Userpic { padding:8px 8px 0 0; } div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { color:#5F5F5F !important; font-weight:normal; text-decoration:none !important; } .entryLinkbar a[href="subscriptions"], .entryLinkbar a[href*="tellafriend"] { display:none; } #lj_controlstrip { background:#101010 none repeat scroll 0 0; color:#515151; } #lj_controlstrip_statustext { color:#999999; } #lj_controlstrip a { color:#666666; } #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic { border-right:0 none; } #lj_controlstrip_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000); } #lj_controlstrip_loggedout_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000); } #lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember, #lj_controlstrip input { background:#222222 none repeat scroll 0 0 !important; border:0 none; color:#9C9C9C; } #lj_controlstrip .ljuser a b { color:#F2F2F2; font-family:cambria,georgia,times New Roman; font-size:14px; } .commentHolder { margin:36px 0 0 auto; text-align:justify; width:484px; } .commentUserinfo { color:#111111; font-size:0; margin-left:12px; text-align:center; } .commentUserinfo .ljuser a b { font-size:14px; } .commentUserinfo-usericon img { border:10px solid #000000; height:70px; width:70px; } .commentText { line-height:18px; min-height:105px; padding-bottom:12px; padding-left:118px; } .commentHeader { display:none; } .commentHeaderSubject, .commentHeaderScreened { display:none; } .commentLinkbar { background:#EEEEEE none repeat scroll 0 0; font-family:"Adobe Caslon Pro",Cambria,Georgia,Times New Roman; margin:0; padding:1px; text-align:right; } .commentLinkbar ul { margin:0; padding:0; } .commentLinkbar li { background:transparent none repeat scroll 0 0; display:inline; } .commentLinkbar a { color:#888888; font-size:11px; text-transform:lowercase; } .commentLinkbar a:hover { color:#3399FF; text-decoration:none; } .replyform { margin-left:auto; padding:22px; width:500px; } #qrform table { border:medium none !important; }

how to install
select journal style	1. Apply any Smooth Sailing theme. 2. Scroll down to Choose a Page Setup and select 2 Column (sidebar on left).
entry text	Paste the code into its respective boxes: Format for Date and Time (Recent/Friends/Entry/Reply page) and Format for Date and Time (Day page only) %%dd%% %%mon%%
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Icon by puncture • Tiny icons by Pinvoke

read the layout faq before asking questions!

smooth sailing: spin the record

daemon — Sun, 22 Mar 2009 16:10:12 GMT

Layout based off of my current layout, which will also be up for grabs in the future.

EDIT (4/4/09): Fixed a bug with the comment holders.

EDIT JUNE 2010: Added some code so the "Share This" link doesn't show up and mess up the layout.

layout notes
account types	Basic, Plus, Paid
compatible browsers	Mozilla Firefox, Opera, Safari, Google Chrome Entry linkbar will not display properly in IE, but otherwise unbroken.
minimum resolution	800x600
comment pages	Yes
navstrip	Optional
disabled	• Sidebar except links list
css stylesheet
stylesheet	/--------------------------------------------------- STYLESHEET CREATOR: scythe.livejournal.com STYLESHEET NAME: Spin the Record S2 STYLE: Smooth Sailing DOWNLOAD: thrashmetal.livejournal.com *Please remember to credit!** -----------------------------------------------------/ body { background:#EEEEEE url(http://i41.tinypic.com/xx7m.jpg) repeat scroll 0 0; color:#4F4F4F; font-family:helvetica,arial,sans-serif; font-size:11px; margin:0; } .pageblock { position:absolute; top:0; width:100%; } a, a:visited { color:#000000; text-decoration:none; } a:hover { color:#555555; } a img { border:medium none; } ul { list-style-type:square; } blockquote { color:#111111; font-family:courier new; font-size:12px; line-height:19px; padding:5px 0 0; } .header-title, .header-subtitle { display:none; } .pageheaderblock { margin:0 auto; text-align:center; width:100%; } .bodyblock { margin:20px auto; width:500px; } .bodyheaderblock, .body-title, .body-midtitle, .pagefooterblock{ display:none; } .bodynavblock { font-size:11px; margin:0 33px; padding:0; } .entryHolder { background:#FFFFFF url(http://i42.tinypic.com/33ddxc7.jpg) repeat scroll 0 0; border-left:medium none; margin-bottom:16px; width:500px; } .entryUserinfo { margin-left:501px; margin-top:-10px; position:absolute; text-align:center; width:170px; } .commentUserinfo-username img[src="userinfo.gif"], .entryUserinfo-username img[src="userinfo.gif"], .entryUserinfo-username img[src="community.gif"], .entryUserinfo-username img[src="partnercomm.gif"], .entryUserinfo-username img[src="newsinfo.gif"], .entryUserinfo-username img[src="syndicated.gif"] { display:none; } .entryUserinfo-username { line-height:19px; margin-top:7px; } .entryUserinfo-username .ljuser a b { color:#000000; font-family:georgia; font-size:17px; font-weight:normal; text-decoration:none !important; text-transform:lowercase; } .entryUserinfo-username .ljuser a b:hover { } .entryUserinfo-usericon img { background:#111111 url(http://i41.tinypic.com/16jikia.jpg) repeat scroll 50% 40%; padding:20px; } .entryUserinfo-usericon img:hover { background:#222222 url(http://i42.tinypic.com/2upbblt.jpg) repeat scroll 0 0; padding:20px; } .entryText { line-height:18px; min-height:106px; padding:9px 15px; text-align:justify; } .entryText img { max-width:380px; } .entryHeaderTags { background:transparent url(http://irondevil.org/icon/categories/damniconsmini/thumbtack.gif) no-repeat scroll 0 50%; color:#FFFFFF; display:block; font-size:0; padding-left:10px; } .entryHeaderTags a { font-size:11px !important; margin-right:5px; } .entryHeaderTags a:hover { } .entryHeader { padding:10px 15px 0; text-align:left; } .entryHeader a { color:#222222; font-family:georgia; font-size:23px; font-weight:normal; text-transform:lowercase; } .entryHeader a:hover { color:#111111; text-decoration:underline; } .entryHeaderDate { color:#111111; font-family:arial; font-size:45px; font-weight:bold; letter-spacing:-4px; line-height:33px; margin-left:-83px; position:absolute; text-align:right; text-decoration:none; text-transform:uppercase; width:57px; } .entryHeaderSubject { font-size:0; } .entryMetadata { line-height:10px; margin-bottom:0; padding:10px 6px; } .entryMetadata a, .entryMetadata a:visited { font-size:8px; text-transform:uppercase; } .entryMetadata a:hover { border-bottom:0 none; color:#AAAAAA; text-decoration:none; } .entryMetadata ul { margin:0; padding:0; } .entryMetadata li { background:transparent none repeat scroll 0 0; color:#221E1F; display:block; font-size:9px; list-style-image:none; list-style-position:outside; list-style-type:none; padding-bottom:0; padding-right:10px; } .entryMetadata-label { font-family:helvetica; font-size:10px; font-weight:bold; padding-right:4px; text-transform:uppercase; } .entryLinkbar { background:#111111 url(http://i41.tinypic.com/16jikia.jpg) repeat scroll 19% 48%; color:#000000; font-size:12px; min-height:59px; text-align:center; text-transform:lowercase; width:500px; } .entryLinkbar a { background:transparent none repeat scroll 0 0; color:#AAAAAA; display:block; font-size:10px; font-weight:normal; letter-spacing:1px; padding:9px 4px; text-transform:uppercase; } .entryLinkbar a:hover { background:transparent url(http://www.cdupload.com/files/36469_b3snu/transbg.png) repeat scroll 0 0; color:#FFFFFF; text-decoration:none; } .entryLinkbar ul { margin:0; padding:0; } .entryLinkbar li { background:transparent none repeat scroll 0 0; display:inline; float:left; margin:0; padding:0; width:33.3%; } .yearlinks { text-align:right; } .yearlink { padding-left:4px; padding-right:4px; } .month { font-size:10px; margin:10px auto; padding:4px; width:95%; } .daysubjects { padding:8px 8px 11px 26px; width:462px; } .daytitles { color:#000000; font-family:georgia; font-size:15px; text-align:center; text-transform:lowercase; } .day-blank { } .day { padding:6px; } .day-date { color:#555555; text-align:center; width:50%; } .day-count { float:right; font-size:20px; text-align:right; } .day-count a { color:#000000; font-size:18px; font-weight:normal; padding:4px; text-decoration:none; } .sidebar { left:0; position:absolute; text-align:center; top:115px; width:100%; z-index:10000; } .sidebox { margin:0 auto; } .sideboxTitle { display:none; } .sideboxContent { background:transparent none repeat scroll 0 0; line-height:17px; margin-left:0; } .sidebox #freetext, .sidebox #latestmonth, .sidebox #search, .sidebox #summary, .sidebox #profile, .sidebox #tags_sidebox { display:none; } .sidebox #systemlinks { margin:0 auto; } .sidebox #systemlinks a:link, .sidebox #systemlinks a:active, .sidebox #systemlinks a:visited { color:#BBBBBB; font-size:11px; font-weight:normal; text-transform:lowercase; } .sidebox #systemlinks a:hover, .sidebox #systemlinks a:active { text-decoration:none; } .listitem { display:inline; margin-right:6px; } .listspacer { height:1px; } .sidebox #latestmonth table { margin-left:auto; margin-right:auto; margin-top:4px; width:90%; } .listtitle { display:none; } .profile-label { font-weight:bold; } .header-menu { background:#111111 url(http://i41.tinypic.com/16jikia.jpg) repeat scroll 50% 40%; margin:0; padding-bottom:38px; padding-top:87px; text-align:center; } .header-menu a, .header-menu a:visited { color:#FFFFFF; font-family:georgia; font-size:17px; font-weight:normal; padding:7px 8px; text-decoration:none; text-transform:lowercase; } .header-menu a:hover { background:transparent url(http://www.cdupload.com/files/36469_b3snu/transbg.png) repeat scroll 0 0; color:#EEEEEE; } #footer-menu { font-size:11px; margin-left:0; margin-top:17px; text-align:center; } #footer-menu a, .footer-menu a:visited { font-size:11px; text-align:left; text-transform:lowercase; white-space:nowrap; } #footer-menu a:hover { text-decoration:none; } .header-menu ul, #footer-menu ul { margin:0; padding:0; } #footer-menu li { background:transparent none no-repeat scroll 0 0; display:inline; margin-right:7px; padding:0; } .header-menu li { background:transparent none repeat scroll 0 0; display:inline; margin:0 0 0 4px; padding:0; } .header-menu li:hover { } .tagstable, .tagstable td { border:0 none; } textarea, input, select { max-width:419px; background:white none repeat scroll 0 0; border:1px solid #F2F2F2; color:#6F6F6F; font-family:courier new; font-size:12px; line-height:normal; margin:2px; padding:2px; } textarea:focus, input:focus, select:focus { border:1px solid #EEEEEE; } .ljuser a b { background:transparent none repeat scroll 0 0; color:#000000; letter-spacing:0; text-decoration:none !important; } .ljuser a { text-decoration:none !important; } .ljuser a:hover b { } img[src="userinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/05.png) !important; background-repeat:no-repeat !important; height:0; padding:15px 12px 0 0 !important; width:0; } img[src="community.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/45.png) !important; background-repeat:no-repeat !important; height:0; padding:15px 11px 0 0 !important; width:0; } img[src="partnercomm.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010c/47.png) !important; background-repeat:no-repeat !important; height:0; padding:13px 11px 0 0 !important; width:0; } img[src="newsinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010b/28.png) !important; background-repeat:no-repeat !important; height:0; padding:13px 11px 0 0 !important; width:0; } img[src="syndicated.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/01.png) !important; background-repeat:no-repeat !important; height:0; padding:13px 11px 0 0 !important; width:0; } img[src="icon_protected.gif"], img[src="icon_groups.gif"] { background-image:url(http://irondevil.org/icon/categories/dodoki%20gray/key.png) !important; background-repeat:no-repeat !important; height:0; margin-top:0; padding:14px 18px 0 0 !important; width:0; } img[src="icon_private.gif"] { background-image:url(http://irondevil.org/icon/categories/dodoki%20gray/stop.png) !important; background-repeat:no-repeat !important; height:0; margin-top:0; padding:14px 18px 0 0 !important; width:0; } div.ContextualPopup img { border:0 none; } div.ContextualPopup div.Inner { background:#FFFFFF none repeat scroll 0 0; border:medium none; color:#222222; font-family:helvetica; font-size:11px; padding:7px; width:20em; } div.ContextualPopup .Content { line-height:13px; margin-right:50px; padding:2px 4px 6px; } div.ContextualPopup .Relation { font-family:helvetica; font-size:15px; margin-bottom:5px; } div.ContextualPopup .Content .OnlineStatus { font-weight:bold; } div.ContextualPopup .Userpic { background:#222222 url(http://i42.tinypic.com/2upbblt.jpg) repeat scroll 0 0; padding:6px; } div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { color:#5F5F5F !important; font-weight:normal; text-decoration:none !important; } #lj_controlstrip { background:transparent none repeat scroll 0 0; color:#FFFFFF; position:absolute; z-index:100; } #lj_controlstrip:hover { opacity:100; } #lj_controlstrip td { border-bottom:medium none; } #lj_controlstrip_statustext { color:#5F5F5F; } #lj_controlstrip a { color:#5F5F5F; } #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic { border-right:0 none; } #lj_controlstrip_login td { border-bottom:0 none; } #lj_controlstrip td td { border-bottom:0 none; } #lj_controlstrip_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000); } #lj_controlstrip_loggedout_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000); } #lj_controlstrip input { background:#222222 none repeat scroll 0 0 !important; border:medium none !important; color:#DDDDDD !important; } #lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember { background:#222222 none repeat scroll 0 0 !important; border:medium none !important; color:#DDDDDD !important; } #lj_controlstrip .ljuser a b { background:transparent none repeat scroll 0 0; color:#5F5F5F; letter-spacing:0; text-decoration:none !important; } ul.taglist { padding-right:11px; } ul.taglist li { background:transparent none no-repeat scroll 0 0; border-bottom:1px solid #F5F5F5; list-style-image:none; list-style-position:outside; list-style-type:decimal-leading-zero; padding:0 3px 3px 9px; } li { background:transparent url(http://lj.irondevil.org/components/grayli.png) no-repeat scroll 0 6px; color:#555555; list-style-type:none; margin:2px 0; padding:0 0 2px 9px; } .entryLinkbar a[href="subscriptions"], .entryLinkbar a[href="tellafriend"], a[st_page="home"] { display:none; } .currents { line-height:14px; padding:10px 12px 0; } .commentHolder { background:#FFFFFF url(http://i42.tinypic.com/33ddxc7.jpg) repeat scroll 0 0; margin:18px 0; padding:10px 0 0; } .commentUserinfo { color:#EEEEEE; font-size:0; margin-right:0; margin-top:14px; text-align:center; width:143px; } .commentUserinfo .ljuser a b { color:#000000; font-family:georgia; font-size:16px; font-weight:normal; text-decoration:none !important; text-transform:lowercase; } .commentUserinfo-usericon img { background:#111111 url(http://i41.tinypic.com/16jikia.jpg) repeat scroll 50% 40%; height:80px; padding:15px; width:80px; } .commentUserinfo-usericon img:hover { background:#222222 url(http://i42.tinypic.com/2upbblt.jpg) repeat scroll 0 0; } .commentText { line-height:18px; min-height:128px; padding:15px; text-align:justify; } .commentHeader, .commentHeaderScreened { display:none; } .commentLinkbar { background:#111111 url(http://i41.tinypic.com/16jikia.jpg) repeat scroll 19% 48%; padding:11px 4px 2px; text-align:right; } .commentLinkbar ul { margin:0 0 9px; padding:0; } .commentLinkbar li { background:transparent none no-repeat scroll 0 0; display:inline; font-size:10px; text-transform:uppercase; width:17%; } .commentLinkbar a { color:#AAAAAA; } .commentLinkbar a:hover { color:#474747; text-decoration:none; } .replyform { background:#FFFFFF none repeat scroll 0 0; padding:17px; } #qrform { background:#FBFBFB none repeat scroll 0 0; border:medium none !important; color:#030505; padding:16px; } #qrform table { border:0 none !important; color:#333333; width:98%; }

how to install
select journal style	1. Apply any Smooth Sailing theme. 2. Scroll down to Choose a Page Setup and select 2 Column (sidebar on left).
display	Click Additional Options and set Entry Tags Position to After subject text in subjectbar. (Optional)
links list	Define your links. These are the links that show up under the main navigation.
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.
optional
upload images	http://i41.tinypic.com/xx7m.jpg (main bg) http://i41.tinypic.com/16jikia.jpg http://i42.tinypic.com/33ddxc7.jpg http://i42.tinypic.com/2upbblt.jpg Upload the images to a site like Tinypic or Photobucket, then replace the old URLs.
simplify the entry date	This is actually highly recommended, since the layout was designed for this format. Go to Entry Text » Format for Date and Time (Recent/Friends/Entry/Reply page) and copy one of the two date format options into the box. %%mon%% %%dd%% %%yy%% %%mm%% %%dd%% %%yy%%

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Icon by darski

read the layout faq before asking questions!

opal: the technocrats

daemon — Sat, 21 Mar 2009 21:23:58 GMT

Design inspired by Typesites.

layout notes
account types	Basic, Plus, Paid
compatible browsers	Mozilla Firefox, Opera, Safari, Google Chrome
minimum resolution	800x600
comment pages	No
navstrip	Optional
disabled	• Icons
css stylesheet
stylesheet	/--------------------------------------------------- STYLESHEET CREATOR: scythe.livejournal.com STYLESHEET NAME: The Technocrats S2 STYLE: Opal DOWNLOAD: thrashmetal.livejournal.com *Please remember to credit!** -----------------------------------------------------/ body { background:transparent url(http://i39.tinypic.com/2zhjfqo.jpg) repeat-x scroll 0 0; font-family:"lucida grande",geneva,arial,sans-serif; font-size:12px; } .border3 { margin-top:10px; } a, a:visited { color:#FFFFFF; text-decoration:none; } blockquote { background:#F2F2F2 none repeat scroll 0 0; color:#999999; padding:19px; } input, select, textarea { border:1px solid #DDDDDD; color:#222222; font-family:"lucida grande",geneva,arial,sans-serif; font-size:13px; padding:2px; } img a, a img { border-bottom:0 none; } #bodycontent { margin:0 auto; width:650px; } #headerinfo { display:none; } #header { min-height:52px; padding-bottom:30px; padding-top:15px; } #header h3 { font-family:rockwell,courier new; font-size:33px; height:54px; letter-spacing:-1px; line-height:26px; margin-left:29px; margin-top:9px; max-width:257px; overflow:hidden; position:absolute; } #userpic { display:none; } .userpic2 { display:none; } #nav { font-size:12px; margin-bottom:10px; margin-top:12px; padding-left:310px; padding-top:5px; white-space:nowrap; } #nav a { padding:1px 3px; background:#E8E8E8 none repeat scroll 0 0; color:#222222; font-size:11px; font-weight:bold; margin-right:9px; text-transform:lowercase; } #nav a:hover { background-color:#FFD200; } .columncontent { display:none; } .entryinfo { background:#181818 none repeat scroll 0 0; color:#FFFFFF; display:inline; font-family:helvetica,sans-serif; font-weight:bold; padding:6px 14px 7px 9px; } .entrylinks { background:#181818 none repeat scroll 0 0; font-family:helvetica; font-size:11px; font-weight:bold; margin-left:110px; margin-top:-25px; padding:2px 6px 3px 0; position:absolute; text-transform:lowercase; } .entrylinks a { color:#FFD200; padding:0; } .entrylinks a:hover { color:#FFFFFF; padding:0; } .entrylinks a[href="reply"], .entrylinks a[href="edittags"], .entrylinks a[href="tellafriend"], .entrylinks a[href="subscriptions"], .entrylinks a[href="memadd"] { display:none; } .systemmessage { float:right; text-align:right; text-transform:lowercase; } .systemtext { font-weight:normal; padding-left:10px; padding-right:10px; } .systemmessage a { color:#000000; margin-right:3px; padding:5px; text-decoration:none; } .systemmessage a:hover { } .systemmessage td { font-size:10px; min-width:20px; } .entry { color:#666666; line-height:23px; margin-bottom:30px; } .entrytext { text-align:justify; } .entrytext a, .entrytext a:visited { color:#000000; font-weight:bold; } .entrytext a:hover { background:#FFD200 none repeat scroll 0 0; } .subject { font-weight:bold; padding-top:2px; } .meta { font-size:11px; line-height:19px; } .meta a { text-decoration:none; } .subject a, .subject a:visited { background:#181818 none repeat scroll 0 0; border-bottom:2px solid #FFFFFF; color:#FFD200; display:block; font-size:37px; letter-spacing:-3px; padding:21px 13px; } .subject a:hover { background:#181818 none repeat scroll 0 0; border-bottom:2px solid #FFD200; color:#FFFFFF; } .systemmessage a:hover { background:#F2F2F2 none repeat scroll 0 0; } .backtop { display:none; } #cal { width:100%; } #cal a { text-decoration:none; } .calrow { clear:both; } .calempty { float:left; font-size:11px; margin:1px; padding:3px 0; width:25px; } .calactitem { } .calinitem { } .bigday { float:left; width:86px; } .notablemessage { padding:4px; } a.lj_invisible { display:none; } a.friendname { background:transparent none repeat scroll 0 0 !important; color:#FFFFFF !important; } .ljtags { background:transparent url(http://i374.photobucket.com/albums/oo181/lightmass/diags.gif) repeat-x scroll 0 0; margin-top:10px; padding-top:11px; } #lj_controlstrip { background:transparent none repeat scroll 0 0; } #lj_controlstrip_statustext { color:#999999; } #lj_controlstrip a { color:#999999; } #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic { border-right:0 none; } #lj_controlstrip_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000); display:none; } #lj_controlstrip_loggedout_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000); } #lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember, #lj_controlstrip input { background:#F2F2F2 none repeat scroll 0 0 !important; border:0 none; color:#999999 !important; opacity:0.7; } #lj_controlstrip .ljuser a b { color:#999999; font-weight:bold; text-decoration:none; } img[src="userinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/famfamfamsilk/user.png) !important; background-repeat:no-repeat !important; height:0; padding:19px 17px 0 0 !important; width:0; } img[src="openid-profile.gif"] { background-image:url(http://irondevil.org/icon/categories/famfamfamsilk/user.png) !important; background-repeat:no-repeat !important; height:0; padding:19px 17px 0 0 !important; width:0; } img[src="anonymous.gif"] { background-image:url(http://irondevil.org/icon/categories/famfamfamsilk/user.png) !important; background-repeat:no-repeat !important; height:0; padding:19px 17px 0 0 !important; width:0; } img[src="community.gif"] { background-image:url(http://irondevil.org/icon/categories/famfamfamsilk/house.png) !important; background-repeat:no-repeat !important; height:0; padding:19px 18px 0 0 !important; width:0; } img[src="partnercomm.gif"] { background-image:url(http://irondevil.org/icon/categories/famfamfamsilk/money.png) !important; background-repeat:no-repeat !important; height:0; padding:19px 18px 0 0 !important; width:0; } img[src="newsinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/famfamfamsilk/newspaper.png) !important; background-repeat:no-repeat !important; height:0; padding:19px 18px 0 0 !important; width:0; } img[src="syndicated.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2016a/01.png) !important; background-repeat:no-repeat !important; height:0; padding:19px 18px 0 0 !important; width:0; } img[src="icon_protected.gif"] { background-image:url(http://irondevil.org/icon/categories/famfamfamsilk/lock.png) !important; background-repeat:no-repeat !important; height:0; padding:16px 16px 0 0 !important; width:0; } img[src="icon_groups.gif"] { background-image:url(http://irondevil.org/icon/categories/famfamfamsilk/lock.png) !important; background-repeat:no-repeat; height:0; padding:16px 16px 0 0 !important; width:0; } img[src="icon_private.gif"] { background-image:url(http://irondevil.org/icon/categories/famfamfamsilk/key.png) !important; background-repeat:no-repeat; height:0; padding:16px 16px 0 0 !important; width:0; } div.ContextualPopup img { border:0 none; } div.ContextualPopup div.Inner { background:#FFFFFF none repeat scroll 0 0; border:medium none; color:#222222; font-family:"lucida grande",geneva,arial,sans-serif; font-size:11px; padding:7px; width:20em; } div.ContextualPopup .Content { line-height:13px; margin-right:50px; padding:2px 4px 6px; } div.ContextualPopup .Relation { font-family:helvetica; font-size:15px; margin-bottom:5px; } div.ContextualPopup .Content .OnlineStatus { font-weight:bold; } div.ContextualPopup .Userpic { } div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { color:#5F5F5F !important; font-weight:normal; text-decoration:none !important; }

how to install
select journal style	1. Apply any Opal theme.
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	N/A

read the layout faq before asking questions!

smooth sailing: a preferential alternative

daemon — Wed, 11 Mar 2009 13:35:43 GMT

Tumblr-inspired layout in two flavors.

layout notes
account types	Basic, Paid
compatible browsers	Internet Explorer 7, Mozilla Firefox, Opera, Safari, Google Chrome
minimum resolution	1024x768
comment pages	Yes
navstrip	Optional
disabled	• Some sidebar elements, tiny icons (in Modern only)
css stylesheet
pick your layout:	• A Preferential Alternative (Modern) • A Preferential Alternative (Wood)

how to install
select journal style	1. Apply any Smooth Sailing theme. 2. Scroll down to Choose a Page Setup and select 2 Column (sidebar on left).
display	1. Find Userinfo Position in Entries and set to Left side of entry text.
sidebar	Set these drop down boxes to the following: Profile Position OR Latest Month Position - 1 Links Visibility - 2 Free Text Position - 3 Hide all other Position boxes.
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.
optional
upload images	This is only applicable to the Wood layout! http://i374.photobucket.com/albums/oo181/lightmass/wood/wood5.png (main bg) http://i374.photobucket.com/albums/oo181/lightmass/wood/wood6.gif (topbar bg) Upload the images to a site like Tinypic or Photobucket, then replace the old URLs.
simplify the entry date	This is actually highly recommended, because the layout was designed for this format. Go to Entry Text » Format for Date and Time (Recent/Friends/Entry/Reply page) and copy one of the two date format options into the box. (You can view samples of each in the Modern and Wood previews, respectively.) %%mon%% %%dd%% %%yy%% %%mm%% %%dd%% %%yy%%

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Icons by parle.

read the layout faq before asking questions!

flexible squares: the red red kroovy

daemon — Mon, 02 Mar 2009 00:39:33 GMT

If I'm going to make a Flexible Squares layout, then at the very least I'll make sure it isn't generic.

Inspiration from Smashing Magazine's awesome big typography posts.

Was going to make additional color schemes, but I'm lazy and have too much school work.

Psssst. My Rorschach icon. It matches. /bored

layout notes
account types	Basic, Plus, Paid
compatible browsers	Mozilla Firefox, Safari, Google Chrome Has line height issues in IE7 and Opera, but otherwise workable.
minimum resolution	1024x768
comment pages	No
navstrip	Optional
disabled	• Entry date • All of the sidebar components except for the links list
css stylesheet
stylesheet	/--------------------------------------------------- STYLESHEET CREATOR: scythe.livejournal.com STYLESHEET NAME: The Red Red Kroovy S2 STYLE: Flexible Squares DOWNLOAD: thrashmetal.livejournal.com *Please remember to credit!** -----------------------------------------------------/ body { background-color:#F63410; color:#F1F0EC; font-family:helvetica; font-size:12px; margin:20px 0; } a, a:visited { color:#FFFFFF; } a:hover { text-decoration:none !important; } code, kbd, pre, tt { font-family:monospace; } blockquote { border-bottom:17px solid #C4290D; color:#F1F0EC; font-size:22px; letter-spacing:-1px; line-height:27px; text-align:right; } #content { margin-left:auto; margin-right:auto; margin-top:38px; width:735px; } #maincontent { } #sidebar { margin-bottom:43px; min-height:238px; } #header { margin-right:138px; } #footer { text-align:center; } div#header a, div#header a:visited { color:#C4290D; font-size:62px; font-weight:bold; letter-spacing:-7px; text-decoration:none; text-transform:uppercase; } div#header a:hover { color:#661F0C; text-decoration:none; } ul.navheader { float:right; margin:0; padding:0; text-align:left; } ul.navheader li { line-height:31px; list-style-image:none; list-style-position:outside; list-style-type:none; padding:0; } li.view { font-size:62px; font-weight:bold; letter-spacing:-7px; margin-bottom:12px; text-decoration:none; text-transform:uppercase; } .title { display:none; font-family:"Verdana",sans-serif; font-size:11px; font-weight:normal; line-height:200%; top:10px; } .subtitle { display:none; font-family:"Verdana",sans-serif; font-size:11px; font-weight:normal; top:10px; } div#sidebar a, div#sidebar a:link, div#sidebar a:visited { color:#C3290D; font-family:helvetica-light; font-size:31px; letter-spacing:-3px; text-decoration:none; text-transform:lowercase; } div#sidebar a:hover { color:#7F1C09; text-decoration:none; } .defaultuserpic { display:none; } .sbarheader { padding:0 5px; } .sbarbody { padding:0 5px; text-align:left; } .sbarbody2 { padding:0 15px; } #sidebar_summary li.sbaritem { border-bottom:1px solid #000000; margin:0 10px; padding:3px 0; } table.calendar { margin-left:auto; margin-right:auto; } .sbarcalendar { border:1px solid #000000; font-family:"Verdana",sans-serif; font-size:11px; text-align:center; } .sbarcalendarposts { background-color:#EEE293; border:1px solid #000000; font-family:"Verdana",sans-serif; font-size:11px; text-align:center; } ul.sbarlist { list-style-image:none; list-style-position:outside; list-style-type:none; padding-left:0; text-align:right; } li.sbaritem, .tagcloud { list-style-image:none; list-style-position:outside; list-style-type:none; padding-right:19px; } li.sbartitle { display:none; } .subcontent { line-height:20px; } .entry { color:#FFFFFF; font-size:11px; line-height:18px; margin-left:133px; padding:0 36px; } .entry_text { } .entry ul li { margin-left:15px; padding-left:5px; } .entry ol li { margin-left:15px; padding-left:5px; } .userpic, .userpicfriends { background:transparent none repeat scroll 0 0 !important; color:#F63410; float:left; text-align:center; } .userpic img, .userpicfriends img { border:17px solid #C4290D; } .date { color:#C4290D; display:none; font-size:10px; letter-spacing:2px; margin-right:10px; text-transform:uppercase; } .subject { display:inline; font-family:helvetica-light; font-size:37px; letter-spacing:-3px; line-height:28px; text-align:right; text-transform:lowercase; } .subject a, .subject a:link, .subject a:visited { color:#C4290D; text-decoration:none; } .subject a:hover { color:#F1F0EC; } .datesubject { padding:12px; text-align:right; } .currents strong { display:none; } .currents { color:#F1F0EC; font-family:helvetica-light; font-size:18px; letter-spacing:-1px; line-height:23px; text-transform:lowercase; } .currents a, .ljtags a { color:#F1F0EC; font-size:18px; margin-right:5px; text-decoration:none; } .ljtags { background:#C4290D url(http://irondevil.org/icon/categories/circular/tag_red.png) no-repeat scroll 5px 50%; color:#F63410; font-family:helvetica-light; font-size:0; letter-spacing:-1px; margin-bottom:1px; margin-top:21px; padding-left:23px; padding-top:5px; text-transform:lowercase; } .currentmood { background:#C4290D url(http://irondevil.org/icon/categories/circular/smiley_smile.png) no-repeat scroll 4px 50%; margin-bottom:1px; padding-bottom:5px; padding-left:23px; padding-top:1px; } .currentmusic { background:#C4290D url(http://irondevil.org/icon/categories/circular/speaker_on.png) no-repeat scroll 4px 50%; margin-bottom:1px; padding-bottom:5px; padding-left:23px; padding-top:1px; } .currentlocation { background:#C4290D url(http://irondevil.org/icon/categories/circular/world.png) no-repeat scroll 4px 50%; margin-bottom:1px; padding-bottom:5px; padding-left:23px; padding-top:1px; } .currentgroups { background:#C4290D url(http://irondevil.org/icon/categories/circular/copy.png) no-repeat scroll 4px 50%; margin-bottom:1px; padding-bottom:5px; padding-left:23px; padding-top:2px; } .comments { color:#F63410; float:right; font-size:0; margin-top:20px; } div.comments a, div.comments a:link, div.comments a:visited { color:#F1F0EC; display:block; font-size:45px; letter-spacing:-5px; margin-right:1px; padding:0 10px; text-align:right; text-decoration:none; } div.comments a:hover { background:#F63410 none repeat scroll 0 0; color:#F1F0EC; text-decoration:none; } .box { clear:left; padding:10px; } input, textarea { background-color:#C4290D; border:1px solid #C4290D; color:#661F0C; padding:3px; } textarea.textbox { width:95% !important; } ul.year { padding-bottom:40px; text-align:center; } ul.year a { color:#C4290D; text-decoration:none; } ul.year li { display:inline; font-size:33px; letter-spacing:-3px; } table.yeartable { margin-left:auto; margin-right:auto; } table.yeartable td.yeardate, table.yeartable td.yearday { background:#C4290D none repeat scroll 0 0; color:#F63410; } table.yeartable td.yearday { background:#C4290D none repeat scroll 0 0; color:#F1F0EC; text-align:center; } td.yearmonth { border-style:none; color:#F1F0EC; font-size:14px; letter-spacing:0; text-transform:uppercase; } ul.navfooter { margin:0; padding:0; } ul.navfooter li { display:inline; margin:0 5px; } .clearfoot { clear:both; } .clear { height:0; } .separator { min-height:100px; } html div.subcontent { clear:none; height:1%; } .defaultuserpic, #sidebar_calendar, .sbarbody2, #sidebar_tags, #sidebar_summary { display:none; } #sidebar_linklist { line-height:22px; padding-top:15px; width:280px; } img[src="userinfo.gif"] { display:none; } img[src="openid-profile.gif"] { display:none; } img[src="anonymous.gif"] { display:none; } img[src="community.gif"] { display:none; } img[src="partnercomm.gif"] { display:none; } img[src="newsinfo.gif"] { display:none; } img[src="syndicated.gif"] { display:none; } img[src="icon_protected.gif"] { display:none; } img[src="icon_groups.gif"] { display:none; } img[src="icon_private.gif"] { display:none; } .ljuser a b { } .ljuser a:hover b { } .userpicfriends a { color:#FFFFFF !important; font-family:helvetica-light; font-size:21px; letter-spacing:-1px; text-decoration:none; } .userpicfriends a font { color:#FFFFFF !important; } div.ContextualPopup div.Inner { background:#C4290D none repeat scroll 0 0 !important; border:medium none !important; color:#F1F0EC !important; font-family:helvetica !important; font-size:11px; } div.ContextualPopup img { border:0 none; } div.ContextualPopup .Relation { font-weight:bold !important; } div.ContextualPopup .Content .OnlineStatus { font-weight:bold; } div.ContextualPopup .Userpic { padding:8px 8px 0 0; } div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { color:#F1F0EC !important; font-family:helvetica; font-weight:normal; } #lj_controlstrip { background:black none repeat scroll 0 0; color:#515151; } #lj_controlstrip_statustext { color:#909090; } #lj_controlstrip a { color:#616161; } #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic { border-right:0 none; } #lj_controlstrip_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000); } #lj_controlstrip_loggedout_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000); } #lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember, #lj_controlstrip input { background:#111111 none repeat scroll 0 0 !important; border:0 none; color:#9C9C9C; }

how to install
select journal style	1. Apply any Flexible Squares theme. 2. Scroll down to Choose a Page Setup and select 2 Column (sidebar on left).
links list	Define your links. These are the links that will show up to the left of the main menu.
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Icon by mixremix.

read the layout faq before asking questions!

smooth sailing: ride the lightning taxicab

daemon — Fri, 20 Feb 2009 13:14:05 GMT

Old short-lived spire layout. I'm not sure when I'll have new layouts, since I'm rather busy in school right now and not in the best of emotional states. :') I'll hopefully be back soon. ♥

EDIT (February 20, 2009): Fixed a line-height bug in the metadata when displaying multiple lines of tags.

layout notes
account types	Basic, Plus, Paid
compatible browsers	Internet Explorer 7, Mozilla Firefox, Opera, Safari, Google Chrome
minimum resolution	800x600
comment pages	No
navstrip	Optional
disabled	• Entry date • Default navigation menu
css stylesheet
stylesheet	/--------------------------------------------------- STYLESHEET CREATOR: scythe.livejournal.com STYLESHEET NAME: Ride the Lightning Taxicab S2 STYLE: Smooth Sailing DOWNLOAD: thrashmetal.livejournal.com *Please remember to credit!** -----------------------------------------------------/ body { background:transparent url(http://i40.tinypic.com/fxwm05.jpg) repeat scroll 20% 0; color:#5F5F5F; font-family:lucida sans unicode,trebuchet MS,helvetica,arial; font-size:11px; margin:0; } .pageblock { margin-top:38px; position:absolute; width:100%; } a, a:visited { color:#000000; text-decoration:none; } a:hover { color:#FEF200; } a img { border:medium none; } ul { list-style-type:square; } blockquote { border-top:6px solid #FEF200; font-family:courier new; font-size:13px; line-height:17px; padding:5px 0 0; } .header-title, .header-subtitle { display:none; } .pageheaderblock { position:absolute; text-align:center; width:100%; z-index:1000; } .pagefooterblock { display:none; } .bodyblock { margin:0 auto; padding-top:212px; width:500px; } .bodyheaderblock { display:none; } .bodynavblock { font-family:georgia; font-size:11px; margin:0 33px; padding:0; } .body-title { display:none; } .body-midtitle { display:none; } .entryHolder { background:#FFFFFF url(http://i40.tinypic.com/2hxlldx.jpg) repeat scroll 0 0; border-left:medium none; margin-bottom:10px; } .entryUserinfo { margin-left:-135px; margin-top:-38px; position:absolute; text-align:left; width:120px; } .entryUserinfo-username img[src="userinfo.gif"], .entryUserinfo-username img[src="community.gif"], .entryUserinfo-username img[src="partnercomm.gif"], .entryUserinfo-username img[src="newsinfo.gif"], .entryUserinfo-username img[src="syndicated.gif"] { display:none; } .entryUserinfo-username { background:transparent none repeat scroll 0 0; font-size:11px; line-height:4px; margin-top:0; padding:4px; text-align:center; } .entryUserinfo-username .ljuser a b { background:white none repeat scroll 0 0; color:#000000; display:block; font-family:georgia; font-size:10px; font-weight:normal; letter-spacing:1px; padding:7px 0; text-decoration:none !important; text-transform:lowercase; } .entryUserinfo-username .ljuser a b:hover { background:#221E1F none repeat scroll 0 0; color:#FFFFFF; } .entryUserinfo-usericon img { background:#FFFFFF none repeat scroll 0 0; border:12px solid #FFFFFF; } .entryUserinfo-usericon img:hover { background:#221E1F none repeat scroll 0 0; border:12px solid #221E1F; } .entryText { font-family:arial; font-size:11px; line-height:15px; min-height:44px; padding:10px 16px; text-align:justify; } .entryText img { max-width:300px; } .entryHeader { min-height:20px; padding:13px 11px 4px; text-align:center; } .entryHeader a { color:#5F5F5F; font-family:helvetica; font-size:17px; letter-spacing:2px; text-transform:lowercase; } .entryHeader a:hover { text-decoration:none; } .entryHeaderDate { display:none; text-decoration:none; } .entryHeaderSubject { font-size:0; padding-top:3px; } .entryMetadata { font-family:arial; line-height:10px; margin-bottom:0; padding:10px 38px; } .entryMetadata a, .entryMetadata a:visited { font-size:8px; text-transform:uppercase; } .entryMetadata a:hover { border-bottom:0 none; color:#AAAAAA; text-decoration:none; } .entryMetadata ul { margin:0; padding:0; } .entryMetadata li { background:transparent none repeat scroll 0 0; color:#221E1F; display:block; font-size:9px; list-style-image:none; list-style-position:outside; list-style-type:none; padding-right:10px; padding-bottom:0; } .entryMetadata-label { font-family:helvetica; font-size:10px; font-weight:bold; padding-right:4px; text-transform:uppercase; } .entryLinkbar { background:#F9F9F9 none repeat scroll 0 0; color:#000000; font-size:12px; margin-left:0; margin-top:0; padding:5px 10px; text-align:right; text-transform:lowercase; } .entryLinkbar:hover { background:transparent none repeat scroll 0 0; } .entryLinkbar a { background:transparent none repeat scroll 0 0; color:#AAAAAA; font-family:georgia; font-size:9px; font-weight:normal; letter-spacing:1px; margin-left:10px; padding:0; text-transform:lowercase; } .entryLinkbar a:hover { color:#222222; text-decoration:none; } .entryLinkbar ul { margin:0; } .entryLinkbar li { background:transparent none repeat scroll 0 0; display:inline; margin:0; padding:0; } .yearlinks { text-align:right; } .yearlink { padding-left:4px; padding-right:4px; } .month { background:transparent none repeat scroll 0 0; font-family:century gothic; font-size:10px; margin:10px auto; padding:4px; width:421px; } .daysubjects { font-family:georgia; font-size:12px; padding:8px 8px 11px 40px; } .daytitles { color:black; font-family:georgia; font-size:17px; text-align:center; text-transform:lowercase; } .day-blank { } .day { padding:3px; } .day-date { font-family:arial; text-align:center; width:90%; } .day-count { float:right; font-size:20px; text-align:center; width:50%; } .day-count a { font-family:georgia; font-size:19px; font-weight:normal; padding:4px; text-decoration:none; } .sidebar { background:#FFFFFF none repeat scroll 0 0; height:152px; padding-top:50px; position:absolute; top:0; width:500px; } .sidebar a, .sidebar a:visited { } .sidebar a:hover { text-decoration:none; } .sidebox { float:left; margin:0 auto; padding:5px 0 8px; } .sideboxTitle { display:none; } .sideboxContent { background:transparent none repeat scroll 0 0; font-family:arial; font-size:9px; line-height:14px; margin-left:3px; text-align:justify; width:142px; } .sidebox #freetext { height:122px; margin-left:22px; margin-top:-10px; padding:10px 14px; position:absolute; text-align:justify; width:251px; } .sidebox #freetext2 { line-height:4px; margin-left:309px; margin-top:-11px; padding:10px 9px; position:absolute; width:140px; } .sidebox #freetext2 a { border-bottom:1px solid #F2F2F2; color:#5F5F5F; display:block; font-family:helvetica; font-size:11px; padding:5px 0 4px 4px; text-transform:lowercase; } .sidebox #freetext2 a:hover { background:#F9F9F9 none repeat scroll 0 0; color:#222222; } .sidebox #systemlinks { display:inline; font-size:10px; padding:17px 16px 5px; position:absolute; text-align:left; top:0; width:475px; } .sidebox #systemlinks a:link, .sidebox #systemlinks a:active, .sidebox #systemlinks a:visited { color:#000000; font-family:georgia; font-size:20px; letter-spacing:3px; text-transform:lowercase; } .sidebox #systemlinks a:hover, .sidebox #systemlinks a:active { text-decoration:none; } .listitem { display:inline; margin-right:6px; } .listspacer { height:1px; } .sidebox #latestmonth table { margin-left:auto; margin-right:auto; margin-top:4px; width:90%; } .listtitle { display:none; } .profile-label { font-weight:bold; } .header-menu { display:none; margin:0 auto; text-align:center; width:609px; } .header-menu a, .header-menu a:visited { color:#906018; font-family:century gothic,georgia; font-size:10px; font-weight:normal; letter-spacing:3px; margin-right:12px; text-align:left; text-decoration:none; text-transform:uppercase; white-space:nowrap; } .header-menu a:hover { color:#784818; } #footer-menu { font-size:11px; margin-bottom:10px; margin-left:0; text-align:center; } #footer-menu a, .footer-menu a:visited { background:white none repeat scroll 0 0; font-family:georgia; font-size:11px; letter-spacing:1px; padding:7px; text-align:left; text-transform:lowercase; white-space:nowrap; } #footer-menu a:hover { text-decoration:none; } .header-menu ul, #footer-menu ul { margin:0; padding:0; } .header-menu li, #footer-menu li { background:transparent none no-repeat scroll 0 0; display:inline; } .tagstable, .tagstable td { border:0 none; } textarea, input, select { background:white none repeat scroll 0 0; border:1px solid #F2F2F2; color:#6F6F6F; font-family:georgia; font-size:12px; line-height:normal; margin:2px; padding:2px; } .ljuser a b { background:transparent none repeat scroll 0 0; color:#000000; font-family:georgia; font-weight:normal; letter-spacing:0; text-decoration:none !important; } .ljuser a { text-decoration:none !important; } .ljuser a:hover b { border-bottom:0 none; text-decoration:none !important; } img[src="userinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/36.png) !important; background-repeat:no-repeat !important; height:0; padding:13px 12px 0 0 !important; width:0; } img[src="community.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010c/47.png) !important; background-repeat:no-repeat !important; height:0; padding:13px 11px 0 0 !important; width:0; } img[src="partnercomm.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010c/47.png) !important; background-repeat:no-repeat !important; height:0; padding:13px 11px 0 0 !important; width:0; } img[src="newsinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010b/28.png) !important; background-repeat:no-repeat !important; height:0; padding:13px 11px 0 0 !important; width:0; } img[src="syndicated.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/01.png) !important; background-repeat:no-repeat !important; height:0; padding:13px 11px 0 0 !important; width:0; } img[src="icon_protected.gif"] { background-image:url(http://irondevil.org/icon/categories/pixelgraphix%20clean/lock-16.png) !important; background-repeat:no-repeat !important; height:0; margin-left:3px; margin-top:0; padding:16px 17px 0 0 !important; width:0; } img[src="icon_groups.gif"] { background-image:url(http://irondevil.org/icon/categories/pixelgraphix%20clean/lock-16.png) !important; background-repeat:no-repeat !important; height:0; margin-left:3px; margin-top:0; padding:16px 17px 0 0 !important; width:0; } img[src="icon_private.gif"] { background-image:url(http://irondevil.org/icon/categories/pixelgraphix%20clean/lock-16.png) !important; background-repeat:no-repeat !important; height:0; margin-left:3px; margin-top:0; padding:16px 17px 0 0 !important; width:0; } div.ContextualPopup img { border:0 none; } div.ContextualPopup div.Inner { background:white none repeat scroll 0 0; border:medium none; color:#222222; font-family:arial; font-size:10px; padding:0; width:20em; } div.ContextualPopup .Content { line-height:11px; margin-right:50px; padding:2px 4px 6px; } div.ContextualPopup .Relation { font-weight:normal !important; font-size:20px; font-family:georgia; margin-bottom:5px; } div.ContextualPopup .Content .OnlineStatus { font-weight:bold; } div.ContextualPopup .Userpic { padding:8px 8px 0 0; } div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { color:#5F5F5F !important; font-family:arial; font-weight:normal; text-decoration:none !important; } #lj_controlstrip { background:#FFFFFF url(http://i40.tinypic.com/2hxlldx.jpg) repeat scroll 0 0; color:black; } #lj_controlstrip td { border-bottom:medium none; color:#784818; } #lj_controlstrip_statustext { color:black; } #lj_controlstrip a { color:#222222; } #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic { border-right:0 none; } #lj_controlstrip_login td { border-bottom:0 none; } #lj_controlstrip td td { border-bottom:0 none; } #lj_controlstrip_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000); } #lj_controlstrip_loggedout_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000); } #lj_controlstrip input { background:#F2F2F2 none repeat scroll 0 0 !important; color:#222222 !important; opacity:0.5 !important; } #lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember { background:#F2F2F2 none repeat scroll 0 0 !important; color:#222222 !important; opacity:0.5 !important; } #lj_controlstrip .ljuser a b { background:transparent none repeat scroll 0 0; color:#000000; letter-spacing:0; text-decoration:none !important; } ul.taglist { padding-right:22px; } ul.taglist li { border-bottom:1px solid #F5F5F5; padding:0 3px 3px 9px; } li { background:transparent url(http://lj.irondevil.org/components/grayli.png) no-repeat scroll 0 4px; color:#8E8E8E; list-style-type:none; margin:2px 0; padding:0 0 5px 11px; } .entryLinkbar a[href="subscriptions"], .entryLinkbar a[href="tellafriend"] { display:none; }

how to install
select journal style	1. Apply any Smooth Sailing theme. 2. Scroll down to Choose a Page Setup and select 2 Column (sidebar on left).
display	Make sure Userinfo Position in Entries is set to Left side of the entry text.
sidebar	Set these drop down boxes to the following: Links Visibility - 1 Free Text Position - 2 Free Text #2 Position - 3 Hide all other Position boxes. In Free Text Sidebox #2 Text, enter your links like so: <a href="URL">TEXT</a> <a href="URL">TEXT</a> <a href="URL">TEXT</a> <a href="URL">TEXT</a> <a href="URL">TEXT</a> <a href="URL">TEXT</a>
links list	Define your links. These are the links that show up at the top of the topbar.
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.
optional
upload images	http://i40.tinypic.com/fxwm05.jpg (main bg) http://i40.tinypic.com/2hxlldx.jpg (entry bg) Upload the images to a site like Tinypic or Photobucket, then replace the old URLs.

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Icon by puncture • Entry bg by mixremix

read the layout faq before asking questions!

smooth sailing: it's gametime

daemon — Tue, 17 Feb 2009 00:58:12 GMT

After Joystiq put up its new layout, I was enamored with the colors, so here we are. :)

The layout will also stretch/shrink to fit your browser!

EDIT (9:08pm EST): Fixed a bug where the latest month calendar would flow out of the topbar.

layout notes
account types	Basic, Plus, Paid
compatible browsers	Mozilla Firefox, Opera, Safari, Google Chrome Will work in IE, but not without some display issues.
minimum resolution	800x600
comment pages	Yes
navstrip	Optional
disabled	• Page summary, search and tags boxes.
css stylesheet
stylesheet	/--------------------------------------------------- STYLESHEET CREATOR: scythe.livejournal.com STYLESHEET NAME: It's Gametime S2 STYLE: Smooth Sailing DOWNLOAD: thrashmetal.livejournal.com *Please remember to credit!** -----------------------------------------------------/ body { background:#1787CC url(http://i40.tinypic.com/51ajqd.jpg) repeat scroll 0 0; color:#333333; font-family:arial,sans-serif; font-size:12px; margin:0; } .pageblock { margin-top:80px; position:absolute; width:100%; } a, a:visited { color:#4580FF; text-decoration:none; } a:hover { color:#8F8F8F; text-decoration:underline; } a img { border:medium none; } ul { list-style-type:square; } blockquote { background:#F7F7F7 none repeat scroll 0 0; font-family:georgia; font-size:14px; padding:10px; } .header-title { display:none; } .header-subtitle { display:none; } .pageheaderblock { position:absolute; text-align:center; width:100%; z-index:1000; } .pagefooterblock { display:none; } .pagefooterblock a, .pagefooterblock a:visited { color:#E92E20; } .bodyblock { margin:0 auto; min-width:760px; padding-top:257px; width:70%; } .bodyheaderblock { display:none; } .bodynavblock { font-size:12px; margin:0 33px; padding:0; } .bodynavblock a, .bodynavblock a:visited { } .body-title, .body-midtitle { display:none; } .entryHolder { background:#FFFFFF none repeat scroll 0 0; border-left:medium none; margin-bottom:10px; } .entryUserinfo { margin-left:21px; margin-top:16px; text-align:center; } .entryUserinfo-username img[src="userinfo.gif"], .entryUserinfo-username img[src="community.gif"], .entryUserinfo-username img[src="news.gif"], .entryUserinfo-username img[src="partnercomm.gif"], .entryUserinfo-username img[src="syndicated.gif"] { background-image:none; height:0; padding:0 !important; width:0; } .entryUserinfo-username { background:transparent none repeat scroll 0 0; font-size:11px; line-height:18px; margin-top:0; padding:4px; } .entryUserinfo-username .ljuser a b { font-size:18px; letter-spacing:-1px; text-decoration:none; } .entryUserinfo-usericon img { background:#222222 none repeat scroll 0 0; border:12px solid #222222; } .entryText { color:#444444; line-height:22px; min-height:50px; padding:10px 30px 12px 17px; text-align:justify; } .entryHeader { border-top:30px solid #0C0C0C; line-height:15px; padding:13px 21px 0; } .entryHeader a { color:#222222; font-family:arial; font-size:25px; font-weight:bold; letter-spacing:-1px; text-transform:lowercase; } .entryHeader a:hover { text-decoration:underline; } .entryHeaderDate { color:#CCCCCC; display:block; font-family:georgia; font-size:15px; font-style:italic; } .entryHeaderSubject { font-size:0; padding-top:3px; } .entryMetadata { font-size:11px; margin-bottom:0; padding:5px 48px 18px; } .entryMetadata a, .entryMetadata a:visited { color:#333333; text-decoration:underline; } .entryMetadata a:hover { text-decoration:none; } .entryMetadata ul { margin:0; padding:0; } .entryMetadata li { background:transparent none repeat scroll 0 0; display:block; list-style-image:none; list-style-position:outside; list-style-type:none; padding-right:10px; } .entryMetadata-label { font-weight:bold; padding-right:4px; text-transform:uppercase; } .entryLinkbar { background:#F7F7F7 none repeat scroll 0 0; color:#000000; font-size:12px; padding:6px 0 7px; text-align:right; text-transform:lowercase; } .entryLinkbar:hover { } .entryLinkbar a { background:#111111 none repeat scroll 0 0; color:#AAAAAA; font-size:11px; font-weight:bold; padding:7px 12px; text-transform:lowercase; } .entryLinkbar a:hover { background:#F79F08 none repeat scroll 0 0; color:#222222; text-decoration:none; } .entryLinkbar ul { margin:0; } .entryLinkbar li { background:transparent none repeat scroll 0 0; display:inline; margin:0 0 0 3px; padding:0; } .yearlinks { text-align:right; } .yearlink { padding-left:4px; padding-right:4px; } .month { background:transparent none repeat scroll 0 0; margin:10px auto; padding:4px; width:421px; } .daysubjects { font-size:12px; padding:8px 8px 11px 40px; } .daytitles { color:black; font-family:georgia; font-size:17px; text-align:center; text-transform:lowercase; } .day-blank { } .day { background:#F2F2F2 none repeat scroll 0 0; border:1px solid #FFFFFF; padding:3px; } .day-date { font-family:arial; font-size:10px; text-align:center; width:50%; } .day-count { float:right; font-size:20px; text-align:center; width:50%; } .day-count a { font-family:arial; font-size:19px; font-weight:normal; padding:4px; text-decoration:none; } .sidebar { background:#F7F7F7 none repeat scroll 0 0; border-top:24px solid #0C0C0C; height:196px; min-width:760px; position:absolute; top:26px; width:70%; } .sidebox { float:left; margin:11px 10px 0 0; max-height:155px; width:32%; } .sideboxTitle { background:#FAA906 none repeat scroll 0 0; border-bottom:2px solid #DDDDDD; color:#974F02; font-weight:bold; margin-bottom:4px; margin-left:10px; padding:4px 7px; } .sideboxContent { background:transparent none repeat scroll 0 0; font-family:arial; font-size:12px; padding-left:10px; text-align:justify; } .sidebox #profile { font-size:10px; } .sidebox #profile .ljuser a b { font-size:20px; } img.profile-userpic { background:#222222 none repeat scroll 0 0; border:12px solid #222222; float:left; margin-right:10px; } .sidebox #profile img[src="userinfo.gif"], .sidebox #profile img[src="community.gif"] { display:none; } .profile-content { display:block; font-size:12px; margin-left:135px; } .profile-label { display:none; } .sidebox #freetext, .sidebox #freetext2, .sidebox #freetext3 { line-height:19px; text-align:justify; } .sidebox #latestmonth { font-size:9px; text-align:justify; } .latestmonth-inactive { background:#F2F2F2 none repeat scroll 0 0; border:1px solid #F7F7F7; height:20px; min-width:27px; padding-left:4px; } .latestmonth-active { background:#EEEEEE none repeat scroll 0 0; border:1px solid #F7F7F7; height:20px; min-width:28px; padding-left:4px; } .sidebox #latestmonth table { margin:auto; } .sidebox #systemlinks { font-size:11px; line-height:18px; text-align:left; top:0; } .sidebox #systemlinks a:link, .sidebox #systemlinks a:active, .sidebox #systemlinks a:visited { color:#333333; font-weight:bold; text-transform:lowercase; } .sidebox #systemlinks a:hover, .sidebox #systemlinks a:active { text-decoration:none; } .sidebox #search, .sidebox #tags_sidebox, sidebox #summary { display:none; } .listitem { border-bottom:1px solid #CCCCCC; padding:3px; } .listitem:hover { background:#EEEEEE none repeat scroll 0 0; } .listspacer { height:1px; } .listtitle { display:none; } .header-menu { margin:0 auto; min-width:760px; text-align:left; width:70%; } .header-menu a, .header-menu a:visited { background:#222222 none repeat scroll 0 0; color:#CCCCCC; font-size:10px; font-weight:bold; margin-right:0; padding:8px 10px 12px; text-align:left; text-decoration:none; text-transform:uppercase; white-space:nowrap; } .header-menu a:hover { border-bottom:3px solid #FFA500; color:#FFFFFF; } #footer-menu { margin-bottom:18px; margin-left:0; margin-top:19px; text-align:center; } #footer-menu a, .footer-menu a:visited { color:#111111; margin-right:4px; padding:7px; text-align:left; text-transform:lowercase; white-space:nowrap; } #footer-menu a:hover { text-decoration:none; } .header-menu ul { margin:2px 0 0; padding:0; } #footer-menu ul { margin:0; padding:0; } .header-menu li { background:transparent none repeat scroll 0 0; display:inline; margin:0; padding:0; } #footer-menu li { background:transparent none repeat scroll 0 0; display:inline; padding:0; } .tagstable, .tagstable td { border:0 none; } textarea, input, select { background:white none repeat scroll 0 0; border:1px solid #E6E6E6; color:#6F6F6F; font-family:georgia; font-size:12px; line-height:normal; margin:2px; padding:2px; } textarea:focus, input:focus, select:focus { border:1px solid #CCCCCC; } .ljuser a b { background:transparent none repeat scroll 0 0; color:#333333; font-weight:bold; letter-spacing:0; text-decoration:underline; } .ljuser a { text-decoration:none !important; } .ljuser a:hover b { border-bottom:0 none; text-decoration:none !important; } img[src="userinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/36.png) !important; background-repeat:no-repeat !important; height:0; padding:14px 12px 0 0 !important; width:0; } img[src="community.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010c/47.png) !important; background-repeat:no-repeat !important; height:0; padding:14px 11px 0 0 !important; width:0; } img[src="partnercomm.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010c/47.png) !important; background-repeat:no-repeat !important; height:0; padding:14px 11px 0 0 !important; width:0; } img[src="newsinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010b/28.png) !important; background-repeat:no-repeat !important; height:0; padding:14px 11px 0 0 !important; width:0; } img[src="syndicated.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/01.png) !important; background-repeat:no-repeat !important; height:0; padding:14px 11px 0 0 !important; width:0; } img[src="openid-profile.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/02.png) !important; background-repeat:no-repeat !important; height:0; padding:14px 11px 0 0 !important; width:0; } img[src="anonymous.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010d/10.png) !important; background-repeat:no-repeat !important; height:0; padding:14px 11px 0 0 !important; width:0; } img[src="icon_protected.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue/lock.png) !important; background-repeat:no-repeat !important; height:0; margin-left:3px; margin-top:0; padding:16px 18px 0 0 !important; width:0; } img[src="icon_groups.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue/lock.png) !important; background-repeat:no-repeat !important; height:0; margin-left:3px; margin-top:0; padding:16px 18px 0 0 !important; width:0; } img[src="icon_private.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue/key.png) !important; background-repeat:no-repeat !important; height:0; padding:16px 18px 0 0 !important; width:0; } div.ContextualPopup img { border:0 none; } div.ContextualPopup div.Inner { background:white none repeat scroll 0 0; border:medium none; color:#222222; font-family:arial; font-size:11px; padding:0; width:20em; } div.ContextualPopup .Content { line-height:15px; margin-right:50px; padding:10px; } div.ContextualPopup .Relation { color:#222222; display:block; font-size:22px; font-weight:bold !important; letter-spacing:-1px; margin-bottom:3px; } div.ContextualPopup .Content .OnlineStatus { font-weight:bold; } div.ContextualPopup .Userpic { padding:8px 8px 0 0; } div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { color:#111111 !important; font-weight:normal; text-decoration:none !important; } #lj_controlstrip { background:#0C0C0C none repeat scroll 0 0; color:#FFFFFF; } #lj_controlstrip td { border-bottom:medium none; } #lj_controlstrip_statustext { color:#FFFFFF; } #lj_controlstrip a { color:#CCCCCC; } #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic { border-right:0 none; } #lj_controlstrip_login td { border-bottom:0 none; } #lj_controlstrip td td { border-bottom:0 none; } #lj_controlstrip_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000); } #lj_controlstrip_loggedout_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000); } #lj_controlstrip input { background:#222222 none repeat scroll 0 0 !important; border:medium none !important; color:#CCCCCC !important; } #lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember { background:#222222 none repeat scroll 0 0 !important; border:medium none; color:#CCCCCC !important; } #lj_controlstrip .ljuser a b { background:transparent none repeat scroll 0 0; color:#FFFFFF; letter-spacing:0; text-decoration:none !important; } ul.taglist { padding-right:22px; } ul.taglist li { border-bottom:1px solid #F0F0F0; padding:0 3px 1px 9px; } li { background:transparent url(http://lj.irondevil.org/components/grayli.png) no-repeat scroll 0 9px; list-style-type:none; margin:2px 0; padding:0 8px; } .commentHolder { background:#FFFFFF none repeat scroll 0 0; margin:18px 0; padding:14px 20px; } .commentUserinfo { color:#FFFFFF; font-size:0; margin-right:15px; text-align:center; } .commentUserinfo .ljuser a b { font-size:18px; text-decoration:none; } .commentUserinfo-usericon img { background:#222222 none repeat scroll 0 0; border:12px solid #222222; } .commentText { color:#444444; line-height:22px; padding:10px; text-align:justify; } .commentHeader, .commentHeaderScreened { color:#CCCCCC; font-family:georgia; font-size:14px; font-style:italic; margin-bottom:9px; } .commentHeaderSubject { color:#444444; font-family:arial; font-size:20px; font-style:normal; font-weight:bold; letter-spacing:-1px; } .commentLinkbar { text-align:right; } .commentLinkbar ul { background:transparent none repeat scroll 0 0 !important; margin:0; padding:0; } .commentLinkbar li { background:transparent none repeat scroll 0 0; display:inline; margin-right:12px; padding:0; } .commentLinkbar a { color:#111111; font-size:11px; text-transform:lowercase; } .commentLinkbar a:hover { color:#474747; text-decoration:none; } .replyform { background:#FFFFFF none repeat scroll 0 0; padding:15px; } #qrform { background:#FBFBFB none repeat scroll 0 0; color:#030505; } #qrform table { border:medium none !important; }

how to install
select journal style	1. Apply any Smooth Sailing theme. 2. Scroll down to Choose a Page Setup and select 2 Column (sidebar on left).
display	Set Wrap Entry text under userinfo to No.
sidebar	You may arrange up to 3 of the following boxes in any order: Profile Position Latest Month Position Links Visibility Free Text Hide all other Position boxes.
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.
optional
upload images	http://i40.tinypic.com/51ajqd.jpg Upload the images to a site like Tinypic or Photobucket, then replace the old URLs.

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	N/A

read the layout faq before asking questions!

smooth sailing: iconic

daemon — Tue, 10 Feb 2009 20:46:14 GMT

I haven't had any inspiration for layouts lately, so I apologize if this is somewhat subpar. I designed this for icon journals/comms so they could display sample icons in the header. :)

EDIT(4/2/09): I removed the code that automatically hides the unnecessary bits of the sidebar, because people were getting confused and thinking that they didn't need to go into Customize Your Theme and hide it manually.

layout notes
account types	Basic, Plus, Paid
compatible browsers	Internet Explorer 7, Mozilla Firefox, Opera, Safari, Google Chrome
minimum resolution	800x600
comment pages	Yes
navstrip	Optional
disabled	• Default navigation menu • Latest month, search, summary, tags, and profile in sidebar • Tiny icons
css stylesheet
stylesheet	/--------------------------------------------------- STYLESHEET CREATOR: scythe.livejournal.com STYLESHEET NAME: Iconic S2 STYLE: Smooth Sailing DOWNLOAD: thrashmetal.livejournal.com *Please remember to credit!** -----------------------------------------------------/ body { background:#151515 none repeat scroll 0 0; color:#4F4F4F; font-family:helvetica,arial; font-size:11px; margin:0; } .pageblock { padding-bottom:12px; position:absolute; width:100%; } a, a:visited { color:#9F9F9F; letter-spacing:0; text-decoration:none; } a:hover { color:#949494; } a img { border:medium none; } ul { } li { background:transparent url(http://lj.irondevil.org/components/grayli.png) no-repeat scroll 0 7px; list-style-type:none; margin:2px 0; padding:0 0 0 11px; } blockquote { background:#181818 none repeat scroll 0 0; color:#4F4F4F; font-family:helvetica; padding:11px; } .header-title, .header-subtitle { display:none; } .header-icon { border-bottom:2px solid #F6F6BB; border-left:2px solid #F6F6BB; position:absolute; right:0; top:0; z-index:1; } .pageheaderblock { } .pagefooterblock { display:none; } .bodyblock { margin:0 auto; padding-top:275px; width:500px; } .bodyheaderblock { display:none; padding:6px 0; } .bodynavblock { color:#AAAAAA; margin:0; padding:0; } .body-title { display:none; } .body-midtitle { display:none; } .entryHolder { background:#111111 none repeat scroll 0 0; font-size:11px; margin-bottom:20px; width:500px; } .entryUserinfo { margin-left:-101px; margin-top:-40px; position:absolute; width:90px; } .entryUserinfo-username { line-height:18px; margin-right:6px; max-width:130px; padding:2px 0 0; text-align:right; } .entryUserinfo-username .ljuser a b { background:transparent none repeat scroll 0 0; font-size:12px; font-weight:normal; letter-spacing:0; text-decoration:none !important; } .entryUserinfo-usericon img { background:#111111 none repeat scroll 0 0; border:15px solid #111111; cursor:auto !important; height:70px; width:70px; } .entryText { font-size:11px; line-height:18px; min-height:100px; padding:1px 22px 14px; text-align:justify; } .entryText img { max-width:455px; } .entryHeader { border-bottom:1px solid #151515; line-height:17px; margin-bottom:13px; min-height:24px; padding:12px 0 5px 16px; text-align:left; text-transform:lowercase; } .entryHeader a { color:#949494; font-size:16px; font-weight:bold; text-transform:lowercase; } .entryHeader a:hover { } .entryHeaderSubject { color:white; font-size:0; } .entryHeaderDate { display:block; font-size:10px; letter-spacing:1px; margin-right:5px; text-align:left; text-transform:uppercase; z-index:10; } .entryMetadata { margin-bottom:0; padding:0 12px 25px; } .entryMetadata a, .entryMetadata a:visited { font-size:9px; text-transform:lowercase; } .entryMetadata a:hover { border-bottom:0 none; text-decoration:none; } .entryMetadata ul { margin:0; padding:0; } .entryMetadata li { background:transparent none repeat scroll 0 0; display:block; font-size:9px; list-style-image:none; list-style-position:outside; list-style-type:none; margin:0; padding-right:10px; } .entryMetadata-label { font-family:helvetica; font-size:10px; font-weight:bold; padding-right:4px; text-transform:uppercase; } .entryLinkbar { background:#151515 none repeat scroll 0 0; padding:4px 7px 8px 0; position:relative; text-align:right; text-transform:lowercase; top:0; } .entryLinkbar a { background:transparent none repeat scroll 0 0; font-size:10px; font-weight:normal; margin-right:8px; padding:0; text-transform:lowercase; } .entryLinkbar a:hover { } .entryLinkbar a[href="subscriptions"], .entryLinkbar a[href="tellafriend"] { display:none; } .entryLinkbar ul { margin-bottom:0 !important; margin-left:0 !important; margin-top:0 !important; padding:0; } .entryLinkbar li { background:transparent none repeat scroll 0 0; display:inline; margin:0; padding:0; } .commentHolder { background:#030505 none repeat scroll 0 0; border-left:0 none; margin:19px 0 0; } .commentHolder { background:#111111 none repeat scroll 0 0; border-left:0 none; margin:19px 0 0; } .commentUserinfo { background:transparent none repeat scroll 0 0; color:#C3C3C3; font-size:0; line-height:19px; margin-left:-101px; margin-right:2px; margin-top:-13px; padding-right:2px; position:absolute; text-align:center; } .commentUserinfo .ljuser a b { background:transparent none repeat scroll 0 0; font-size:12px; letter-spacing:0; text-decoration:none !important; } .commentUserinfo-usericon img { border:15px solid #111111; cursor:auto; height:70px; width:70px; } .commentUserinfo-usericon img:hover { } .commentText { background:#111111 none repeat scroll 0 0; line-height:19px; min-height:133px; padding:10px 21px; text-align:justify; } .commentHeader, .commentHeaderScreened { background:#111111 none repeat scroll 0 0; border-bottom:1px solid #151515; padding:13px; text-transform:lowercase; } .commentLinkbar { background:#151515 none repeat scroll 0 0; color:#878787; font-size:11px; text-align:right; } .commentLinkbar ul { margin:0; padding:0; } .commentLinkbar li { background:transparent none repeat scroll 0 0; color:#AAAAAA; display:inline; margin:0; padding:0 5px; } .commentLinkbar a:hover { text-decoration:none; } .commentLinkbar a { background:transparent none repeat scroll 0 0; color:#AAAAAA; font-size:10px; font-weight:normal; padding:0; text-transform:lowercase; } .replyform { line-height:16px; padding:20px; } .replyform textarea { max-width:396px; } #qrform { } #qrform table { border:medium none !important; } .yearlinks { text-align:right; } .yearlink { padding-left:4px; padding-right:4px; } .month { background:transparent none repeat scroll 0 0; margin:10px auto; width:479px; } .daysubjects { color:#434343; padding:8px 8px 8px 40px; } .daytitles { border:1px solid white; color:#FF4546; font-family:courier new; font-size:17px; text-align:center; text-transform:lowercase; } .day-blank { } .day { background:white none repeat scroll 0 0; border:1px solid white; margin-bottom:0; padding:3px; } .day-date { color:#000501; font-family:arial; text-align:center; width:58px; } .day-count { float:right; font-size:20px; text-align:center; width:50%; } .day-count a { font-family:georgia; font-weight:normal; padding:3px; text-decoration:none; } .sidebar { background:#111111 none repeat scroll 0 0; height:232px; line-height:19px; margin:0 auto; padding-top:16px; position:absolute; text-align:center; top:21px; width:500px; } .sidebox { color:#CCCCCC; margin-bottom:0; margin-right:auto; margin-top:0; text-align:justify; } .sideboxTitle { display:none; } .sideboxContent { } .sidebox #freetext { color:#222222; font-size:10px; line-height:13px; margin-bottom:3px; text-align:center; } .sidebox #freetext img { border:23px solid #181818; margin:0 5px; opacity:0.7; } .sidebox #freetext img:hover { opacity:1; } .sidebox #freetext2 { color:#4F4F4F; font-family:arial; font-size:9px; line-height:13px; padding:0 22px; text-align:justify; } .sidebox #systemlinks { line-height:19px; padding:0 15px; text-align:right; } .sidebox #systemlinks a:link, .sidebox #systemlinks a:active, .sidebox #systemlinks a:visited { color:#6F6F6F; font-size:11px; letter-spacing:1px; margin-right:7px; text-transform:lowercase; } .sidebox #systemlinks a:hover, .sidebox #systemlinks a:active { color:#9F9F9F; } .listitem { display:inline; } .listspacer { height:10px; } .sidebox #latestmonth table { margin-left:auto; margin-right:auto; margin-top:4px; width:90%; } .listtitle { display:none; } .header-menu { display:none; } #footer-menu { text-align:center; } #footer-menu a { background:#111111 none repeat scroll 0 0; color:#444444; padding:7px; text-transform:lowercase; } #footer-menu ul { margin:0 auto; padding:0; width:500px; } #footer-menu li { background:transparent none repeat scroll 0 0; display:inline; list-style-image:none; list-style-position:outside; list-style-type:none; margin-right:-2px; padding:0; } .tagstable, .tagstable td { border:0 none; } .tagstable { width:100%; } .taglist { padding-bottom:10px; } textarea, input, select { background:#181818 none repeat scroll 0 0; border:0 none; color:#949494; font-family:courier new; font-size:12px; line-height:normal; margin:2px; } .ljuser a b { background:transparent none repeat scroll 0 0; font-family:helvetica; font-weight:normal; letter-spacing:0; text-decoration:none !important; } .ljuser a { text-decoration:none !important; } .ljuser a:hover b { background:transparent none repeat scroll 0 0; border-bottom:0 none; text-decoration:none !important; } img[src="userinfo.gif"] { height:0; width:0; } img[src="openid-profile.gif"] { height:0; width:0; } img[src="anonymous.gif"] { height:0; width:0; } img[src="community.gif"] { height:0; width:0; } img[src="partnercomm.gif"] { height:0; width:0; } img[src="newsinfo.gif"] { height:0; width:0; } img[src="syndicated.gif"] { height:0; width:0; } img[src="icon_protected.gif"] { background-image:url(http://irondevil.org/icon/categories/circular/padlock_closed.png) !important; background-position:0 2px; background-repeat:no-repeat !important; height:0; padding:18px 21px 0 0 !important; width:0; } img[src="icon_groups.gif"] { background-image:url(http://irondevil.org/icon/categories/circular/padlock_closed.png) !important; background-position:0 2px; background-repeat:no-repeat !important; height:0; padding:18px 21px 0 0 !important; width:0; } img[src*="icon_private.gif"] { background-image:url(http://irondevil.org/icon/categories/circular/cancel.png) !important; background-position:0 2px; background-repeat:no-repeat !important; height:0; padding:18px 21px 0 0 !important; width:0; } div.ContextualPopup img { border:0 none; } div.ContextualPopup div.Inner { background:transparent none repeat scroll 0 0 !important; border:0 none; color:#9F9F9F !important; font-family:helvetica; font-size:11px; padding:0; width:23em; } div.ContextualPopup .Content { background:#181818 none repeat scroll 0 0; line-height:1.4; margin-right:81px; padding:10px; } div.ContextualPopup .Relation { font-size:18px; font-weight:bold !important; letter-spacing:-1px; } div.ContextualPopup .Content .OnlineStatus { font-weight:bold; } div.ContextualPopup .Userpic { border:10px solid #181818; margin-left:11px; padding:0; } div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { color:#5F5F5F !important; font-weight:normal; text-decoration:none !important; } #lj_controlstrip { background:#111111 none repeat scroll 0 0; } #lj_controlstrip td { border-bottom:medium none; border-right:1px solid #151515; color:#4F4F4F; } #lj_controlstrip_statustext { color:#9F9F9F; } #lj_controlstrip a { color:#4F4F4F; } #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic { border-right:0 none; } #lj_controlstrip_login td { border-bottom:0 none; } #lj_controlstrip td td { border-bottom:0 none; } #lj_controlstrip_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000); } #lj_controlstrip_loggedout_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000); } #lj_controlstrip input { background:#181818 none repeat scroll 0 0 !important; border:medium none; color:#9F9F9F !important; } #lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember { background:#181818 none repeat scroll 0 0 !important; border:medium none; color:#9F9F9F !important; } #lj_controlstrip .ljuser a b { background:transparent none repeat scroll 0 0; letter-spacing:0; text-decoration:none !important; }

how to install
select journal style	1. Apply any Smooth Sailing theme. 2. Scroll down to Choose a Page Setup and select 2 Column (sidebar on left).
display	Set Userinfo Position in Entries to Left side of the entry text.
sidebar	1. Set these drop down boxes to the following: Links Visibility - 2 Free Text Position - 1 Free Text #2 Position - 3 Hide all other Position boxes. 2. Find Free Text Sidebox Text and paste in this code, replacing the `URL`'s with the URLs of the icons you want to display: <img src="URL"> <img src="URL"> <img src="URL"> IMPORTANT! Please note that if you do not place this code in the very first Free Text box available, the borders will not show up. 3. Enter your free text in Free Text Sidebox #2 Text. This holds about 40 words.
links list	Define your links. These are the links that show up directly beneath the icons.
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.
optional
add a fourth icon	Find and replace all instances of `width:500px;` with `width:660px;`, then add the extra icon in Free Text Sidebox Text.
return the entry icon to 100x100	Find .entryUserinfo-usericon img and delete `height:70px;` and `width:70px;`. Now find .entryUserinfo and change the `margin-left` value to -131px.

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Entry icon by puncture.

read the layout faq before asking questions!

profile: good mourning, black friday

daemon — Sat, 07 Feb 2009 16:33:25 GMT

This profile is fluid width and should stretch/shrink to fit your browser.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis nisi lacus, luctus eget, lacinia quis, mollis quis, nisi. Nulla tempor augue at ipsum.

Vestibulum cursus, nisl in euismod ullamcorper, nibh turpis nonummy tortor, a suscipit ligula massa ac quam. Sed urna velit, feugiat sed, fringilla ut, tincidunt quis, orci. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

link 1 link 2 profile code

Etiam elementum sem a dui. Vestibulum pharetra, urna sed imperdiet sagittis, quam ipsum dapibus purus, non pretium velit odio non risus. Donec id ante. Phasellus eu elit vitae urna pretium viverra.

Duis vestibulum tristique lacus. Etiam et quam non risus convallis ultrices. Cras viverra purus sed ipsum. Quisque mi lacus, volutpat vitae, consequat sit amet, sagittis eget, tortor. Fusce ligula arcu, tempor vel, condimentum rhoncus, sagittis condimentum, erat.

link 1 link 2 link 3

<table cellspacing="20" cellpadding="5" background="http://lj.irondevil.org/components/wood/wood2.jpg" align="center" width="80%" height="150"> <tr> <td><table cellpadding="20" cellspacing="15"><tr valign="top"><td bgcolor="#111" width="50%"><font face="georgia" size="1" color="#ccc"><div align="justify">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis nisi lacus, luctus eget, lacinia quis, mollis quis, nisi. Nulla tempor augue at ipsum.

Vestibulum cursus, nisl in euismod ullamcorper, nibh turpis nonummy tortor, a suscipit ligula massa ac quam. Sed urna velit, feugiat sed, fringilla ut, tincidunt quis, orci. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

<div align="center"><font face="georgia" size="1"><A HREF="URL"><font color="#8f8f8f"><u>link 1</font></U></A>    <A HREF="URL"><font color="#8f8f8f"><u>link 2</font></U></A>    <A HREF="http://thrashmetal.livejournal.com"><font color="#ccc"><u>profile code</font></U></A></font></div></td> <td bgcolor="#111" width="50%"><font face="georgia" size="1" cellpadding="5" color="#ccc"><div align="justify">Etiam elementum sem a dui. Vestibulum pharetra, urna sed imperdiet sagittis, quam ipsum dapibus purus, non pretium velit odio non risus. Donec id ante. Phasellus eu elit vitae urna pretium viverra.

Duis vestibulum tristique lacus. Etiam et quam non risus convallis ultrices. Cras viverra purus sed ipsum. Quisque mi lacus, volutpat vitae, consequat sit amet, sagittis eget, tortor. Fusce ligula arcu, tempor vel, condimentum rhoncus, sagittis condimentum, erat.

How do I install profile codes?

smooth sailing: visual bookmark

daemon — Sun, 01 Feb 2009 03:00:38 GMT

A layout based off of We Heart It's design.

UPDATE (11:48pm EST): Removed some leftover code that did weird things to the Free Text.

layout notes
account types	Basic, Plus, Paid
compatible browsers	Internet Explorer 7, Mozilla Firefox, Opera, Safari, Google Chrome
minimum resolution	800x600
comment pages	Yes
navstrip	Optional
disabled	N/A
css stylesheet
stylesheet	/--------------------------------------------------- STYLESHEET CREATOR: scythe.livejournal.com STYLESHEET NAME: Visual Bookmark S2 STYLE: Smooth Sailing DOWNLOAD: thrashmetal.livejournal.com *Please remember to credit!** -----------------------------------------------------/ body{color:#333; font-family:arial; font-size:12px; margin:0} textarea, input, select{background:#FFF none repeat scroll 0 0; border:1px solid #CCC; color:#333; font-size:12px; line-height:19px; padding:2px 3px} a, a:visited{color:#F06; text-decoration:none} a img{border:medium none} li{background:transparent url(http://lj.irondevil.org/components/grayli.png) no-repeat scroll 0 7px; color:#8E8E8E; list-style-type:none; margin:5px 0; padding:0 0 0 11px} blockquote{background:#333 none repeat scroll 0 0; color:#F2F2F2; padding:15px} .header-title{color:#333; font-family:helvetica; font-size:53px; font-weight:bold; letter-spacing:-4px} .header-title:first-letter{color:#F06} .header-subtitle{color:#666; font-size:9px; letter-spacing:1px; margin-left:18px; margin-top:-9px; text-transform:uppercase} .pagefooterblock{display:none} .bodyblock{margin:0 auto; padding-top:20px; width:780px} .bodynavblock{color:#AAA; margin:0 33px; padding:0} .body-title{display:none} .body-midtitle{border-top:1px solid #CCC; color:#FFF; font-size:0; padding-top:4px} .entryHolder{border-left:1px solid #CCC; border-right:1px solid #CCC; border-top:1px solid #CCC; color:#333; font-size:12px; line-height:17px} .entryUserinfo{margin:0 13px 0 18px} .entryUserinfo-username{margin-top:6px; text-align:center} .entryUserinfo-username .ljuser a b{color:#333} .entryUserinfo-usericon img{border:10px solid #333} .entryText{padding:0 22px; text-align:justify} .entryText img{max-width:300px} .entryHeader{border-bottom:0 none; color:#666; font-size:20px; line-height:17px; padding:28px 22px 11px; text-transform:lowercase} .entryHeader a{color:#666; font-size:20px} .entryHeaderSubject{font-size:0} .entryHeaderDate{color:#D8D8D8; display:block; float:right; font-size:10px; margin-top:-14px; position:absolute; text-align:right; text-transform:uppercase} .entryMetadata{font-size:11px; line-height:11px; margin-bottom:0; padding:14px} .entryMetadata a, .entryMetadata a:visited{text-transform:lowercase} .entryMetadata ul{margin:0; padding:0} .entryMetadata li{background:transparent none repeat scroll 0 0; color:#666; list-style-image:none; list-style-position:outside; list-style-type:none; padding-right:10px} .entryMetadata-label{font-weight:bold; padding-right:4px; text-transform:lowercase} .entryLinkbar{background:#EEE none repeat scroll 0 0; color:#000; margin:15px 15px 10px; padding:4px 11px; text-align:right; text-transform:lowercase} .entryLinkbar a{color:#666; font-size:11px; margin-left:12px} .entryLinkbar ul{margin-bottom:0 !important; margin-left:0 !important; margin-top:0 !important; padding:0} .entryLinkbar li{background:transparent none repeat scroll 0 0; display:inline; margin:0; padding:0} .yearlinks{text-align:right} .yearlink{padding-left:4px; padding-right:4px} .month{background:transparent none repeat scroll 0 0; margin:13px auto; padding:0 0 12px; width:420px} .daysubjects{padding:0 8px 10px 40px} .daytitles{border:1px solid #FFF; color:#333; font-size:14px; text-align:center; text-transform:lowercase} .day{background:#E6E6E6 none repeat scroll 0 0; border:1px solid #FFF; margin-bottom:0; padding:3px} .day-date{font-family:arial; font-size:10px; text-align:center; width:50%} .day-count{float:right; font-size:20px; text-align:center; width:50%} .day-count a{font-family:helvetica,arial; font-size:19px; font-weight:normal; padding:3px} .sidebar{font-size:11px; margin-left:20px; width:230px} .sidebox{border:1px solid #CCC; line-height:18px; margin-bottom:20px; margin-right:auto; margin-top:0; padding:15px; text-align:justify} .sideboxTitle{color:#666; font-size:20px; margin-bottom:9px; text-transform:lowercase} .sidebox #profile{min-height:53px; padding:0 9px} .sidebox #profile .ljuser a b{color:#666; font-size:20px; font-weight:normal; text-transform:lowercase} .sidebox #profile img[src="userinfo.gif"], .sidebox #profile img[src="community.gif"]{background:transparent none repeat scroll 0 0 !important; height:0; padding:0 !important; width:0} .sidebox #profile img.profile-userpic{float:left; height:50px; margin-right:10px; width:50px} .profile-label{display:none} .profile-content{line-height:20px; text-transform:uppercase} .sidebox #latestmonth table{margin-left:auto; margin-right:auto; margin-top:4px; padding-bottom:10px; width:90%} .sidebox #latestmonth a{text-transform:lowercase} .latestmonth-inactive{background:#EEE none repeat scroll 0 0; border:1px solid #FFF; color:#AAA; font-size:9px; height:24px; padding-left:2px; width:24px} .latestmonth-active{background:#EEE none repeat scroll 0 0; border:1px solid #FFF; height:24px; padding-left:2px; text-align:left; width:24px} .latestmonth-active:hover, .latestmonth-inactive:hover{background:#E2E2E2 none repeat scroll 0 0} .latestmonth-active a{font-size:9px} .sidebox #systemlinks a:link, .sidebox #systemlinks a:active, .sidebox #systemlinks a:visited{font-size:18px} .listtitle{color:#666; font-size:20px; text-transform:lowercase} .pageheaderblock{margin:65px auto 0; width:780px} .header-menu{margin-top:15px} .header-menu a{color:#CCC; font-size:13px; text-transform:lowercase} #footer-menu{border-top:1px solid #CCC; margin:0; padding:0 0 10px; text-align:right} #footer-menu a, .footer-menu a:visited{margin-right:8px; text-transform:lowercase} #footer-menu ul{margin:10px 0 0; padding:0} #footer-menu li{background:transparent none repeat scroll 0 0; display:inline; padding:0} .header-menu ul{background:#333 none repeat scroll 0 0; margin:0 auto; padding:6px} .header-menu li{background:transparent none repeat scroll 0 0; display:inline; list-style-image:none; list-style-position:outside; list-style-type:none; margin-right:11px} .taglist{padding-bottom:10px} .ljuser a b{background:transparent none repeat scroll 0 0; letter-spacing:0} img[src="userinfo.gif"]{background-image:url(http://irondevil.org/icon/categories/diagona%2010a/05.png) !important; background-repeat:no-repeat !important; height:0; padding:15px 11px 0 0 !important; width:0} img[src="openid-profile.gif"]{background-image:url(http://irondevil.org/icon/categories/diagona%2010b/15.png); background-repeat:no-repeat !important; height:0; padding:16px 11px 0 0 !important; width:0} img[src="anonymous.gif"]{background-image:url(http://irondevil.org/icon/categories/diagona%2010c/50.png); background-repeat:no-repeat !important; height:0; padding:15px 11px 0 0 !important; width:0} img[src="community.gif"]{background-image:url(http://irondevil.org/icon/categories/diagona%2010a/45.png) !important; background-repeat:no-repeat !important; height:0; padding:15px 11px 0 0 !important; width:0} img[src="partnercomm.gif"]{background-image:url(http://irondevil.org/icon/categories/diagona%2010a/41.png); background-repeat:no-repeat !important; height:0; padding:14px 12px 0 0 !important; width:0} img[src="newsinfo.gif"]{background-image:url(http://irondevil.org/icon/categories/diagona%2010b/28.png); background-repeat:no-repeat !important; height:0; padding:14px 12px 0 0 !important; width:0} img[src="syndicated.gif"]{background-image:url(http://irondevil.org/icon/categories/diagona%2010a/01.png); background-repeat:no-repeat !important; height:0; padding:15px 12px 0 0 !important; width:0} img[src="icon_protected.gif"]{background-image:url(http://irondevil.org/icon/categories/fugue/lock.png) !important; background-repeat:no-repeat !important; height:0; padding:16px 18px 0 0 !important; width:0} img[src="icon_groups.gif"]{background-image:url(http://irondevil.org/icon/categories/fugue/lock.png) !important; background-repeat:no-repeat; height:0; padding:16px 18px 0 0 !important; width:0} img[src="icon_private.gif"]{background-image:url(http://irondevil.org/icon/categories/fugue/key.png) !important; background-repeat:no-repeat; height:0; padding:17px 18px 0 0 !important; width:0} div.ContextualPopup img{border:0 none} div.ContextualPopup div.Inner{background-color:#F9F9F9 !important; border:medium none; color:#A0A0A0 !important; font-family:arial; font-size:10px; padding:7px; width:20em} div.ContextualPopup .Content{line-height:1.4; margin-right:50px; padding:2px 4px 6px} div.ContextualPopup .Relation{font-weight:bold !important} div.ContextualPopup .Content .OnlineStatus{font-weight:bold} div.ContextualPopup .Userpic{padding:8px 8px 0 0} div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited{color:#5F5F5F !important; font-weight:normal} .entryLinkbar a[href="subscriptions"], .entryLinkbar a[href="tellafriend"]{display:none} #lj_controlstrip{background:transparent none repeat scroll 0 0 !important} #lj_controlstrip_statustext{color:#333} #lj_controlstrip a{color:#333} #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic{border-right:0 none} #lj_controlstrip_userpic{background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000)} #lj_controlstrip_loggedout_userpic{background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000)} #lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember, #lj_controlstrip input{background:transparent none repeat scroll 0 0 !important; border:0 none; color:#F06 !important} .commentHolder{border:1px solid #CCC; color:#666; margin:18px 0; padding:23px 5px 0; text-align:justify} .commentUserinfo{font-size:0; line-height:20px; padding-left:13px; text-align:center} .commentUserinfo .ljuser a b{color:#333; font-size:12px} .commentUserinfo-usericon img{border:10px solid #333} .commentText{line-height:18px; padding:0 14px} .commentHeader{display:none} .commentHeaderScreened{display:none} .commentLinkbar{text-align:right} .commentLinkbar ul{margin:0 0 7px; padding:0} .commentLinkbar li{background:transparent none repeat scroll 0 0; display:inline} .commentLinkbar a{font-size:11px; text-transform:lowercase} .replyform{color:#333; padding:20px 40px} #qrform table{border:medium none !important} #qrform input[type="submit"], .replyform input[type*="submit"]{background:#F06; border:0 none; color:#FFF; font-size:11px; font-weight:bold; text-transform:lowercase}

how to install
select journal style	a. Apply any Smooth Sailing theme. b. Scroll down to Choose a Page Setup and select 2 Column (sidebar on right).
display	Scroll down to Wrap Entry text under userinfo and set the dropdown box to Yes.
custom css	Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.
optional
change the pink	Don't like pink? Neither do I. Simply paste the code into a text editor and Replace (CTRL+H) `#F06` with the color of your choice.
hide the title/subtitle	Find `.header-title` or `.header-subtitle` and add `display:none;` to the code.

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Icon by maylene.

read the layout faq before asking questions!

smooth sailing: ashes in your mouth

daemon — Mon, 19 Jan 2009 15:00:15 GMT

Another layout I made for a personal journal.

EDIT: Added a light version. :) And fixed a line-height bug with the sidebar links.

layout notes
account types	Basic, Plus, Paid
compatible browsers	Internet Explorer 7, Mozilla Firefox, Opera, Safari, Google Chrome
minimum resolution	1024x768
comment pages	Yes
navstrip	Optional
disabled	• Default navigation (Recent, Friends, Archive etc) • Search, page summary, and profile in the sidebar
css stylesheet
pick your layout:	• Ashes in Your Mouth (dark) • Ashes in Your Mouth (light)

how to install
select journal style	Apply any Smooth Sailing theme.
sidebar	a. Click Sidebar. Set these drop down boxes to the following: Links Visibility - 1 Free Text Position - 2 Free Text #2 Position - 3 Latest Month Position and Tags Sidebox Position - Optional; arrange these wherever Hide all other Position boxes. b. Scroll down to Free Text Sidebox Text. This is where you put in the code for the smaller links. <a href="URL">LINK1 TEXT</a> <a href="URL">LINK2 TEXT</a> <a href="URL">LINK3 TEXT</a>
links list	Define your links. These are the big links in the sidebar.
custom css	Click Custom CSS. Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.
optional
upload images	http://i43.tinypic.com/efgunt.gif (dark) http://i42.tinypic.com/6zple9.gif (light) Upload the images to a site like Tinypic or Photobucket, then replace the old URLs.
entry date format	Go to Entry Text » Page » Format for Date and Time (Recent/Friends/Entry/Reply page) and paste in the following: %%month%% %%dayord%%, %%yyyy%%

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Icons by puncture and infectedframe

read the layout faq before asking questions!

profile: static discharge

daemon — Sun, 18 Jan 2009 14:34:58 GMT

Ooooh man I haven't hand coded tables since I first attempted webdesign on fucking Neopets. :'D But after hearing a bunch of you say that's what you normally do, I decided to give those table coding skills a polish.

This layout is rudimentary and not that fancy, but hey. :F It's fluid width and should stretch/shrink to fit your browser.

static discharge.

link 1 link 2 profile code

<table cellspacing="30" cellpadding="10" background="http://i39.tinypic.com/28lz3nc.gif" align="center" width="60%" height="150"> <tr> <td bgcolor="#ffffff"><div align="right"><font face="georgia" size="6" color="#5f5f5f">YOUR TITLE HERE</font>    </div> <table><tr valign="top"><td><font face="courier new" size="2" cellpadding="5" color="#8C8C8C"><div align="justify">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis nisi lacus, luctus eget, lacinia quis, mollis quis, nisi. Nulla tempor augue at ipsum.

<div align="center"><font face="georgia" size="1"><A HREF="URL"><font color="#8C8C8C"><u>link 1</font></U></A>    <A HREF="URL"><font color="#8C8C8C"><u>link 2</font></U></A>    <A HREF="http://thrashmetal.livejournal.com"><font color="#8C8C8C"><u>profile code</font></U></A></font></div></td></tr></table> </td></tr></table>

How do I install profile codes?

tutorial: smooth sailing topbars

daemon — Sun, 18 Jan 2009 13:50:33 GMT

NOTE: Before you begin reading, please note that this is an advanced tutorial, and you should not attempt doing any of the below with your layout unless you are comfortable with CSS.

Also, if you simply want to grab the code and get out of here, see the Appendixes to each section. I've written out every step so the interested can fully understand what the code does. See the Smooth Sailing Customization Guide for more info.

PART A: Basic Topbar

Step 1: Reposition the Sidebar
Step 2: Resizing and Fixing It Up
Step 3: Reorganizing the Page
Step 4: Resolving Navstrip Issues
Appendix: Topbar Code

PART B: Multi-Column Topbar

Step 1: Setting it Up
Step 2: Making the Columns
Appendix: Multi-Column Topbar Code

PART A: Basic Topbar

This tutorial is for creating a basic topbar like this. I recommend starting here if you haven't tried an SS topbar before.

Step 1: Reposition the Sidebar
The default Smooth Sailing layout looks like this. If you strip the CSS from it, notice that the sidebar remains. This is because the sidebar is "built" into the layout using HTML tables; we cannot move it to the top of the layout without "lifting" it out of its current position and repositioning it. This does have some drawbacks, which I will cover later.

Find .sidebar and add position: absolute;. If you aren't using a base stylesheet, type in the following:
.sidebar { position: absolute; }
The layout will look like this now:

This is the "lifting" part. Now we need to change the width and height so it's more appropriate for a topbar.

(return to top)

Step 2: Resizing and Fixing It Up
Go to .sidebar again and add these two lines:
height:150px; width:700px;
I also added background:red; and cleared the background from .sidebox so we can see what changes we're making. My layout looks like this now:

As you can see, all of the sidebar elements are flowing out of the bottom. This, unfortunately, is a side-effect of repositioning the SS sidebar as a topbar. Go to Sidebar in the customization area and hide most of the boxes. For now, I'm opting to hide everything but a block of Free Text.

Now we need to move the other elements of the page to make room for the topbar.

(return to top)

Step 3: Reorganizing the Page
First, we need to fully split the topbar from everything else. Return to .sidebar and insert top: 10px;.

Now I'll shrink and center the layout. (This is just personal preference, you don't necessarily have to do this.) Find .bodyblock and add these lines:
width:700px; margin: 0 auto;

Shifting everything down is the next step.
Go back to .sidebar and change the top value to 130px.
Find .bodyblock and add padding-top:175px;. Delete any other padding selectors.
Now I'll change the red background to something a little more eye-pleasing, and we should have this:

(return to top)

Step 4: Resolving Navstrip Issues
Wondering what I'm talking about? Here's an example. The above code is not Navstrip-compatible and when the Navstrip is turned on, it will appear like this. On the other hand, if you code the topbar to compensate for the Navstrip, and turn the Navstrip off, it will look like this. This will inevitably happen due to the position: absolute;.

If you're altering a layout for personal use, you probably won't have to worry about the Navstrip or lack thereof, depending on your preference. You can also simply disable the Navstrip for everyone using your layout; click here for a good tutorial. However, if keep in mind that this might be an inconvenience for people who do use the Navstrip (like myself). This part of the tutorial will show you how to make the topbar compatible with and without the Navstrip.

We'll start with the code built on a Navstrip-less topbar layout (you can find this code below). Add the following to your CSS:
.pageblock { position:absolute; width:100%; }
Now go back to Display and turn the Navstrip on and off. The layout should move all as one piece. :)

(return to top)

Appendix: Topbar Code
This is all the code you need to make a topbar. Remember to hide the Sidebar boxes if you don't want everything flowing out the bottom.
.sidebar { background:#D4DDEE; height:150px; position:absolute; top:130px; width:700px; } .bodyblock { margin:0 auto; padding-top:175px; width:700px; }

.sidebar { background:#D4DDEE; height:150px; position:absolute; top:130px; width:700px; } .bodyblock { margin:0 auto; padding-top:175px; width:700px; }

(return to top)

PART B: Multi-Column Topbar

This tutorial creates a multi-column topbar like this and is based off the code explained in Part A.

Step 1: Setting it Up
In this tutorial, I will be making a three-column topbar. That said, I first need to go to Sidebar and pick two other items for my topbar -- I chose to show the Links List and Latest Month modules along with my Freetext from Part A.

(return to top)

Step 2: Making the Columns
Add the following code (or append it to your existing .sidebox rule, if applicable):
.sidebox { background:#F8F8F8; float:left; margin-right:5px; width:220px; height:140px; }

This lines up the modules in 220px-wide boxes. The height keeps the boxes at an even height, otherwise they'd look more like this.

(return to top)

Appendix: Multi-Column Topbar Code
.sidebar { background:#D4DDEE; height:150px; position:absolute; top:130px; width:700px; } .bodyblock { margin:0 auto; padding-top:175px; width:700px; } .sidebox { background:#F8F8F8; float:left; margin-right:5px; width:220px; height:140px; }

.sidebar { background:#D4DDEE; height:150px; position:absolute; top:130px; width:700px; } .bodyblock { margin:0 auto; padding-top:175px; width:700px; } .sidebox { background:#F8F8F8; float:left; margin-right:5px; width:220px; height:140px; }

(return to top)

tranquility ii: i ain't superstitious

daemon — Thu, 15 Jan 2009 18:01:17 GMT

A request layout for tsurashi313.

EDIT: Slightly darkened the entry/comments text, removed some extraneous code.

layout notes
account types	Basic, Plus, Paid
compatible browsers	Mozilla Firefox, Opera, Safari, Google Chrome It doesn't break in IE7, but the metadata is skewed to the right.
minimum resolution	800x600
comment pages	Yes
navstrip	Optional
disabled	N/A
css stylesheet
stylesheet	/--------------------------------------------------- STYLESHEET CREATOR: scythe.livejournal.com STYLESHEET NAME: I Ain't Superstitious S2 STYLE: Tranquility II DOWNLOAD: thrashmetal.livejournal.com *Please remember to credit!** -----------------------------------------------------/ body { background:#D9D9D9 none repeat scroll 0 0; color:#999999; font-family:arial; font-size:11px; line-height:18px; text-align:center; } blockquote { background:#F7F7F7 none repeat scroll 0 0; color:#BBBBBB; font-family:georgia; font-size:10px; padding:10px; } a, a:visited { color:#69B1FF; font-size:100%; text-decoration:none; } a:hover { color:#BFDEFF; text-decoration:none; } a img { border:medium none; } a.comm { background:transparent url(http://stat.livejournal.com/img/community.gif) no-repeat scroll 0 0; padding-bottom:7px; padding-left:19px; } a.user { background:transparent url(http://stat.livejournal.com/img/userinfo.gif) no-repeat scroll 0 0; padding-bottom:7px; padding-left:19px; } p { margin:5px; padding:5px; } form { display:inline; margin:0; padding:0; } input, select, textarea { background:#F7F7F7 none repeat scroll 0 0; border:1px solid #DDDDDD; color:#AAAAAA; font-family:georgia; font-size:12px; margin:3px; padding:2px; } #container { margin:0 auto; padding-top:20px; position:relative; text-align:left; width:650px; } #header { border:medium none; } #header h1 { color:#DDDDDD; display:none; font-family:georgia; font-size:37px; font-weight:normal; letter-spacing:-3px; margin-bottom:7px; margin-left:8px; margin-top:0; padding:0; text-align:center; text-transform:lowercase; } #menu { background:#F0F0F0 none repeat scroll 0 0; color:#333333; line-height:16px; margin-bottom:15px; padding:0 0 10px; position:relative; text-align:center; width:650px; } #content { margin-left:160px; position:relative; } #entries { border:0 none; padding:0; } ul#lj-links { background:#404040 none repeat scroll 0 0; margin:0; padding:20px 0 16px; } ul#user-links { font-family:georgia !important; margin:0; padding:10px 0 0; } ul#user-links li { display:inline; } #user-links a { color:#B0B0B0 !important; font-family:georgia !important; font-size:10px !important; letter-spacing:2px !important; margin-right:5px; text-transform:uppercase !important; } ul#lj-summary { display:none; margin:0; padding:0; } #menu h2 { display:none; } #menu h2.userpic { } #menu a { color:#69B1FF; font-family:arial; font-size:24px; font-weight:normal; letter-spacing:-2px; margin-right:8px; text-transform:lowercase; } #menu a:visited { color:#69B1FF; text-decoration:none; } #menu a:hover { color:#D9D9D9; } #menu ul { line-height:13px; list-style-image:none; list-style-position:outside; list-style-type:none; padding-left:15px; } #menu ul li { display:inline; list-style-image:none; list-style-position:outside; list-style-type:none; margin-bottom:0; padding-bottom:11px; } #content h2 { background:#404040 none repeat scroll 0 0; border-left:117px solid #C7C7C7; color:#F0F0F0; font-family:arial; font-size:26px; font-weight:normal; letter-spacing:-2px; margin:0 !important; padding:15px 15px 15px 10px; text-transform:lowercase; } li.active { color:#6E6E6E; font-family:arial; font-size:24px; font-weight:normal; letter-spacing:-2px; margin-right:8px; text-transform:lowercase; } #entries, #comments { margin:0; } .ind-entry { background:#F0F0F0 none repeat scroll 0 0; border-bottom:0 none; margin-bottom:12px; } .ind-entry h3 img, .ind-comment-one h3 img, .ind-comment-two h3 img, .ind-comment-screened h3 img { float:left; padding:5px; position:relative; } h3.userpic { } h3.userpic img { background:#E4E4E4 none repeat scroll 0 0; border:11px solid #C7C7C7; height:75px; padding:10px; width:75px; } .ind-entry h2 { color:#424242; font-family:georgia; font-weight:normal; letter-spacing:0; margin-left:11px !important; text-transform:lowercase; } .ind-comment-one h4, .ind-comment-two h4, .ind-comment-screened h4 { background:#404040 none repeat scroll 0 0; border-left:117px solid #C7C7C7; color:#F0F0F0; font-family:arial; font-size:9px; font-weight:normal; line-height:14px; margin-bottom:0; margin-right:0; margin-top:0; min-height:69px; padding:0 0 0 10px; text-align:left; } .ind-entry h4 { background:#404040 none repeat scroll 0 0; border-left:117px solid #C7C7C7; color:#F0F0F0; font-family:arial; font-size:9px; font-weight:normal; line-height:14px; margin-bottom:0; margin-right:0; margin-top:0; min-height:69px; padding:0 0 0 10px; text-align:left; } .ind-entry h4 .ljuser a b, .ind-comment-one h4 .ljuser a b, .ind-comment-two h4 .ljuser a b { color:#F0F0F0; } .ind-entry h4 a, .ind-entry h4 a:visited { color:#AAAAAA; text-decoration:none; } h4 { background:#F0F0F0 none repeat scroll 0 0; padding:15px; } .ind-entry div.entry-item { border-left:117px solid #E4E4E4; font-family:arial; font-size:11px; line-height:20px; padding:10px; text-align:justify; } .ind-entry div.month-entries { margin-left:22px; padding-bottom:3px; } .ind-entry div.entry-item a { border-bottom:medium none; color:#222222; text-decoration:none; } .ind-entry div.month-entries a { } .ind-entry div.entry-item a:hover { color:#5F5F5F; } .ind-comment-one h4 a, .ind-comment-two h4 a { } .ind-comment-one, .ind-comment-two, .ind-comment-screened { margin:10px 0; } .ind-comment-one, .ind-comment-two { background-color:#F0F0F0; border-bottom:0 none; font-family:arial; } .ind-comment-screened { background-color:#EFF8E3; opacity:0.7; } .ind-comment-one h2, .ind-comment-two h2 { color:#B4B4B4; font-size:18px; font-style:normal !important; margin-bottom:0; } .ind-comment-one div.entry-item, .ind-comment-two div.entry-item { font-family:arial; font-size:11px; line-height:20px; padding:9px 15px; text-align:justify; } .ind-comment-screened h2 { color:#999999; margin:20px 0; } .month-entries { margin:5px 0; } .month-entries ul { list-style-image:none; list-style-position:outside; list-style-type:none; margin:10px; } .month-entries ul li { list-style-image:none; list-style-position:outside; list-style-type:none; padding:3px; } .ljtaglist { background:#F0F0F0 none repeat scroll 0 0; padding:16px 31px; } .ljtaglist ul li { border-bottom:1px solid gray; } #footer { font-size:11px; position:relative; } #footer b, #footer strong { } #footer p { padding:20px; } #footer a, #footer a:visited { color:#B5B5B5; font-size:100%; font-weight:bold; text-transform:uppercase; } #footer a:hover, #footer a:visited:hover, #footer a:active { color:#B5B5B5; } #content { margin-left:0; } .ljtags { color:#404040; font-family:georgia; font-size:11px; margin-bottom:-6px; margin-left:10px; margin-top:20px; text-transform:lowercase; } .entry-form { background:#F0F0F0 none repeat scroll 0 0; padding:13px; } .entry-form h2 { display:none; } .ljuser a b { background:transparent none repeat scroll 0 0; color:#858585; font-family:georgia; font-weight:normal; letter-spacing:0; text-decoration:none !important; } .ljuser a:hover b { background:transparent none repeat scroll 0 0; border-bottom:0 none; text-decoration:none !important; } img[src="userinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/06.png) !important; background-repeat:no-repeat !important; height:0; padding:15px 11px 0 0 !important; width:0; } img[src="openid-profile.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/06.png) !important; background-repeat:no-repeat !important; height:0; padding:15px 11px 0 0 !important; width:0; } img[src="anonymous.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/37.png) !important; background-repeat:no-repeat !important; height:0; padding:15px 11px 0 0 !important; width:0; } img[src="community.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/45.png) !important; background-repeat:no-repeat !important; height:0; padding:15px 11px 0 0 !important; width:0; } img[src="partnercomm.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/45.png) !important; background-repeat:no-repeat !important; height:0; padding:15px 11px 0 0 !important; width:0; } img[src="newsinfo.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010b/28.png) !important; background-repeat:no-repeat !important; height:0; padding:15px 11px 0 0 !important; width:0; } img[src="syndicated.gif"] { background-image:url(http://irondevil.org/icon/categories/diagona%2010a/01.png) !important; background-repeat:no-repeat !important; height:0; padding:15px 11px 0 0 !important; width:0; } img[src="icon_protected.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue/lock.png) !important; background-repeat:no-repeat; height:0; padding:19px 14px 0 0 !important; width:0; } img[src="icon_groups.gif"] { background-image:url(http://irondevil.org/icon/categories/fugue/lock.png) !important; background-repeat:no-repeat; height:0; padding:19px 14px 0 0 !important; width:0; } img[src*="icon_private.gif"] { background-image:url(http://irondevil.org/icon/categories/famfamfamsilk/eye.png) !important; background-repeat:no-repeat; height:0; padding:17px 17px 0 0 !important; width:0; } a.Link { display:none; } a.comments { font-size:16px !important; line-height:63px; text-transform:lowercase; } a[title="Edit Entry"], a[title="Edit Tags"], a[title="Add to Memories"], a[title="Tell a Friend"], a[title="Track This"], a[title="Flag"] { text-transform:lowercase; } h4 b a { font-size:23px !important; } #qrform table { border:medium none !important; } div.ContextualPopup img { border:0 none; } div.ContextualPopup div.Inner { background:#f7f7f7 !important; border-bottom:2px solid #f2f2f2; color:#5A5A5A !important; font-family:arial; font-size:11px; padding:0; width:20em; border-right:2px solid #f2f2f2; border-left:0; border-top:0; } div.ContextualPopup .Content { line-height:1.4; margin-right:50px; padding:2px 4px 6px; } div.ContextualPopup .Relation { font-weight:bold !important; } div.ContextualPopup .Content .OnlineStatus { font-weight:bold; } div.ContextualPopup .Userpic { padding:8px 8px 0 0; } div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { color:#69B1FF !important; font-weight:normal; text-decoration:none !important; } #lj_controlstrip { background:#F0F0F0 none repeat scroll 0 0; color:#515151; } #lj_controlstrip_statustext { color:#858585; } #lj_controlstrip a { color:#B0B0B0; } #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic { border-right:0 none; } #lj_controlstrip_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000); } #lj_controlstrip_loggedout_userpic { background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000); } #lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember, #lj_controlstrip input { background:#F9F9F9 none repeat scroll 0 0 !important; border:0 none; color:#CCCCCC !important; } #lj_controlstrip .ljuser a b { font-family:arial !important; font-weight:bold; }

how to install
select journal style	Apply any Tranquility II theme.
links list	Define your links. These are the gray links that show up under the main navigation.
custom css	Click Custom CSS. Make sure any drop-down boxes are set to No, paste the code into the box, and click Save Changes.
optional
display userpic	Display » Additional Options » Display your userpic with your entries and set to "Yes".

appendix
credit and comment	• Please credit spire somewhere public. (Profile, Links List, Friends Only post, etc.) • Comments aren't required, but are appreciated!
resources	• Icon by puncture.

read the layout faq before asking questions!