smooth sailing: visual bookmark

[daemon]

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).

displayScroll 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 pinkDon'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/subtitleFind .header-title or .header-subtitle and add display:none; to the code.

appendix

credit and comment
• Please credit thrashmetal 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!