layoutlounge | 43. Repeat in Smooth Sailing

sireesanwar.livejournal.com posting in

layoutlounge

Layout Style: Smooth Sailing
Features: Sidebar, Scrolling Tags
Layout Width: 800px

[ Preview ] [ Live ]

Font(s) Used: Automobile

Layout:

layout_lounge
Header:

graffitigraphic

Check out Using Layouts or Layout Changes for Beginners on the sidebar for any extra assistance.

See the Font Tutorial if you need help adding these fonts to your computer system.

/*------------------------------------------------------------------
S2 Smooth Sailing - DO NOT REMOVE SECTION
by http://community.livejournal.com/layout_lounge/
--------------------------------------------------------------------*/

body {
     color: #888888;
     font-family: Arial;
     font-size: 8pt;
     margin: 0px;
     background-color: #ffdee5;
     background-image: url('BACKGROUND IMAGE');
background-repeat: repeat;
     background-attachment: fixed;
     }

a {
     color: #246ca6;
     text-decoration: none;
     }

a:hover {
     color: #ed577c;
     }

blockquote {
        padding: 18px; 
        border: 1px solid #e6d6b7; 
	color: #555555;
	font-size: 11px;
	line-height: 100%;
	font-family: "verdana", arial, verdana, sans-serif;
	background: #f7f6f0;
	text-align: left;
     }

