Post Friends My journal
malionette in fruitstyle

Layout 028 : Weathers

Jul 08, 2009 15:45




Click for a Live Preview.


( Layout ) #028 : Weathers
Try to make your journal title a bit shorter when using this layout

( Install ) Step 1 - System

Select Theme
  1. Select any S2 Smooth Sailing layout.

Page Setup
  1. Ad Placement: Vertical
    (Ignore if you have a paid account.)

  2. Sidebar: 2 Column (sidebar on left)


← Previous Step | 1 | 2 | 3 | 4 | Next Step →


( Install ) Step 2 - Display

Customize Display
  1. Userinfo Position in Entries: Right
  2. Userinfo Position in Comments: Right

← Previous Step | 1 | 2 | 3 | 4 | Next Step →

( Install ) Step 3 - Stylesheet

Custom CSS
  1. Use layout's stylesheets: No. IMPORTANT!!

  2. Custom Stylesheet: /* S2 SMOOTH SAILING --- Weathers ---
    Wingweaver22 @ Fruitstyle.livejournal.com
    Do not remove this note. */

    /* ------------------------------ PAGE ------------------------------ */

    body {background: #dcdad6 url(http://img268.imageshack.us/img268/6227/floralgraypat.png); font: 11px georgia; color: #666666; padding: 0; margin: 0; }

    /* background by 77words @ livejournal.com */

    a {color: #cbb89e; text-decoration: none;}
    a:hover {color: #666666; }

    blockquote {border: 1px dashed #c6c7bc; background: #ffffff; padding: 10px;}

    select, input, textarea {background: #F3F1EF; color: #666666; border: 1px dashed #c6c7bc; font: 11px georgia;}
    #lj_controlstrip select, #lj_controlstrip input {background: #ffffff; border: 1px dashed #c6c7bc; font: 11px georgia;}
    #qrform select, #qrform input, #qrform textarea {background: #ffffff; border: 1px dashed #c6c7bc; font: 11px georgia;}

    /* ------------------------------ HEADER ------------------------------ */

    .pageheaderblock {background: transparent url(http://img30.imageshack.us/img30/2656/900roundbotffffff.png) center bottom no-repeat ; width: 900px;
    padding-bottom: 9px; margin: 0 auto; height: 50px; }

    .header-icon, .header-subtitle {display: none;}

    .header-menu {background: #ffffff; height: 35px; padding: 15px 0 0 0; }
    .header-menu ul {padding: 10px 0 0 0; margin: 0 10px 0 10px; }
    .header-menu li {display: inline; padding: 0 7px 0 7px; border-left: 1px dashed #c6c7bc; }

    .header-title {background: #ffffff; margin: 0; letter-spacing: -1px; padding: 10px 10px 0 10px; font: 30px georgia; color: #c6c7bc; float: left;}

    #lj_controlstrip td{background: #f3f1ef; font: 11px georgia !important; border-right: 1px dashed #c6c7bc; border-bottom: 1px dashed #c6c7bc; }
    #lj_controlstrip td a {color: #cbb89e; text-decoration: none; font: 11px georgia !important;}
    #lj_controlstrip td a:hover {color: #666666; }
    #lj_controlstrip_statustext {color: #c6c7bc; }

    /* ------------------------------ BODY ------------------------------ */

    .bodyblock { width: 900px; margin: auto; }
    .bodyheaderblock {display: none;}
    .bodynavblock { width: 600px; background-color: transparent; margin-top: 5px; text-align: center; text-transform: uppercase;}

    .bodynavblock a, .bodynavblock a:visited { background-color: transparent; border: none;}

    .body-title { display: none; }
    .body-midtitle { display: none; }

    /* ------------------------------ SIDEBAR ------------------------------ */

    .sidebar { width: 157px; padding: 20px 10px 10px 0px; }
    .sidebox {-moz-border-radius: 10px; -webkit-border-radius: 10px; border: 10px solid #ffffff; background: #ffffff; margin-bottom: 20px;}

    .sideboxTitle {text-align: center; border-bottom: 1px dashed #c6c7bc; padding: 0 0 9px 0; text-transform: uppercase;
    margin: 0 0 9px 0; color: #c6c7bc; font-size: 10px;}

    #latestmonth td{ padding: 2px; border-bottom: 1px dashed #c6c7bc; }
    .listitem a {border-bottom: 1px dashed #c6c7bc; display: block; }

    #search #SearchType {margin-bottom: 9px; }

    /* ------------------------------ ENTRY ------------------------------ */

    .entryHolder { padding: 20px 0 0 0; width: 600px;}

    .entryUserinfo {font-weight: normal; margin: -38px -130px 0 11px;}
    .entryUserinfo-usericon img { background-color: #ffffff; -moz-border-radius: 10px; -webkit-border-radius: 10px; border: 10px solid #ffffff;}

    .entryText { background: #f3f1ef; padding: 10px; margin: -30px 0 0 0; width: 580px; min-height: 62px; border-top: 30px solid #ffffff;}
    .entryText img { border: 1px dashed #c6c7bc; background: #ffffff; padding: 4px; margin: 3px; }
    .entryText a img:hover {border-color: #cbb89e;}

    /* ------------------------------ ENTRY HEADER ------------------------------ */

    .entryHeader {height: 20px; background: url(http://img10.imageshack.us/img10/5103/roundtopffffff.png) no-repeat top center; padding: 10px 0 9px 0; }
    .entryHeaderSubject {font-size: 0; float: left; }
    .entryHeaderDate {float: right; border-left: 1px dashed #c6c7bc; padding: 0 7px 0 7px; margin-top: 4px; }

    .subj-link {font: 18px georgia; letter-spacing: -1px; color: #c6c7bc; padding: 0 0 0 5px; }
    .subj-link:hover {color: #cbb89e; }
    .subj-link:before {content: "& ";}

    .entryHeaderSubject .ljuser {font: 18px georgia; }

    /* ------------------------------ META ------------------------------ */

    .entryMetadata {background: #ffffff;}
    .entryMetadata ul { margin: 0; list-style: none; border-top: 1px dashed #c6c7bc; padding: 0; }
    .entryMetadata li {padding: 2px 0 2px 10px; margin: 0; border-bottom: 1px dashed #c6c7bc;}
    .entryMetadata-label { font: 10px georgia; text-transform: uppercase; margin-right: 9px;color: #c6c7bc; }

    /* ------------------------------ COMMENT BAR ------------------------------ */

    .entryLinkbar { background: url(http://img10.imageshack.us/img10/4871/roundbotffffff.png) no-repeat bottom right; width: 600px; padding: 0 0 9px 0;}
    .entryLinkbar ul {background: #ffffff; margin: 0; padding: 0; list-style: none; padding-top: 9px;}
    .entryLinkbar li {display: inline; }
    .entryLinkbar li a { border-right: 1px dashed #c6c7bc; padding: 0 5px 0 5px;}

    /* ------------------------------ FOOTER ------------------------------ */

    #footer-menu {margin: 0; padding: 10px; width: 580px;}
    #footer-menu ul{ margin: 0; padding: 0; font-size: 10px; }
    #footer-menu li {display: inline; }
    #footer-menu a {margin: 0 5px 0 5px; color: #666666;}
    #footer-menu a:hover {color: #ffffff;}
    #footer-menu li + li {border-left: 1px dashed #c6c7bc; }

    .pagefooterblock {display: none;}

    /* ------------------------------ COMMENT ------------------------------ */

    .commentHolder {background: url(http://img10.imageshack.us/img10/5103/roundtopffffff.png) no-repeat top center; padding: 10px 0 9px 0; width: 600px;
    margin: 20px 0 0 0;}

    .commentHolder table { background: #F3F1EF; }
    .commentText {padding: 10px;}

    #qrform table { border: 0 !important; border-spacing: 0 !important;}
    #qrform td { border-right: 1px solid #dddddd; border-top: 1px solid #dddddd !important; padding: 5px; text-transform: uppercase;
    font: 10px georgia; letter-spacing: 2px;}
    #qrform td + td { border-right: 0; letter-spacing: 0; font-size: 12px; text-transform: lowercase;}
    .textbox {width: 80% !important; font-size: 12px;}

    #prop_picture_keyword { margin: 0 0 0 10px;}
    #submitpost, #submitmoreoptsm, #postform input { letter-spacing: 1px;}

    #postform {background: #ffffff; border: 1px solid #dddddd; border-top: 0;}
    #postform table {border-spacing: 0;}
    #postform td { border-right: 1px solid #dddddd; text-transform: uppercase; font: 9px georgia; letter-spacing: 2px; font-weight: bold;}
    #postform td + td { border-right: 0; letter-spacing: 0; font-size: 12px; text-transform: lowercase; font-weight: normal;}
    #postform tr + tr td { border-top: 1px solid #dddddd; padding: 5px; }

    #postform #userpics label{ margin: 0 3px 0 3px;}

    #postform table table {width: 100%; }
    #postform table table td {padding: 3px;}

    /* ------------------------------ COMMENT HEADER ------------------------------ */

    .commentHeader, .commentHeaderScreened { background: #ffffff; margin-top: -1px; padding: 0 9px 9px 9px; }
    .commentHeaderScreened {background: #666666; color: #ffffff; padding: 9px; }

    .commentUserinfo {font-weight: normal; text-align: center; font-size: 10px; margin: 10px;}
    .commentUserinfo-usericon { padding: 10px; }
    .commentUserinfo-usericon img { -moz-border-radius: 10px; -webkit-border-radius: 10px; border: 10px solid #ffffff; max-width: 50px; max-height: 50px;}

    /* ------------------------------ COMMENT COMMENT BAR ------------------------------ */

    .commentLinkbar { text-transform: uppercase; font: 10px georgia; }
    .commentLinkbar ul { margin: 0; padding: 0; background: #ffffff; padding: 10px; border-top: 1px solid #dddddd;}
    .commentLinkbar li { display: inline; padding: 0 2px 0 2px; }

    /* ------------------------------ ARCHIVE PAGE ------------------------------ */

    .entryHeader > a { font-weight: bold; display: block; width: 580px; padding: 10px; background: #ffffff;
    border-bottom: 1px dashed #c6c7bc; margin-top: -1px; }

    .month { width: 100%; margin: 5px 0 0 0;
    background: url(http://img10.imageshack.us/img10/4871/roundbotffffff.png) no-repeat bottom right; padding: 0 0 9px 0;}
    .daytitles {height: 31px; font: 9px georgia; text-transform: uppercase; text-align: center; color: #c6c7bc;}
    .day-date {text-align: right; padding: 0 2px 0 0;}
    .day-count a {display: block; text-align: center;}

    .month tr td {border-bottom: 1px dashed #c6c7bc; padding: 0 10px 0 10px; background: #ffffff;}
    .month tr td + td {border-left: 1px dashed #c6c7bc;}

    .daysubjects {margin: 5px 0 0 0; background: #ffffff; padding: 10px;}

    /* ------------------------------ TAGS PAGE ------------------------------ */

    .tagstable { }
    .tagstable td{ border-top: 1px dashed #c6c7bc; padding: 9px 7px 6px 7px; }

    .taglist {padding: 0; }
    .taglist li { padding: 9px 7px 6px 7px; list-style: none;}
    .taglist li + li { border-top: 1px dashed #c6c7bc;}

    /* ------------------------------ EXTRAS ------------------------------ */

    div.ContextualPopup { font: 10px georgia !important;}
    div.ContextualPopup div.Inner { background-color: transparent !important; border: 0; text-align: right;}

    div.ContextualPopup div.Userpic { margin: 0 -72px 0 0;}
    div.ContextualPopup div.Userpic a img { -moz-border-radius: 10px; -webkit-border-radius: 10px; border: 10px solid #ffffff; }

    div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { text-decoration: none !important; font-size: 9px;
    color: #cbb89e !important; font-weight: normal;}

    div.ContextualPopup div.Inner div.Content a, div.ContextualPopup div.Inner div.Content a:visited { text-decoration: none !important; font-size: 9px;
    color: #cbb89e !important; font-weight: normal;}

    div.ContextualPopup div.Content {-moz-border-radius: 10px; -webkit-border-radius: 10px; border: 10px solid #ffffff;
    background: #ffffff; width: 150px; text-transform: uppercase; color: #666666 !important;}

    .bodyblock > table > tbody > tr > td + td + td {display: none;}
    .bodyblock > div {display: none;}

    * html span.ljuser{ background-image: url(img/useryb4.png) !important no-repeat left middle; padding: 10px 8px 0px 0px !important;}

    * html span.ljuser img{ visibility: hidden; }

    .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; padding: 12px 8px 0 2px !important;
    background: url(http://img291.imageshack.us/img291/4575/useryb4.png) no-repeat;}
    .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] {width:0; height: 0; padding: 9px 8px 0 2px !important;
    background: url(http://i38.tinypic.com/2r6crih.png) no-repeat;}

    .entryText .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] { padding: 7px 5px 2px 4px !important;}
    .entryText .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] { padding: 6px 5px 0 2px !important;}

    img[src="http://l-stat.livejournal.com/img/icon_protected.gif"]{width: 0; height: 0; padding: 0 0 10px 10px !important; margin-left: 5px;
    background: url(http://img72.imageshack.us/img72/4144/lockedib8.png) no-repeat;}
    img[src="http://l-stat.livejournal.com/img/icon_private.gif"]{width: 0; height: 0; padding: 0 0 10px 10px !important; margin-left: 5px;
    background: url(http://i34.tinypic.com/14kkvpz.jpg) no-repeat;}

    ::-moz-selection { background: #dcdad6; color: #ffffff;}
    ::selection { background: #dcdad6; color: #ffffff;}
    code::-moz-selection { background: #dcdad6; color: #ffffff;}
    code::selection { background: #dcdad6; color: #ffffff;}

← Previous Step | 1 | 2 | 3 | 4 | Next Step →

( Install ) Step 4 - Link Back

Please link back to fruitstyle so others can find my layouts. Put either a button or the code in your Userinfo.
ButtonCode

View available buttonsLayout by fruitstyle
← Previous Step | 1 | 2 | 3 | 4 | Next Step →


( Optional ) Replace Colours

#ffffff#f3f1ef#dcdad6#cbb89e#c6c7bc#666666
How do I replace layout colours?

Replace Colours | Replace Images

( Optional ) Replace Images

Get all the images at Box.net

How do I replace layout images?

The background pattern is by 77words.

Replace Colours | Replace Images

Fruitstyle: Layouts and Winamp Skin Designs by Malionette



layouts

Leave a comment

Read comments 121
Previous post Next post
Up
Homepage Read journal... Full version Help Русская версия
© 1999-2025 LiveJournal, Inc.