I've been coding layouts for my personal journal for a while, but recently I've decided to take a stab at coding free layouts for anyone to use. This is the first of what I hope is many layouts :)
I promise I'll have more icons and resources soon. Life has just been doing its best to deprive me of free time. Just have to get through the next three weeks...
Template Name: Simply Dashing
Layout Style: [s2] Smooth Sailing
Account type(s): all account types (though the ads in Plus might make it look bad; I make no guarantees)
Nav Strip Compatible?: Probably not, but I haven't tested it. Again, I make no guarantees.
Best viewed at: 1024x768 and up
Compatible browser(s): Firefox 2, IE7 on Windows XP; Safari 2 on Mac 10.5
Credit?: Credit is appreciated, but not necessary. If you do credit me, please credit
retrographic.
Modifications: Feel free to customize this to your heart's content. You may edit the code and repost it, but please do so only if you've made significant changes to the code (i.e., don't just change the dashed lines to solid lines and repost it as a brand new layout). If you do repost the code, credit for the original modifications would be appreciated :)
Directions
- Go to: Manage >> Customize
- Type "Smooth Sailing" into the search box. Apply any of the Smooth Sailing themes.
- Choose "2 Column (sidebar on right)" under "Page Setup." Hit the "Customize Selected Theme" button.
- Choose "Custom CSS" from the menu on the left and do the following:
- For "Use layout's stylesheet(s)," select "No."
- For "Use layout's stylesheet(s) when including custom external stylesheet," select "No."
- Leave "Custom external stylesheet URL" blank.
- Paste the stylesheet into the "Custom stylesheet" window.
- Hit "Save changes" and you're done!
Stylesheet/* Layout 001: Simply Dashing */
/* By Molly (
http://helenahandbag.livejournal.com) */
/* Date: 19 November 2007 */
/* S2 Style: Smooth Sailing */
/* Available at
http://retrographic.livejournal.com */
/* PAGE */
body {
font-family: "Century Gothic," sans-serif;
font-size: 12px;
margin: 0px;
background-color: #ffffff;
color: #000000;
background-image: url('');
}
a {
color: #000000;
}
a:visited {
color: #000000;
}
a:hover {
background-color: #7CC6F3;
}
.pageblock{
width:75%;
margin: 0 auto;
}
.pagefooterblock {
background-color: #ffffff;
color: #000000;
font-size: 14px;
text-transform: lowercase;
border-top: 1px dashed #FDB441;
border-bottom: 1px dashed #FDB441;
text-align: center;
padding: 4px 4px 4px 24px;
margin: 10px 0px;
}
.pagefooterblock a, .pagefooterblock a:visited {
color: #000000;
}
/* HEADER */
.pageheaderblock {
text-align: right;
}
.header-title {
font-family: ;
text-transform: lowercase;
font-size: 45px;
color: #fdb441;
padding: 0px 20px 0px 20px;
}
.header-subtitle {
color: #7cc6f3;
font-family: ;
text-transform: lowercase;
font-size: 30px;
padding: 0px 24px 0px 24px;
}
.header-icon {
display: none;
}
.header-menu {
margin: 10px 0px;
font-family: ;
font-size: 16px;
line-height: 30px;
border-top: 1px dashed #fdb441;
border-bottom: 1px dashed #fdb441;
text-align: center;
text-transform: lowercase;
}
.header-menu a, .header-menu a:visited {
white-space: nowrap;
text-align: center;
padding: 2px 6px 2px 6px;
color: #000000;
text-decoration: none;
}
.header-menu a:hover {
background-color: #7CC6F3;
color: #000000;
}
.header-menu ul, #footer-menu ul {
margin: 0px;
padding: 0px;
}
.header-menu li, #footer-menu li {
display: inline;
}
/* BODY */
.bodyblock {
}
.bodyheaderblock {
padding: 4px 0px 4px 0px;
}
.bodynavblock {
background-color: #ffffff;
color: #000000;
border: 1px dashed #7CC6F3;
margin: 10px 0px 4px 0px;
padding: 8px;
}
.bodynavblock a, .bodynavblock a:visited {
color: #000000;
}
.body-title {
font-family: ;
font-size: 24px;
color: #000000;
text-align: left;
text-transform: lowercase;
padding-left: 15px;
margin-top: -85px;
margin-bottom: 75px
}
.body-midtitle {
font-family: ;
font-size: 18px;
color: #000000;
text-align: left;
padding-left: 8px;
}
/*ENTRIES*/
.entryHolder {
color: #000000;
background-color: #ffffff;
font-family: ;
font-size: 12px;
border-top: 2px solid #ffffff;
margin: 4px 0px 24px 0px;
}
.entryUserinfo {
text-align: center;
margin: 0px 8px 8px 0px;
}
.entryUserinfo-usericon img {
border: 0;
}
.entryText {
padding: 6px;
}
.entryHeader {
color: #000000;
font-family: ;
font-size: 16px;
text-align: right;
padding: 5px 8px 5px 0px;
margin-bottom: 10px;
border: 1px dashed #7CC6F3;
}
.entryHeader a{
color: #000000;
}
.entryHeader a:hover {
background-color: #FDB441;
text-decoration: none;
}
.entryHeaderSubject {
font-weight: bold;
}
.entryHeaderDate {
font-size: 12px;
}
.entryHeaderDate a {
color : #000000;
}
.entryHeaderDate a:hover {
color : #000000;
text-decoration : none;
}
.entryMetadata {
padding-left: 20px;
margin: 10px 0px;
}
.entryMetadata ul {
margin: 0px;
padding: 0px;
}
.entryMetadata li {
list-style: none;
padding-right: 10px;
}
.entryMetadata-label {
font-weight: bold;
padding-right: 4px;
}
.entryLinkbar {
font-family: ;
font-size: 11px;
color: #000000;
text-align: right;
padding: 14px 0px 4px 0px;
}
.entryLinkbar ul {
margin: 0px;
padding: 0px;
}
.entryLinkbar li {
padding: 0px 5px 0px 5px;
margin: 0px;
display: inline;
}
/*FOOTER*/
#footer-menu {
font-size: 16px;
text-transform: lowercase;
text-decoration: none;
text-align: right;
}
#footer-menu a, .footer-menu a:visited {
color: #000000;
white-space: nowrap;
padding: 6px;
text-align: right;
text-decoration: none;
}
#footer-menu a:hover {
background-color: #FDB441;
}
/*SIDEBAR*/
.sidebar {
font-family: ;
font-size: 11px;
margin-left: 20px;
width: 150px;
}
.sidebox {
color: #000000;
background-color: #ffffff;
margin: 5px 0px 4px 0px;
}
.sideboxTitle {
color: #000000;
font-family: ;
font-size: 16px;
font-weight: bold;
padding: 5px 8px 5px 0px;
text-align: right;
border: 1px dashed #7CC6F3;
}
.sideboxContent {
text-align: left;
padding: 10px 4px 10px 4px;
}
.sidebox #profile, .sidebox #latestmonth, .sidebox #search {
text-align: center;
}
.sidebox #tags_sidebox {
text-align: center;
}
.sidebox #systemlinks {
text-align: center;
}
.sidebox #latestmonth table{
width: 90%;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
}
.listtitle {
margin: 10px 0px;
font-size: 12px;
font-weight: bold;
border: 1px dashed #7CC6F3;
}
.profile-label {
font-weight: bold;
}
/*OTHER PAGES*/
/* COMMENT PAGE */
.commentHolder {
color: #000000;
background-color: #ffffff;
font-family: ;
font-size: 12px;
margin: 4px 0px 4px 0px;
}
.commentUserinfo {
text-align: center;
margin: 0px 8px 8px 0px;
}
.commentUserinfo-usericon img {
border: 0;
}
.commentText {
padding: 6px;
}
.commentHeader {
color: #000000;
font-family: ;
font-size: 12px;
padding: 4px 0px 4px 8px;
margin-bottom: 15px;
border: 1px dashed #7CC6F3;
text-align: right;
}
.commentHeader a{
color: #000000;
}
.commentHeaderScreened {
font-family: ;
font-size: 12px;
text-align: right;
border: 1px dashed #FDB441;
padding: 4px 0px 4px 8px;
margin-bottom: 15px;
}
.commentHeaderSubject {
font-weight: bold;
font-size: 16px;
}
.commentLinkbar {
font-family: ;
font-size: 11px;
color: #000000;
text-align: right;
padding-top: 4px;
padding-bottom: 4px;
}
.commentLinkbar ul {
margin: 0px;
padding: 0px;
}
.commentLinkbar li {
padding: 0px 5px 0px 5px;
margin: 0px;
display: inline;
}
.replyform {
background-color: #ffffff;
border: 1px dashed #FDB441;
color: #000000;
padding-left: 10px;
}
#commenttext{
width:90%;
}
/*ARCHIVE PAGE*/
.yearlinks{
text-align: right;
}
.yearlink{
padding-left:4px;
padding-right: 4px;
}
.month {
width: 500px;
border: 1px solid #7CC6F3;
margin: 8px 8px 8px 40px;
}
.daysubjects {
color: #000000;
padding: 8px 8px 8px 40px;
}
.daytitles {
text-align: center;
border: 1px solid #7CC6F3;
background: #ffffff;
color: #000000;
}
.day-blank {
border: 1px solid #7CC6F3;
}
.day {
border: 1px solid #7CC6F3;
}
.day-date {
border-right: 1px solid #7CC6F3;
border-bottom: 1px solid #7CC6F3;
color: #000000;
width: 50%;
text-align: center;
}
.day-count {
width: 50%;
text-align: center;
float: right;
font-size: 20px;
}
.day-count a {
text-decoration: none;
color: #000000;
}
/*TAGS PAGE*/
.tagstable, .tagstable td {
border: 1px solid #7CC6F3;
}
.tagstable { width: 500px; }
/*ADDITIONAL MODIFICATIONS*/
blockquote {
padding: 10px;
border: 1px dashed #fdb441;
}