b, strong {color: #2ab5d2;}

i, em {color: #ed577c;}

s, u {color: #9363c6;}

p, td{
	}
	
code, kbd, pre, tt {
		font-family: "monospace";
	}

/* HEADER */

.pageblock{
     background-image: url("HEADER IMAGE");
     background-position: top center;
     background-repeat: no-repeat;
     padding-top: 300px;
     width: 800px;
     background-color: transparent !important;
     margin: 10px auto;
     }

.pageheaderblock {
  	position: relative;
	text-align: center;
        color: #ffffff;
	font-family: "verdana";
	font-size: 9px;
	width: 100%;
	padding: 0px 0px 10px 0px;
	margin-bottom: 0px;
	text-align: center;
	letter-spacing: 1px;
        text-transform: normal;
	border-bottom: 0px solid #cccccc;
	background-color: #2a2a2a;
        padding: 0px;
     }

.header-title {
     display: none;
     text-transform: lowercase;
     text-align: left;
font-family: Georgia, sans-serif;
font-size: 12px;
font-style: italic;
     letter-spacing: -2px;
     line-height: 20px;
     color: #f2f2f2;
     }
  .header-subtitle {
     display: none;
     }
  .header-icon {
     top: 0px;
     right: 0px;
     position: absolute;
     z-index: 1;
     }

.header-menu {
	position: relative;
	line-height: 125%;
	text-align: center;
        color: #ffffff;
	font-family: "verdana";
	font-size: 9px;
	width: 100%;
	padding: 10px 0px 10px 0px;
	margin-bottom: -17px;
	text-align: center;
	letter-spacing: 1px;
        text-transform: normal;
}

.header-menu a, .header-menu a:visited { 
       white-space: nowrap;
       padding: 5px;
       font-family: "verdana";
	font-size: 9px;
	font-weight: normal;
	text-transform: normal;
	letter-spacing: -1px;
	color: #2ab5d2;
	text-align: center;
	background-color: #2a2a2a;
     }
  .header-menu a:hover {
     color: #9363c6;
     }
  .header-menu ul, #footer-menu ul {
     margin: 0px;
     padding: 0px;
     }
  .header-menu li, #footer-menu li {
     display: inline;
     }

/* BODY */

.bodyblock {
     padding: 0px;
     background-color: transparent !important;
     }
  .bodyheaderblock {
     display: none;
     }
  .bodynavblock {
     width: 550px;
     background-color: #f7f6f0;
     margin: 10px 0px 4px 0px;
     padding: 8px;
         -moz-border-radius:2%;
     }
  .bodynavblock a, .bodynavblock a:visited {
     color: #666666;
     }
  .body-title {
     display: none;
     }
  .body-midtitle {
     display: none;
     }

/* ENTRIES */

.entryHolder {
        background-color: #f7f6f0;
        width: 563px;
	border: 1px solid #cccccc;
	min-height: 200px !important;
	margin: 17px 0 0 0;
         -moz-border-radius:2%;
     }

.entryUserinfo {
	background-color: #f7f6f0 !important;
        text-align: center;
	float: right;
	padding: 5px;
	margin: 10px;
	z-index: 15;
        color: #cccccc !important;
	border: 1px #e6d6b7 solid;
	}

.entryUserinfo-usericon img { 
background-color: #f7f6f0;
padding: 3px;
}

.entryText {
        width: 400px;
        padding: 10px;
	margin: 0px;
	color: #555555;
	font-family: "arial";
	font-size: 11px;
	text-align: left;
	}
  .entryHeader {
        background-color: #f7f6f0;
	font-weight: none;
	padding-bottom: 5px;
	padding-top: 5px;
        padding-left: 10px;
	color: #246ca6;
	font-family: "PR8 Charade", Verdana;
	font-size: 24px;
	text-transform: normal;
        text-decoration: underline;
	border-bottom: 1px solid #cccccc;
         -moz-border-radius:2%;
     }
  .entryHeader a{
     color: #246ca6;
     }
  .entryHeader a:hover {
     color: #ed577c;
     }
  .entryHeaderDate {
	font-family: "Arial", Verdana;
	font-size: 10px;
	text-transform: normal;
        text-decoration: normal;
	background-color: transparent;
	padding: 0px;
	text-align: left;
	border-left: 0px solid #cccccc;
	border-right: 0px solid #cccccc;
	border-top: 0px solid #cccccc;
     }
  .entryHeaderSubject {
     text-transform: lowercase;
     color: #246ca6;
     }
  .entryHeaderDate a {
     color: #246ca6;
     text-decoration: none;
     }
  .entryHeaderDate a:hover {
     color: #ed577c;
     }
  .entryMetadata {
   color: #888888;
font-family: "Trebuchet MS", sans-serif;
font-size: 10px;
text-transform: uppercase;
     }
  .entryMetadata img {
     display: none;
     }
  .entryMetadata ul {
     margin: 0px;
     padding: 1px;
     }
  .entryMetadata li {
     list-style: none;
     padding: 1px;
     display: block;
     }
  .entryMetadata-label {
     padding: 2px;
     color: #888888;
     font-size: 8pt;
     text-transform: lowercase;
     }

.entryLinkbar {
        width: 553px;
	font-family: "Verdana", arial;
	font-size: 10px;
	text-align: right;
	padding: 5px 5px 5px 5px;
	position: relative;
	clear: center;
	margin-top: 5px;
	text-transform: lowercase;
        border-top:1px solid #F2F2F2;
}

.entryLinkbar a, .entryLinkbar a:visited {
     color: #ed577c;
     }
  .entryLinkbar a:hover {
     color: #246ca6;
     }
  .entryLinkbar ul {
     margin: 0px;
     padding: 0px;
     }
  .entryLinkbar li {
     padding: 0px 5px 0px 5px;
     margin: 0px;     
     display: inline;
     }

/* FOOTER */

#footer-menu {
     width: 550px;
     text-transform: lowercase;
     background-color: #f7f6f0;
     text-align: right;
     font-family: Arial, sans-serif;
     font-size: 8pt;     
     }
  #footer-menu a, .footer-menu a:visited {
     padding: 0px 12px 0px 0px;
     color: #246ca6;
     white-space: nowrap;
     }
  #footer-menu a:hover {
     color: #ed577c;
     }

.pagefooterblock {
     display: none;
     }
.pagefooterblock a, .pagefooterblock a:visited {
     color: #666666;
     }

/* SIDEBAR */
  
