smooth sailing - ice whites
Smooth Sailing
Best Resolution: 1024x768
Tested Browsers: Firefox 2.0, Internet Explorer
Custom Comments Page?: Yes
Custom Calendar?: Yes
Custom Tags Page?: No
Custom Icons: LJ user, LJ community
(preview on a non-widescreen monitor set to 1024x768)
view larger | live preview | (+comments page)
♣ s2 smooth sailing - ice whites
installation instructions
Go to the Customize Journal page. Under 2. Select a New Theme, input "Smooth Sailing" in the Search box, and click "Apply Theme" on any one of the themes that come up on the results page. Scroll down to 3. Choose a Page Setup, and click "Apply Layout" where it says "2 Column (sidebar on right)" (third option). Then click the Customize Selected Theme button.
Under Display, in "Basic Options", where it says Userinfo Position in Entries, pick "Right side of the entry text" from the drop-down menu.
Click "Additional Options" once for more options to appear, and where it says Wrap Entry text under userinfo, pick "Yes" from the drop-down menu.
**OPTIONAL: If you want to enable the "Free Text" box(es), go to Sidebar and click the very last item in blue, "Free Text Sidebox". Pick one, and where it says "Free Text Position", pick a number from the drop-down menu. The number will determine the order of the boxes on the sidebar - if you want it above other boxes, you can change the setting on those boxes in the appropriate sections. Note that if you set the same number for two boxes, one of them won't show up.
Lastly, go to Custom CSS. Pick "No" in every drop-down box, and where it says "Custom Stylesheet", paste all of the code below:
/* --------------------------- */
/* */
/* SMOOTH SAILING - ICE WHITES */
/* S2 layout by angeling@LJ */
/* */
/* --------------------------- */
/* --------- */
/* HTML TAGS */
/* --------- */
body { margin: 0px; padding: 0px;
background-color: #DDDDDD;
color: #666666; font-family: verdana, sans-serif; font-size: 7.5pt; }
a, a:visited { color: #3A3A3A; text-decoration: none !important; }
a:hover { color: #AAAAAA; text-decoration: underline !important; }
b { color: #444444; }
i { color: #888888; }
blockquote { margin: 0px auto; padding: 3px;
background-color: #EFEFEF; border: 1px dashed #AAAAAA; width: 50%;
color: #777777; font-family: trebuchet ms, sans-serif; font-size: 95%; }
/* ------------ */
/* MAIN CONTENT */
/* ------------ */
.pageblock { margin: 0px auto; padding: 5px; width: 750px;
background-color: #FFFFFF; }
/* ------ */
/* HEADER */
/* ------ */
.pageheaderblock { padding: 2px 5px 2px 5px;
background-color: transparent; }
.header-title { padding-right: 3px;
color: #AAAAAA; font-family: georgia, serif; font-size: 30pt; font-style: oblique; letter-spacing: -2px; text-align: right; }
.header-subtitle { display: none; }
.header-menu { border: 1px solid #DDDDDD; }
.header-menu ul { text-align: center; }
.header-menu li { list-style: none; display: inline;
background-color: #FFFFFF; #757575; margin-right: 5px; padding: 5px;
text-transform: uppercase; }
.header-menu a, .header-menu a:visited { color: #8A8A8A; }
.header-menu a:hover { color: #00CCFF; text-decoration: none !important; }
/* --------- */
/* MAIN BODY */
/* --------- */
.bodyblock { padding: 0 10px 0 10px; }
.body-title, .body-midtitle { display: none; }
/* ------- */
/* ENTRIES */
/* ------- */
.entryHolder { width: 525px; margin-left: 20px; margin-bottom: 20px; padding-top: 3px; padding-bottom: 20px;
border-bottom: 1px solid #EEEEEE; }
.entryText { text-align: justify; }
.entryUserinfo { padding: 5px; border: 1px solid #DDDDDD; margin: 0 0 5px 5px; }
.entryUserinfo-usericon img { border: 0px; }
.entryHeader { margin: 0 0 10px -5px; padding-bottom: 3px;
border-bottom: 1px solid #BBBBBB; }
.entryHeader a, .entryHeader a:hover { }
.entryHeaderSubject { color: #999999; font-family: georgia, serif; font-size: 150%; font-style: oblique; }
.entryHeaderDate { color: #BBBBBB; }
.entryMetadata a, .entryMetadata a:visited { color: #8A8A8A; }
.entryMetadata a:hover { color: #00CCFF; text-decoration: none !important; }
.entryMetadata ul { margin: 10px 0 10px 0; padding: 0px; }
.entryMetadata li { list-style: none; }
.entryMetadata-label { padding-right: 5px;
color: #9A9A9A; font-weight: bold; text-transform: lowercase; }
.entryLinkbar { border-top: 1px solid #DDDDDD; border-bottom: 1px solid #DDDDDD; margin-bottom: 10px; padding: 2px 0 2px 0px;
font-size: 90%; text-align: center; }
.entryLinkbar a, entryLinkbar a:visited { color: #8A8A8A; }
.entryLinkbar a:hover { color: #00CCFF; text-decoration: none !important; }
.entryLinkbar ul { margin: 0px; padding: 0px; }
.entryLinkbar li { display: inline; list-style: none;
padding-right: 10px;
font-size: 90%; text-transform: uppercase; }
/* ------ */
/* FOOTER */
/* ------ */
.pagefooterblock { padding: 2px 5px 2px 5px;
background-color: transparent;
color: #BBBBBB; }
.pagefooterblock a, .pagefooterblock a:visited { }
#footer-menu { font-size: 80%; text-transform: uppercase; }
.header-menu ul, #footer-menu ul { padding: 5px; }
.header-menu li, #footer-menu li { display: inline; list-style: none;
padding-right: 10px; }
#footer-menu a, #footer-menu a:visited { color: #8A8A8A; }
#footer-menu a:hover { color: #00CCFF; text-decoration: none !important; }
/* ------- */
/* SIDEBAR */
/* ------- */
.sidebar { margin-left: 25px; width: 150px; }
.sideboxTitle { padding: 3px 0 3px 0;
border-bottom: 1px solid #BBBBBB;
color: #999999; font-family: georgia, serif; font-size: 150%; font-style: italic; text-align: right; }
.sideboxContent { padding: 5px; }
.sidebox #profile, .sidebox #latestmonth, .sidebox #search { text-align: center; }
.sidebox #summary { }
.sidebox #tags_sidebox { font-size: 0px; text-align: right; }
.sidebox #tags_sidebox a, .sidebox #tags_sidebox a:visited { display: block;
font-size: 7pt; }
.sidebox #tags_sidebox a:hover { text-decoration: none !important; }
.sidebox #latestmonth td { padding: 2px; }
.sidebox #freetext a, .sidebox #freetext a:visited { color: #8A8A8A; text-decoration: none !important; }
.sidebox #freetext a:hover { color: #00CCFF; }
.profile-label { display: none; }
/* -------- */
/* COMMENTS */
/* -------- */
.commentHolder { margin: 10px 10px 0 0; padding-left: 10px;
border: 1px solid #DDDDDD; }
.commentUserinfo { padding: 5px; border: 1px solid #DDDDDD; margin: 5px 5px 5px 5px; }
.commentUserinfo-usericon img { border: 0px; }
.commentText { padding: 5px; }
.commentHeader { margin: 2px; padding: 3px; }
.commentHeader a:hover { text-decoration: none !important; }
.commentHeaderScreened { margin: 2px; padding: 3px;
background-color: #CCCCCC; }
.commentHeaderSubject { color: #999999; font-family: georgia, serif; font-size: 125%; font-weight: bold; }
.commentHeaderDate { color: #BBBBBB; }
.commentLinkbar { margin: 0px auto; width: 90%;
font-size: 90%; text-align: center; text-transform: uppercase; }
.commentLinkbar a, .commentLinkbar a:visited { color: #8A8A8A; }
.commentLinkbar a:hover { color: #00CCFF; text-decoration: none !important; }
.commentLinkbar ul { border-top: 1px solid #DDDDDD; border-bottom: 1px solid #DDDDDD; margin-bottom: 5px; padding: 2px 0 2px 0px; }
.commentLinkbar li { padding-right: 10px;
display: inline; list-style: none;
font-size: 95%; vertical-align: center; }
.reply { border: 1px solid #CCCCCC !important; }
/* ---------- */
/* REPLY FORM */
/* ---------- */
.replyform { width: 515px;
border: 1px solid #CCCCCC; }
.replyform textarea { width: 400px;
color: #7A7A7A; font-family: verdana, sans-serif; font-size: 95%; }
.replyform input { margin: 3px; }
/* -------- */
/* CALENDAR */
/* -------- */
.yearlinks, .yearlink { }
.month { }
.daysubjects { }
.daytitles { padding: 2px; font-weight: bold; border: 1px solid #DDDDDD; }
/* ---------- */
/* TINY ICONS */
/* ---------- */
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
background-image: url(http://img59.imageshack.us/img59/5699/lightgrayjq2.png);
padding: 11px 4px 3px 2px !important;
}
.ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] {
width: 0;
height: 0;
background-repeat: no-repeat;
background-image: url(http://img59.imageshack.us/img59/5699/lightgrayjq2.png) !important;
padding: 12px 7px 0 0 !important;
}
.ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] {
width:0;
height: 0;
background-repeat: no-repeat;
background-image: url(http://img208.imageshack.us/img208/849/commlightgrayva4.png) !important;
padding: 12px 13px 0 0 !important;
}
/* ---------------- */
/* CONTEXTUAL POPUP */
/* ---------------- */
div.ContextualPopup { margin: 10px 0 0 0px;
font-family: verdana, sans-serif !important; font-size: 9px !important; }
div.ContextualPopup img { margin: 0 1px 0 5px !important; padding: 0 5px 0 5px;
border: 0px; }
div.ContextualPopup div.Inner { padding: 0px; width: 200px;
background-color: #f8f8f8 !important; border: 1px dashed #dddddd;
color: #7A7A7A !important; text-align: right; }
div.ContextualPopup .Content { padding: 4px; }
div.ContextualPopup .Relation { letter-spacing: 1px; }
div.ContextualPopup .Userpic { padding: 4px 4px 0 0; }
div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { color: #8A8A8A !important; text-decoration: none !important; text-transform: uppercase; }
div.ContextualPopup div.Inner a:hover { color: #00CCFF !important; }
/* ----------------------------- */
/* PASTE FURTHER OVERRIDES BELOW */
/* ----------------------------- */
Crediting and comments are greatly appreciated, but not necessary. If you do credit, link to either angeling or mirukubox, please!
Feel free to edit the code and make it your own. :3
Best Resolution: 1024x768
Tested Browsers: Firefox 2.0, Internet Explorer
Custom Comments Page?: Yes
Custom Calendar?: Yes
Custom Tags Page?: No
Custom Icons: LJ user, LJ community
(preview on a non-widescreen monitor set to 1024x768)
view larger | live preview | (+comments page)
♣ s2 smooth sailing - ice whites
installation instructions
Go to the Customize Journal page. Under 2. Select a New Theme, input "Smooth Sailing" in the Search box, and click "Apply Theme" on any one of the themes that come up on the results page. Scroll down to 3. Choose a Page Setup, and click "Apply Layout" where it says "2 Column (sidebar on right)" (third option). Then click the Customize Selected Theme button.
Under Display, in "Basic Options", where it says Userinfo Position in Entries, pick "Right side of the entry text" from the drop-down menu.
Click "Additional Options" once for more options to appear, and where it says Wrap Entry text under userinfo, pick "Yes" from the drop-down menu.
**OPTIONAL: If you want to enable the "Free Text" box(es), go to Sidebar and click the very last item in blue, "Free Text Sidebox". Pick one, and where it says "Free Text Position", pick a number from the drop-down menu. The number will determine the order of the boxes on the sidebar - if you want it above other boxes, you can change the setting on those boxes in the appropriate sections. Note that if you set the same number for two boxes, one of them won't show up.
Lastly, go to Custom CSS. Pick "No" in every drop-down box, and where it says "Custom Stylesheet", paste all of the code below:
/* --------------------------- */
/* */
/* SMOOTH SAILING - ICE WHITES */
/* S2 layout by angeling@LJ */
/* */
/* --------------------------- */
/* --------- */
/* HTML TAGS */
/* --------- */
body { margin: 0px; padding: 0px;
background-color: #DDDDDD;
color: #666666; font-family: verdana, sans-serif; font-size: 7.5pt; }
a, a:visited { color: #3A3A3A; text-decoration: none !important; }
a:hover { color: #AAAAAA; text-decoration: underline !important; }
b { color: #444444; }
i { color: #888888; }
blockquote { margin: 0px auto; padding: 3px;
background-color: #EFEFEF; border: 1px dashed #AAAAAA; width: 50%;
color: #777777; font-family: trebuchet ms, sans-serif; font-size: 95%; }
/* ------------ */
/* MAIN CONTENT */
/* ------------ */
.pageblock { margin: 0px auto; padding: 5px; width: 750px;
background-color: #FFFFFF; }
/* ------ */
/* HEADER */
/* ------ */
.pageheaderblock { padding: 2px 5px 2px 5px;
background-color: transparent; }
.header-title { padding-right: 3px;
color: #AAAAAA; font-family: georgia, serif; font-size: 30pt; font-style: oblique; letter-spacing: -2px; text-align: right; }
.header-subtitle { display: none; }
.header-menu { border: 1px solid #DDDDDD; }
.header-menu ul { text-align: center; }
.header-menu li { list-style: none; display: inline;
background-color: #FFFFFF; #757575; margin-right: 5px; padding: 5px;
text-transform: uppercase; }
.header-menu a, .header-menu a:visited { color: #8A8A8A; }
.header-menu a:hover { color: #00CCFF; text-decoration: none !important; }
/* --------- */
/* MAIN BODY */
/* --------- */
.bodyblock { padding: 0 10px 0 10px; }
.body-title, .body-midtitle { display: none; }
/* ------- */
/* ENTRIES */
/* ------- */
.entryHolder { width: 525px; margin-left: 20px; margin-bottom: 20px; padding-top: 3px; padding-bottom: 20px;
border-bottom: 1px solid #EEEEEE; }
.entryText { text-align: justify; }
.entryUserinfo { padding: 5px; border: 1px solid #DDDDDD; margin: 0 0 5px 5px; }
.entryUserinfo-usericon img { border: 0px; }
.entryHeader { margin: 0 0 10px -5px; padding-bottom: 3px;
border-bottom: 1px solid #BBBBBB; }
.entryHeader a, .entryHeader a:hover { }
.entryHeaderSubject { color: #999999; font-family: georgia, serif; font-size: 150%; font-style: oblique; }
.entryHeaderDate { color: #BBBBBB; }
.entryMetadata a, .entryMetadata a:visited { color: #8A8A8A; }
.entryMetadata a:hover { color: #00CCFF; text-decoration: none !important; }
.entryMetadata ul { margin: 10px 0 10px 0; padding: 0px; }
.entryMetadata li { list-style: none; }
.entryMetadata-label { padding-right: 5px;
color: #9A9A9A; font-weight: bold; text-transform: lowercase; }
.entryLinkbar { border-top: 1px solid #DDDDDD; border-bottom: 1px solid #DDDDDD; margin-bottom: 10px; padding: 2px 0 2px 0px;
font-size: 90%; text-align: center; }
.entryLinkbar a, entryLinkbar a:visited { color: #8A8A8A; }
.entryLinkbar a:hover { color: #00CCFF; text-decoration: none !important; }
.entryLinkbar ul { margin: 0px; padding: 0px; }
.entryLinkbar li { display: inline; list-style: none;
padding-right: 10px;
font-size: 90%; text-transform: uppercase; }
/* ------ */
/* FOOTER */
/* ------ */
.pagefooterblock { padding: 2px 5px 2px 5px;
background-color: transparent;
color: #BBBBBB; }
.pagefooterblock a, .pagefooterblock a:visited { }
#footer-menu { font-size: 80%; text-transform: uppercase; }
.header-menu ul, #footer-menu ul { padding: 5px; }
.header-menu li, #footer-menu li { display: inline; list-style: none;
padding-right: 10px; }
#footer-menu a, #footer-menu a:visited { color: #8A8A8A; }
#footer-menu a:hover { color: #00CCFF; text-decoration: none !important; }
/* ------- */
/* SIDEBAR */
/* ------- */
.sidebar { margin-left: 25px; width: 150px; }
.sideboxTitle { padding: 3px 0 3px 0;
border-bottom: 1px solid #BBBBBB;
color: #999999; font-family: georgia, serif; font-size: 150%; font-style: italic; text-align: right; }
.sideboxContent { padding: 5px; }
.sidebox #profile, .sidebox #latestmonth, .sidebox #search { text-align: center; }
.sidebox #summary { }
.sidebox #tags_sidebox { font-size: 0px; text-align: right; }
.sidebox #tags_sidebox a, .sidebox #tags_sidebox a:visited { display: block;
font-size: 7pt; }
.sidebox #tags_sidebox a:hover { text-decoration: none !important; }
.sidebox #latestmonth td { padding: 2px; }
.sidebox #freetext a, .sidebox #freetext a:visited { color: #8A8A8A; text-decoration: none !important; }
.sidebox #freetext a:hover { color: #00CCFF; }
.profile-label { display: none; }
/* -------- */
/* COMMENTS */
/* -------- */
.commentHolder { margin: 10px 10px 0 0; padding-left: 10px;
border: 1px solid #DDDDDD; }
.commentUserinfo { padding: 5px; border: 1px solid #DDDDDD; margin: 5px 5px 5px 5px; }
.commentUserinfo-usericon img { border: 0px; }
.commentText { padding: 5px; }
.commentHeader { margin: 2px; padding: 3px; }
.commentHeader a:hover { text-decoration: none !important; }
.commentHeaderScreened { margin: 2px; padding: 3px;
background-color: #CCCCCC; }
.commentHeaderSubject { color: #999999; font-family: georgia, serif; font-size: 125%; font-weight: bold; }
.commentHeaderDate { color: #BBBBBB; }
.commentLinkbar { margin: 0px auto; width: 90%;
font-size: 90%; text-align: center; text-transform: uppercase; }
.commentLinkbar a, .commentLinkbar a:visited { color: #8A8A8A; }
.commentLinkbar a:hover { color: #00CCFF; text-decoration: none !important; }
.commentLinkbar ul { border-top: 1px solid #DDDDDD; border-bottom: 1px solid #DDDDDD; margin-bottom: 5px; padding: 2px 0 2px 0px; }
.commentLinkbar li { padding-right: 10px;
display: inline; list-style: none;
font-size: 95%; vertical-align: center; }
.reply { border: 1px solid #CCCCCC !important; }
/* ---------- */
/* REPLY FORM */
/* ---------- */
.replyform { width: 515px;
border: 1px solid #CCCCCC; }
.replyform textarea { width: 400px;
color: #7A7A7A; font-family: verdana, sans-serif; font-size: 95%; }
.replyform input { margin: 3px; }
/* -------- */
/* CALENDAR */
/* -------- */
.yearlinks, .yearlink { }
.month { }
.daysubjects { }
.daytitles { padding: 2px; font-weight: bold; border: 1px solid #DDDDDD; }
/* ---------- */
/* TINY ICONS */
/* ---------- */
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
background-image: url(http://img59.imageshack.us/img59/5699/lightgrayjq2.png);
;){kind=link}
padding: 11px 4px 3px 2px !important;
}
.ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] {
width: 0;
height: 0;
background-repeat: no-repeat;
background-image: url(http://img59.imageshack.us/img59/5699/lightgrayjq2.png) !important;
padding: 12px 7px 0 0 !important;
}
.ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] {
width:0;
height: 0;
background-repeat: no-repeat;
background-image: url(http://img208.imageshack.us/img208/849/commlightgrayva4.png) !important;
padding: 12px 13px 0 0 !important;
}
/* ---------------- */
/* CONTEXTUAL POPUP */
/* ---------------- */
div.ContextualPopup { margin: 10px 0 0 0px;
font-family: verdana, sans-serif !important; font-size: 9px !important; }
div.ContextualPopup img { margin: 0 1px 0 5px !important; padding: 0 5px 0 5px;
border: 0px; }
div.ContextualPopup div.Inner { padding: 0px; width: 200px;
background-color: #f8f8f8 !important; border: 1px dashed #dddddd;
color: #7A7A7A !important; text-align: right; }
div.ContextualPopup .Content { padding: 4px; }
div.ContextualPopup .Relation { letter-spacing: 1px; }
div.ContextualPopup .Userpic { padding: 4px 4px 0 0; }
div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { color: #8A8A8A !important; text-decoration: none !important; text-transform: uppercase; }
div.ContextualPopup div.Inner a:hover { color: #00CCFF !important; }
/* ----------------------------- */
/* PASTE FURTHER OVERRIDES BELOW */
/* ----------------------------- */
Crediting and comments are greatly appreciated, but not necessary. If you do credit, link to either angeling or mirukubox, please!
Feel free to edit the code and make it your own. :3