.nav a {border-bottom: 1px solid #cccccc; color: #000000; display: block; font-family: tahoma; font-size: 9pt; text-transform: uppercase; line-height: 5px; padding: 4px; letter-spacing: 1px;}
.nav a:hover {color: #303030; text-decoration: none;}
.nav br {display: none;}

.sidebar {
	padding: 0px 0 10px 0; 
        background-color: #f7f6f0;
        margin: 17px 0px 0 0;
	font-family: "verdana", arial, verdana, sans-serif;
	font-size: 10px;
	color: #555555;
	width: 215px;
	float: right;
	text-align: left;
        text-transform: normal;
	border: 1px solid #cccccc;
         -moz-border-radius-bottomleft:2%;
         -moz-border-radius-bottomright:2%;
     }
  .sidebox {
     border-bottom: 0px solid #f2f2f2;
     color: #888888;
     margin: 0px 0 10px 0;
     }
  .sideboxTitle {
        padding: 3px 5px 3px 5px;
	margin: 10px 0 10px 0;
	list-style: none;
	text-align: center;
	color: #888888;
        border-bottom: 1px solid #cccccc;
        text-transform: normal;
	font-weight: none;
	font-family: "Automobile", Arial;
	font-size: 18px;
     }

.listtitle {
       border-bottom: 1px solid #F2F2F2;
       font-size: 11px;
       font-weight: normal;
       letter-spacing: normal;
       text-align: left;
       text-transform: lowercase;
       margin: 4px 0px 4px 0px;
}

.sideboxContent {
	color: #555555;
	border: 0px solid #cccccc;
	background-color: #f7f6f0;
	padding: 3px;
	text-transform: normal;
	margin: 3px 0px;
	}

#sideboxSummary a {
	text-decoration: none;
	display: inline !important;
	color: #246ca6;
	border: 1px solid #246ca6 !important;
	background-color: transparent !important;
	}

#sideboxSummary a: hover{
	text-decoration: none;
	color: #007ba7;
	border: 0px solid #cccccc;
	background-color: transparent !important;
	}

#sideboxCalendar {
	padding: 1px;
	border: 1px solid #cccccc;
	text-align: center;
	font-family: "verdana", arial, verdana, sans-serif;
	font-size: 9px;
}

#sideboxCalendarposts {
	padding: 1px;
        border: 1px solid #cccccc;
	background-color: #f7f6f0;
	text-align: center;
	font-family: "verdana", arial, verdana, sans-serif;
	font-size: 9px;
	}

.sidebox #freetext {
        line-height: 10px;
        text-align: justify;
     }

.sidebox #profile, .sidebox #latestmonth, .sidebox #search {
     text-align: center;
     }

#tags_sidebox {
height: 100px;
overflow: auto;
overflow-x: hidden;
overflow-y: auto;
font-size: 0 !important;
}

#tags_sidebox a {display: block; font-size: 10px;}

.sidebox #systemlinks {
     text-align: left;
     }
  .sidebox #latestmonth table {
     width: 90%;
     margin: 4px auto 4px auto;	
     }
  #latestmonth a:link, #latestmonth a:active, #latestmonth a:visited {
     text-align: center;
     text-transform: lowercase;
     }
  #latestmonth td {
     text-align: center;
     padding: 1px;
     font-family: Arial, sans-serif;
     font-size: 8pt;
     }
  .latestmonth-inactive {
     background-color: #f7f7f7;
     padding: 2px;
     }
  .latestmonth-active {
     background-color: #eeeeee;
     padding: 2px;
     }
  .profile-label {
     display: none;
     }

/* COMMENT PAGE */

.commentHolder {
     color: #888888;
     background-color: #f7f6f0;
     font-family: Arial, sans-serif;
     font-size: 8pt;
     margin: 4px 18px 4px 8px;
         -moz-border-radius:2%;
     }

.commentUserinfo {
     text-align: center; 
     margin: 8px 8px 8px 8px;
     background-color: #f7f6f0;
     }
  .commentUserinfo-usericon img { 
     padding-bottom: 2px;
     border: 0; 
     } 
  .commentText {
     padding: 6px;
     }

.commentHeader {
     text-transform: lowercase;
     background-color: #f7f6f0;
     color: #888888;
     font-family: Arial, sans-serif;
     font-size: 10pt;
     padding: 4px 18px 4px 8px;
         -moz-border-radius:2%;
     }
  .commentHeader a{
     color: #bebebe;
     }
  .commentHeaderScreened {
     font-family: Arial, sans-serif;
     font-size: 10pt;
     background-color: #eeeeee;
     padding: 4px 18px 4px 8px;
     }
  .commentHeaderSubject {
     font-weight: normal;
     }

.commentLinkbar {
border-top: 0px solid #F2F2F2;
font-family: "Arial", sans-serif;
font-size: 11px;
text-align: right;
text-transform: lowercase;
}
  .commentLinkbar a {
     color: #bbbbbb;
     }
  .commentLinkbar a:hover {
     color: #666666;
     }
  .commentLinkbar ul {
     margin: 0px;
     padding: 0px;
     }
  .commentLinkbar li {
     padding: 0px 5px 0px 5px;
     margin: 0px;
     display: inline;
     }
  .replyform {
     width: 555px;
     border: 0;
     background-color: #f7f6f0;
     color: #246ca6;
     padding-left: 10px;
     }
  #commenttext{
     width: 90%;
     }

/* ARCHIVE PAGE */

.yearlinks{
     text-align: right;
     }
  .yearlink{
     padding-left:4px;
     padding-right: 4px;
     }
  .month {
     width: 400px;
     margin: 8px 8px 8px 20px;
     }
  .daysubjects {
background-color: #F2F2F2;
color: #C1C1C1;
text-transform: lowercase;
padding: 8px 8px 8px 10px;
}

.daytitles {
background: #F2F2F2;
color: #C1C1C1;
text-transform: lowercase;
text-align: center;
}  .day-blank {
     }
  .day {
     }
  .day-date {
     color: #888888;
     width: 50%;
     text-align: center;
     }
  .day-count {
     width: 50%;
     text-align: center;
     float: right;
     font-size: 12px;
     }
  .day-count a {
     text-decoration: none;
     color: #bebebe;
     }

/* TAGS PAGE */

.tagstable td {
     }
  .tagstable {
     text-transform: lowercase;
     width: 500px;
     }

/* USER, COMMUNITY, PROTECTED ICONS */

.entryHeader img[src="http://stat.livejournal.com/img/icon_protected.gif"]{
     width: 0;
     height: 0;
     padding: 0 16px 16px 0;
     background: url("PROTECTED POST TINY ICON");
  }

.ljuser img { 
     width: 0;
     height: 0;
     background-repeat: no-repeat;
     background-color:transparent;
     background-image: url(USER TINY ICON); 
     padding: 16px 16px 0 2px;
     }

.ljuser img[src="http://stat.livejournal.com/img/userinfo.gif"] {
     background-color:transparent;
     background-image: url(USER TINY ICON);
     padding: 16px 16px 0 2px;
     }

.ljuser img[src="http://stat.livejournal.com/img/community.gif"] {
     background-color:transparent;
     background-image: url(COMMUNITY TINY ICON);
     padding: 16px 16px 0 2px;
     }

Header 800 x 300

Background Image:

PLEASE NO HOTLINKING IMAGES

Flat | Top-Level Comments Only

From:

breathesunshine.livejournal.com

I really like this layout. I'm using it for my community. I did change the size of the font for the subjects and titles on the sidebar they were a little too big for me.

From:

sireesanwar.livejournal.com

I'm so glad you like it and it is totally fine that you change the font sizes.

Enjoy!

(deleted comment)

From:

sireesanwar.livejournal.com

Well the first step would to make sure you've changed the theme to Smooth Sailing. It won't work unless you have.

There is a walk-through http://community.livejournal.com/layout_lounge/8638.html which will help but make sure you are using Smooth Sailing instead of Flexible Squares. Also, I would pick the first layout that comes up in Smooth Sailing rather than choosing. I used the first so that might help.

Let me know.

From:

she-burns1.livejournal.com

Just stumbled here, I really love the header - I'm snagging it and giving you full credit.

From:

sireesanwar.livejournal.com

Yeah that is a fav of mine too. I'm glad you love it. Enjoy. See my icon which I also made and you are welcome too.

From:

g-eorgina.livejournal.com

Hey, great design a friend of mine's used.
She wants to know if it is possible to apply one's own title because the only writing we see is the one on the header.

From:

sireesanwar.livejournal.com

I don't have title coding inserted but if you want that I might be able to manage it. Or if it is something she can do she is welcome to do it.

From:

glorified-moron.livejournal.com

I love this! I was going to keep the original header but wound up changing it in the end. Thanks so much!

From:

sireesanwar.livejournal.com

I'm very glad you like it so much. You are welcome to use any header you want as they are usually just for my inspiration and for others to see what they look like.

From:

teddybeargurl.livejournal.com

Taking. Will credit and will not hotlink! Beautiful!

From:

sireesanwar.livejournal.com

Thanks for not hotlinking! You rock. Enjoy!

From:

callmeonetrack.livejournal.com

Thanks so much! Using background (not hotlinked) and layout (diff header) for a new comm,

reelpilots Will credit!

Edited Date: 2011-08-23 03:36 am (UTC)

From:

sireesanwar.livejournal.com

I'm glad you like it. Enjoy.

From:

shadesofsyn.livejournal.com

I really likethis layout, using code but not header or background image! Thank you!

From:

sireesanwar.livejournal.com

No problem. Enjoy!

From:

elionwyr.livejournal.com

I love this, but I can't get it to work. Do you know if it still works with the 2013 version of LJ?

From:

sireesanwar.livejournal.com

Good question. Let me check.

From:

sireesanwar.livejournal.com

It appears to be working but it is a Smooth Sailing Layout so you have to make sure you are in that Theme.

From:

elionwyr.livejournal.com

Ah ha! I have finally gotten it to work.

Except..
I'm having trouble with my custom moods. They're definitely loaded when I look here:
http://www.livejournal.com/moodlist.bml?moodtheme=925820

And I've definitely selected the moodtheme.

But am I missing some other little switch to make this work? Or is it an issue with this layout?

an example of a line of code from the custom mood set is:
moodtheme_setpic 925820 31 http ://i54.photobucket.com/albums/g84/elionwyr/moodtheme/tired_zps3686718d.jpg 100 60 <-- space entered between p and : is not there when code is used
(sorry for all the questions)

Edited Date: 2013-01-08 08:08 pm (UTC)

From:

sireesanwar.livejournal.com

I would recommend going into your moodtheme and just reinstalling that image. Something is up with it. Double check the name/link of the image and the size just to be sure.

No problem

Flat | Top-Level Comments Only

About

Welcome to the Lounge. Our tutorials are saved here. These are currently all for LJ and Flexible Squares. Should you have general questions about us check out our FAQ. I do NOT customize layouts for individuals.

Layout Change Quick Guide

If you like Flexible Squares, I have tons of layouts for you, and still create them.

I've been creating Layouts for DW's Bannering. Here's how to use them:
1. Go to Transmogrified Layouts.
2. Choose Basic.
3. Go to Custom CSS.
4. Make sure all boxes are unchecked
5. Copy Coding to Stylesheet Box.
6. Make sure to update with your own images/image urls. Imgur images are okay to be used.
7.Click Save.

Tips Welcome:

You can also find layout_lounge at LiveJournal.

Summary

April 2025

S	M	T	W	T	F	S
		1	2	3	4	5
6	7	8	9	10	11	12
13	14	15	16	17	18	19
20	21	22	23	24	25	26
27	28	29	30

Layout Lounge

Layouts, Tutorials, Help, and more

43. Repeat in Smooth Sailing

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

About

Links

Tags

Summary

April 2025