Post Friends My journal
yam in mentahelada

041 - Layout 19 [Smooth Sailing: Sarcastic Mister Know It All]

Apr 01, 2009 20:12


Hello! I like this one. It's simple and easy to customize. And there's a topbar version. Enjoy!



Live preview | Image Preview



Changelog: 2009-04-11: Fixed problem with long subject lines in sidebar layout.

Live preview | Image preview
/********************DO NOT REMOVE THIS******************** Layout 019 [Sarcastic Mister Know It All] by Yam @ Frozen Mint (frozen_mint.livejournal.com) ----------CREDITS: Icons: http://www.famfamfam.com/lab/icons/silk/ W/TOPBAR *************************************************************/ /*****BASIC LAYOUT*****/ body { background:#fff url(http://www.mentahelada.net/lj-layouts/layout019/bg-body.jpg) top left repeat fixed; color:#333; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:100%; line-height:103%; } .pageblock{ /*the content*/ background:transparent; margin:20px auto; width:100%; position:absolute; } .pageheaderblock { margin-bottom:20px; font-size:0.6875em/*11px*/; text-align:left; width:960px; margin:0 auto; } .bodyblock { /*entries + sidebar*/ background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/bg-header.png) top no-repeat; margin:0 auto; padding-top:525px; /*CHANGE TO FIT TOPBAR SIZE*/ width:960px; overflow:hidden; } .sidebar { background:transparent; position:absolute; top:356px; width:950px; margin-left:10px; font-size:0.6875em/*11px*/; } /*****BASICS*****/ * {margin: 0; padding: 0;} .ippu {font-size:11px;} a{outline:none;} a img{border:0;} p, td {font-size:inherit;} code, kbd, pre, tt {font-family:monospace;} i, em{font-style:italic;} textarea {max-width:700px;} .clear{height:0;} .lj_embedcontent{max-width:700px;} #lj_controlstrip {background:#fff!important; border-bottom:1px solid #d4d4d4; padding:3px; color:#e75b18!important;} #lj_controlstrip a{color:#e75b18; text-decoration:underline; text-transform:none;} #lj_controlstrip a:hover{color:#333; text-decoration:none;} #lj_controlstrip_statustext{color:#e75b18; font-weight:100;} #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search{border:0;} a, a:link, a:visited { color:#e75b18; font-weight:200; text-decoration:none; text-transform:uppercase; } a:hover { color:#333; text-decoration:underline; } blockquote { background:#e75b18; margin:10px auto; padding:20px; width:90%; color:#fff; font:italic normal 100 1.0909em Georgia, "Times New Roman", Times, serif; text-align:left; line-height:1.6em; } blockquote a{color:#292929!important; text-transform:none!important;} ::-moz-selection {background:#ccc;color:#333;} b, strong{color:#e75b18;font-weight:900;} /*****HEADER*****/ .header-title {display:none;} .header-subtitle {display:none;} .header-icon {display:none;} .header-menu ul{} .header-menu li{display:inline;} .header-menu { background:#e75b18; padding:20px 0 10px; } .header-menu a, .header-menu a:link, .header-menu a:visited { background:#e75b18; border-right:1px solid #fff; margin:0; padding:20px 8px 10px ; color:#fff; font-weight:normal!important; text-decoration:none; text-transform:uppercase; } .header-menu a:hover { background:#e14900; padding:20px 8px 10px; color:#fff; } /*****SIDEBAR*****/ .sidebar a{text-decoration:none; text-transform:none;} .sidebox { background:#fff; margin-bottom:10px; margin-right:10px; width:227.5px; min-height:185px; float:left; } .sideboxTitle { background:#e75b18; padding:10px 5px 5px; color:#fff; font-size:1em; text-align:left; text-transform:uppercase; letter-spacing:0.15em; } .listtitle { /*titles in the link list*/ background:#e75b18; padding:10px 5px 5px; margin:10px 0 5px; color:#fff; font-size:1em; text-align:left; text-transform:uppercase; letter-spacing:0.15em; } .sideboxContent {text-align:left;padding:5px 0;} .sidebox #systemlinks {text-align:left;} .summaryList{border-bottom:1px solid #ccc;} #profile {text-align:center;} #freetext{padding:5px;} .listitem a, .listitem a:link, .listitem a:visited { background:transparent; border-bottom:1px solid #ccc; display:block; padding:3px 8px; color:#333; font-size:1em; font-weight:100; } .listitem a:hover { background:#ccc; border-bottom:1px solid #ccc; color:#292929; } .sidebox #latestmonth table{ width:95%; margin-left:auto; margin-right:auto; text-align:center; } .latestmonth-active{ background:#e75b18; border:1px solid #e75b18; margin:1px; padding:3px; } .latestmonth-inactive{ background:transparent; border:1px solid #ccc; margin:1px; padding:3px; } .latestmonth-active a, .latestmonth-active a:link, .latestmonth-active a:active { color:#f4f4f4; text-decoration:none; } .latestmonth-active a:hover{ text-decoration:underline; } .latestmonth-active:hover { background:#333; border:1px solid #333; } .profile-label { color:#e75b18; font-weight:100; } /*****BODY*****/ .bodyheaderblock {display:none;} .body-title {display:none;} .bodynavblock {background:transparent; padding:20px;} .body-midtitle {display:none;} /*****FOOTER *****/ #footer-menu { background:transparent; font-size:0.6875em/*11px*/; padding:10px; text-align:right; } #footer-menu ul {list-style:none;} #footer-menu li {display:inline;} #footer-menu a, #footer-menu a:link, .footer-menu a:visited { background:#e75b18; padding:5px; margin:2px; color:#fff; text-decoration:none; text-transform:uppercase; } #footer-menu a:hover{ background:#e14900; color:#ffff; } .pagefooterblock { /*the "this page was loaded..." part*/ background:transparent padding:3px; color:#333; font-size:0.625em/*10px*/; text-align:center; text-transform:uppercase; } .pagefooterblock a, .pagefooterblock a:link, .pagefooterblock a:visited { color:#e75b18; text-decoration:underline; text-transform:none; } .pagefooterblock a:hover {text-decoration:none;} /*****ENTRY*****/ #welcomenoteText{background:#fff;} .entryHolder { background:#292929 url(http://www.mentahelada.net/lj-layouts/layout019/bg-entry.jpg) repeat; margin-bottom:20px; width:960px; font-size:0.75em/*12px*/; } .entryUserinfo{ background:transparent; text-align:center; margin-bottom:10px; width:242px; } .entryUserinfo a{ font-size:0.9166em/*11px*/; color:#fff; } .entryUserinfo b, .entryUserinfo strong{ font-weight:100; color:#fff; } .entryUserinfo-username{ padding-top:5px; margin-bottom:20px; } .entryUserinfo-usericon a img{ background:transparent; margin:80px 10px 0 0; } .entryUserinfo-usericon a:hover img{ background:transparent; margin:80px 10px 0 0; } .entryText { background:#fff; padding:70px 10px 10px; line-height:1.7em; min-height:130px; } /*--1st line: all images posted will have a fixed width. 2nd line: a fix for polls-- .entryText img{max-width:700px;height:auto;} .entryText table tbody img, .entryText p span img{width:auto;height:auto;}*/ .entryText ul li { list-style:circle; margin-left:50px; padding-left:0px; } .entryText ol li { list-style:decimal-leading-zero; margin-left:50px; padding-left:0px; } .entryHeader { /*date / time container*/ background:#fff; overflow:hidden; color:#333; font-weight:100; clear:both!important; } .entryHeaderSubject { margin:20px 0 0 252px; position:absolute; font-size:1.55em; font-style:normal; font-weight:900; line-height:1.2em; letter-spacing:0.09em; text-transform:uppercase; width:700px; padding:0 10px 0 0; overflow:hidden; } .entryHeaderDate { background:#292929; margin:0; padding:20px 10px; position:absolute; width:222px; color:#ccc; font-size:1em; letter-spacing:0.2em; text-align:center; text-decoration:none; } .entryHeader a, .entryHeader a:link, .entryHeader a:visited{ color:#333; font-weight:900; text-decoration:none; text-transform:uppercase; } .entryHeader a:hover{ color:#e75b18; text-decoration:none; } .entryMetadata { background:#fff; border-top:1px solid #ccc; padding:10px; text-align:left; } .entryMetadata-content {padding-left:5px;} .entryMetadata a{text-transform:none;} .entryMetadata-label {font-weight:100;} .entryMetadata li { background:transparent; display:block; list-style:none; margin:2px 0; padding:2px 0; } .entryLinkbar { background:#292929; padding:15px 0; font-size:0.9090em/*10px*/; color:#163b58; text-align:right; } .entryLinkbar li { display:inline; list-style:none; font-weight:100; } .entryLinkbar li a, .entryLinkbar li a:link, .entryLinkbar li a:visited{ background:#292929; border-left:1px solid #fff; padding:15px 6px; color:#ccc; text-decoration:none; text-transform:uppercase; } .entryLinkbar li a:hover { background:#e75b18; color:#fff; text-decoration:none; } /*****COMMENT PAGE *****/ .commentHolder { background:#fff; color:#333; font-size:0.75em/*12px*/; margin:10px; } .commentUserinfo { margin:10px 0 10px 10px; padding:0; text-align:center; } .commentUserinfo-usericon a{color:#666;} .commentUserinfo b, .commentUserinfo strong{ font-weight:100; color:#666; } .commentUserinfo-username { padding-top:5px; margin-bottom:20px; font-size:11px!important; } .commentUserinfo-usericon a img{ background:transparent; border:1px solid #ccc; padding:10px; } .commentUserinfo-usericon a:hover img{ background:transparent; border:1px solid #eae8e8; padding:10px; } .commentText {padding:10px;} .commentHeader { background:#292929; padding:10px; color:#ccc; text-transform:none; } .commentHeader a, .commentHeader a:link, .commentHeader a:visited{ color:#e75b18; text-decoration:underline; } .commentHeader a:hover {text-decoration:none;} .commentHeaderScreened{ background:#999; padding:10px; color:#fff; text-transform:none; } .commentHeaderSubject { font-weight:100; text-transform:uppercase; } .commentLinkbar { background:transparent; padding:10px; font-size:0.9166em/*11px*/; color:#e75b18; text-align:right; } .commentLinkbar li { display:inline; list-style:none; font-weight:100; } .commentLinkbar li a, .commentLinkbar li a:link, .commentLinkbar li a:visited{ background:#292929; padding:3px; margin:1px; color:#ccc; text-decoration:none; } .commentLinkbar li a:hover { background:#e75b18; color:#fff; } .replyform { background:#fff; padding:10px; color:#333; } #qrform table { border:0!important; margin:5px; padding:5px; height:auto; } #commenttext{width:100%;} #qrdiv, #qrformdiv{background:#fff;} #postform{font-size:0.75em/*12px*/;} /*****ARCHIVE PAGE *****/ .month { background:#fff; margin:30px auto; width:70%; } .daysubjects { background:#fff; color:#333; padding:30px 10px; } .daytitles { background:transparent; border:0; height:2em; color:#e75b18; font-size:1.1666em/*14px*/; text-align:center; } .day-blank { background:#292929; border:2px solid #fff; } .day{ background:#ccc; border:2px solid #fff; padding:2px; color: #333; } .day-date { border:0; color:#333; width:50%; text-align:center; } .day-count { float:right; text-align:center; width:50%; font-size:1.6666em/*20px*/; } .day-count a, .day-count a:link, .day-count a:visited { color:#e75b18; text-decoration:none; } .day-count a:hover { color:#333; text-decoration:none; } /*****TAGS PAGE *****/ .tagstable { margin:10px auto; width:90%; font-family:Georgia, "Times New Roman", Times, serif; font-size:1.1666em/*14px*/; } .tagstable td { background:transparent; border:2px solid #ccc; padding:5px; } /*****LJ-USER / COMMUNITY / PROTECTED ICONS*****/ .ljuser img { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout019/user.png) no-repeat; padding: 16px 16px 0 0!important;} .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout019/user.png) no-repeat; padding: 16px 16px 0 0!important;} .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/home.png) no-repeat; padding: 16px 16px 0 0!important;} .entryHeaderSubject img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/key.png) no-repeat; padding: 16px 16px 0 0!important;} .summaryList img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/key.png) no-repeat; padding: 16px 16px 0 0!important;} .subject img[src="http://l-stat.livejournal.com/img/icon_protected.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/key.png) no-repeat; padding: 16px 16px 0 0!important;} .entryHeaderSubject img[src="http://l-stat.livejournal.com/img/icon_private.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/key.png) no-repeat; padding: 16px 16px 0 0!important;} .entryHeaderSubject img[src="http://l-stat.livejournal.com/img/community.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/home.png) no-repeat; padding: 16px 16px 0 0!important;} .entryHeaderSubject img[src="http://l-stat.livejournal.com/img/userinfo.gif"]{ width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout019/user.png) no-repeat; padding: 16px 16px 0 0!important;} .daysubjects img[src="http://l-stat.livejournal.com/img/icon_protected.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/key.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout019/user.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout019/user.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/home.png) no-repeat; padding: 16px 16px 0 0!important;} /*****CONTEXTUAL POPUP****/ div.ContextualPopup img {border:0;} div.ContextualPopup div.Inner {background:#fff!important; padding:5px;color:#333!important; font-size:1em; font-weight:100!important;border:2px solid #ccc;} div.ContextualPopup .Content {font-weight:100!important; margin-right:50px;} div.ContextualPopup .Relation {font-size:1.2727em/*14px*/; font-weight:100!important;color:#e75b18!important;} div.ContextualPopup .Content .OnlineStatus {font-weight:100!important;} div.ContextualPopup .Userpic {font-weight:100!important;} div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited {color:#e75b18!important;font-weight:100; text-decoration:none!important; text-transform:none;} div.ContextualPopup div.Inner a:hover{color:#ccc!important;font-weight:100; text-decoration:underline!important;}

Live preview | Image Preview
/********************DO NOT REMOVE THIS******************** Layout 019 [Sarcastic Mister Know It All] by Yam @ Frozen Mint (frozen_mint.livejournal.com) ----------CREDITS: Icons: http://www.famfamfam.com/lab/icons/silk/ Textures in header by: http://community.livejournal.com/dearest/ W/SIDEBAR *************************************************************/ /*****BASIC LAYOUT*****/ body { background:#fff url(http://www.mentahelada.net/lj-layouts/layout019/bg-body.jpg) top left repeat fixed; color:#333; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:100%; line-height:103%; } .pageblock{ /*the content*/ background:transparent; margin:20px auto; width:960px; } .pageheaderblock { margin-bottom:20px; font-size:0.6875em/*11px*/; text-align:left; width:960px; margin:0 auto; } .bodyblock { /*entries + sidebar*/ background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/bg-header2.jpg) top no-repeat; margin:0 auto; padding-top:310px; /*CHANGE THIS TO FIT YOUR HEADER HEIGHT*/ overflow:hidden; } .sidebar { background:transparent; width:250px; margin-right:10px; font-size:0.6875em/*11px*/; } /*****BASICS*****/ * {margin: 0; padding: 0;} .ippu {font-size:11px;} a{outline:none;} a img{border:0;} p, td {font-size:inherit;} code, kbd, pre, tt {font-family:monospace;} i, em{font-style:italic;} textarea {max-width:530px;} .clear{height:0;} .lj_embedcontent{max-width:530px;} #lj_controlstrip {background:#fff!important; border-bottom:1px solid #d4d4d4; padding:3px; color:#90c33c!important;} #lj_controlstrip a{color:#90c33c; text-decoration:underline; text-transform:none;} #lj_controlstrip a:hover{color:#333; text-decoration:none;} #lj_controlstrip_statustext{color:#90c33c; font-weight:100;} #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search{border:0;} a, a:link, a:visited { color:#90c33c; font-weight:200; text-decoration:none; text-transform:uppercase; } a:hover { color:#333; text-decoration:underline; } blockquote { background:#90c33c; margin:10px auto; padding:20px; width:90%; color:#fff; font:italic normal 100 1.0909em Georgia, "Times New Roman", Times, serif; text-align:left; line-height:1.6em; } blockquote a{color:#292929!important; text-transform:none!important;} ::-moz-selection {background:#ccc;color:#333;} b, strong{color:#90c33c;font-weight:900;} /*****HEADER*****/ .header-title {display:none;} .header-subtitle {display:none;} .header-icon {display:none;} .header-menu ul{} .header-menu li{display:inline;} .header-menu { background:#90c33c; padding:20px 0 10px; } .header-menu a, .header-menu a:link, .header-menu a:visited { background:#90c33c; border-right:1px solid #fff; margin:0; padding:20px 8px 10px ; color:#fff; font-weight:normal!important; text-decoration:none; text-transform:uppercase; } .header-menu a:hover { background:#79ad25; padding:20px 8px 10px; color:#fff; } /*****SIDEBAR*****/ .sidebar a{text-decoration:none; text-transform:none;} .sidebox { background:#fff; margin-bottom:10px; margin-right:10px; } .sideboxTitle { background:#90c33c; padding:10px 5px 5px; color:#fff; font-size:1em; text-align:left; text-transform:uppercase; letter-spacing:0.15em; } .listtitle { /*titles in the link list*/ background:#90c33c; padding:10px 5px 5px; margin:10px 0 5px; color:#fff; font-size:1em; text-align:left; text-transform:uppercase; letter-spacing:0.15em; } .sideboxContent {text-align:left;padding:5px 0;} .sidebox #systemlinks {text-align:left;} .summaryList{padding-bottom:10px;} #profile {text-align:center;} #summary, #search, #tags_sidebox, #freetext {padding:5px;} .listitem a, .listitem a:link, .listitem a:visited { background:transparent; border-bottom:1px solid #ccc; display:block; padding:3px 8px; color:#333; font-size:1em; font-weight:100; } .listitem a:hover { background:#ccc; border-bottom:1px solid #ccc; color:#292929; } .sidebox #summary a, .sidebox #tags_sidebox a{ background:transparent; color:#333; font-size:1em; font-weight:100; } .sidebox #summary a:hover, .sidebox #tags_sidebox a:hover { color:#90c33c; } .sidebox #latestmonth table{ width:95%; margin-left:auto; margin-right:auto; text-align:center; } .latestmonth-active{ background:#90c33c; border:1px solid #90c33c; margin:1px; padding:3px; } .latestmonth-inactive{ background:transparent; border:1px solid #ccc; margin:1px; padding:3px; } .latestmonth-active a, .latestmonth-active a:link, .latestmonth-active a:active { color:#f4f4f4; text-decoration:none; } .latestmonth-active a:hover{text-decoration:underline;} .latestmonth-active:hover { background:#333; border:1px solid #333; } .profile-label { color:#90c33c; font-weight:100; } /*****BODY*****/ .bodyheaderblock {display:none;} .body-title {display:none;} .bodynavblock {background:transparent; padding:20px;} .body-midtitle {display:none;} /*****FOOTER *****/ #footer-menu { background:transparent; font-size:0.6875em/*11px*/; padding:10px; text-align:right; } #footer-menu ul {list-style:none;} #footer-menu li {display:inline;} #footer-menu a, #footer-menu a:link, .footer-menu a:visited { background:#90c33c; padding:5px; margin:2px; color:#fff; text-decoration:none; text-transform:uppercase; } #footer-menu a:hover{ background:#79ad25; color:#ffff; } .pagefooterblock { /*the "this page was loaded..." part*/ background:transparent padding:3px; color:#333; font-size:0.625em/*10px*/; text-align:center; text-transform:uppercase; } .pagefooterblock a, .pagefooterblock a:link, .pagefooterblock a:visited { color:#90c33c; text-decoration:underline; text-transform:none; } .pagefooterblock a:hover {text-decoration:none;} /*****ENTRY*****/ #welcomenoteText{background:#fff;} .entryHolder { background:#292929 url(http://www.mentahelada.net/lj-layouts/layout019/bg-entry.jpg) repeat; margin-bottom:20px; font-size:0.75em/*12px*/; } .entryUserinfo{ background:transparent; text-align:center; margin-bottom:10px; width:150px; } .entryUserinfo a{ font-size:0.9166em/*11px*/; color:#fff; } .entryUserinfo b, .entryUserinfo strong{ font-weight:100; color:#fff; } .entryUserinfo-username{ padding-top:5px; margin-bottom:20px; } .entryUserinfo-usericon a img{ background:transparent; margin:80px 10px 0 0; } .entryUserinfo-usericon a:hover img{ background:transparent; margin:80px 10px 0 0; } .entryText { background:#fff; padding:85px 10px 10px; line-height:1.7em; min-height:130px; } /*--1st line: all images posted will have a fixed width. 2nd line: a fix for polls--*/ .entryText img{max-width:530px;height:auto;} .entryText table tbody img, .entryText p span img{width:auto;height:auto;} .entryText ul li { list-style:circle; margin-left:50px; padding-left:0px; } .entryText ol li { list-style:decimal-leading-zero; margin-left:50px; padding-left:0px; } .entryHeader { /*date / time container*/ background:#fff; overflow:hidden; color:#333; font-weight:100; clear:both!important; } .entryHeaderSubject { margin:20px 0 0 160px; position:absolute; font-size:1.55em; font-style:normal; font-weight:900; line-height:1.2em; letter-spacing:0.09em; text-transform:uppercase; width:530px; padding:0 10px 0 0; overflow:hidden; } .entryHeaderDate { background:#292929; margin:0; padding:20px 10px; position:absolute; width:130px; color:#ccc; font-size:1em; letter-spacing:0.2em; text-align:center; text-decoration:none; } .entryHeader a, .entryHeader a:link, .entryHeader a:visited{ color:#333; font-weight:900; text-decoration:none; text-transform:uppercase; } .entryHeader a:hover{ color:#90c33c; text-decoration:none; } .entryMetadata { background:#fff; border-top:1px solid #ccc; padding:10px; text-align:left; } .entryMetadata-content {padding-left:5px;} .entryMetadata a{text-transform:none;} .entryMetadata-label {font-weight:100;} .entryMetadata li { background:transparent; display:block; list-style:none; margin:2px 0; padding:2px 0; } .entryLinkbar { background:#292929; padding:15px 0; font-size:0.9090em/*10px*/; color:#163b58; text-align:right; } .entryLinkbar li { display:inline; list-style:none; font-weight:100; } .entryLinkbar li a, .entryLinkbar li a:link, .entryLinkbar li a:visited{ background:#292929; border-left:1px solid #fff; padding:15px 6px; color:#ccc; text-decoration:none; text-transform:uppercase; } .entryLinkbar li a:hover { background:#90c33c; color:#fff; text-decoration:none; } /*****COMMENT PAGE *****/ .commentHolder { background:#fff; color:#333; font-size:0.75em/*12px*/; margin:10px; } .commentUserinfo { margin:10px 0 10px 10px; padding:0; text-align:center; } .commentUserinfo-usericon a{color:#666;} .commentUserinfo b, .commentUserinfo strong{ font-weight:100; color:#666; } .commentUserinfo-username { padding-top:5px; margin-bottom:20px; font-size:11px!important; } .commentUserinfo-usericon a img{ background:transparent; border:1px solid #ccc; padding:10px; } .commentUserinfo-usericon a:hover img{ background:transparent; border:1px solid #eae8e8; padding:10px; } .commentText {padding:10px;} .commentHeader { background:#292929; padding:10px; color:#ccc; text-transform:none; } .commentHeader a, .commentHeader a:link, .commentHeader a:visited{ color:#90c33c; text-decoration:underline; } .commentHeader a:hover {text-decoration:none;} .commentHeaderScreened{ background:#999; padding:10px; color:#fff; text-transform:none; } .commentHeaderSubject { font-weight:100; text-transform:uppercase; } .commentLinkbar { background:transparent; padding:10px; font-size:0.9166em/*11px*/; color:#90c33c; text-align:right; } .commentLinkbar li { display:inline; list-style:none; font-weight:100; } .commentLinkbar li a, .commentLinkbar li a:link, .commentLinkbar li a:visited{ background:#292929; padding:3px; margin:1px; color:#ccc; text-decoration:none; } .commentLinkbar li a:hover { background:#90c33c; color:#fff; } .replyform { background:#fff; padding:10px; color:#333; } #qrform table { border:0!important; margin:5px; padding:5px; height:auto; } #commenttext{width:100%;} #qrdiv, #qrformdiv{background:#fff;} #postform{font-size:0.75em/*12px*/;} /*****ARCHIVE PAGE *****/ .month { background:#fff; margin:30px auto; width:70%; } .daysubjects { background:#fff; color:#333; padding:30px 10px; } .daytitles { background:transparent; border:0; height:2em; color:#90c33c; font-size:1.1666em/*14px*/; text-align:center; } .day-blank { background:#292929; border:2px solid #fff; } .day{ background:#ccc; border:2px solid #fff; padding:2px; color: #333; } .day-date { border:0; color:#333; width:50%; text-align:center; } .day-count { float:right; text-align:center; width:50%; font-size:1.6666em/*20px*/; } .day-count a, .day-count a:link, .day-count a:visited { color:#90c33c; text-decoration:none; } .day-count a:hover { color:#333; text-decoration:none; } /*****TAGS PAGE *****/ .tagstable { margin:10px auto; width:90%; font-family:Georgia, "Times New Roman", Times, serif; font-size:1.1666em/*14px*/; } .tagstable td { background:transparent; border:2px solid #ccc; padding:5px; } /*****LJ-USER / COMMUNITY / PROTECTED ICONS*****/ .ljuser img { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout019/user.png) no-repeat; padding: 16px 16px 0 0!important;} .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout019/user.png) no-repeat; padding: 16px 16px 0 0!important;} .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/home.png) no-repeat; padding: 16px 16px 0 0!important;} .entryHeaderSubject img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/key.png) no-repeat; padding: 16px 16px 0 0!important;} .summaryList img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/key.png) no-repeat; padding: 16px 16px 0 0!important;} .subject img[src="http://l-stat.livejournal.com/img/icon_protected.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/key.png) no-repeat; padding: 16px 16px 0 0!important;} .entryHeaderSubject img[src="http://l-stat.livejournal.com/img/icon_private.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/key.png) no-repeat; padding: 16px 16px 0 0!important;} .entryHeaderSubject img[src="http://l-stat.livejournal.com/img/community.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/home.png) no-repeat; padding: 16px 16px 0 0!important;} .entryHeaderSubject img[src="http://l-stat.livejournal.com/img/userinfo.gif"]{ width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout019/user.png) no-repeat; padding: 16px 16px 0 0!important;} .daysubjects img[src="http://l-stat.livejournal.com/img/icon_protected.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/key.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout019/user.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout019/user.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/home.png) no-repeat; padding: 16px 16px 0 0!important;} /*****CONTEXTUAL POPUP****/ div.ContextualPopup img {border:0;} div.ContextualPopup div.Inner {background:#fff!important; padding:5px;color:#333!important; font-size:1em; font-weight:100!important;border:2px solid #ccc;} div.ContextualPopup .Content {font-weight:100!important; margin-right:50px;} div.ContextualPopup .Relation {font-size:1.2727em/*14px*/; font-weight:100!important;color:#90c33c!important;} div.ContextualPopup .Content .OnlineStatus {font-weight:100!important;} div.ContextualPopup .Userpic {font-weight:100!important;} div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited {color:#90c33c!important;font-weight:100; text-decoration:none!important; text-transform:none;} div.ContextualPopup div.Inner a:hover{color:#ccc!important;font-weight:100; text-decoration:underline!important;} Orange version with sidebar:
Live preview | CSS Green version with topbar:
Live preview | CSS
LAYOUT INFO:
  • Style: Smooth Sailing
  • Account level: Basic, Paid, Plus
  • Tested on: IE (7 and higher), Firefox Safari and Chrome.

IMAGES:
Please upload the images to your own server. Thanks.
Body background: http://www.mentahelada.net/lj-layouts/layout019/bg-body.jpg
Entry background: http://www.mentahelada.net/lj-layouts/layout019/bg-entry.jpg
Robert prettier header (:D): http://www.mentahelada.net/lj-layouts/layout019/bg-header.png (Use it with another layout if you wish! Just credit me. :D)
Green header: http://www.mentahelada.net/lj-layouts/layout019/bg-header2.jpg (Use it with another layout if you wish! Just credit me. :D)
Textures in green header by dearest
User, community, locked/protected icons:


(by FamFamFam)
Carlisle icon in the preview made by me. Find it here.
BASIC INSTRUCTIONS:
  1. Choose a Smooth Sailing layout
  2. Go to Customize Journal Theme
  3. Select NO in the dropdowns
  4. Leave "Custom External Stylesheet" empty
  5. Paste the CSS that I give you in the "Custom Stylesheet" box
  6. Save.
  7. ETA: Go to the customize main page and, under "Additional Options", choose "no" in "Wrap Entry text under userinfo" line. Save again.
  • Make changes if you know how (but still credit me!)
  • Ask if you have doubts, I'll try to answer asap

CUSTOMIZING TOPBAR LAYOUT:
If you want to change the header, find this part of the code:
.bodyblock { /*entries + sidebar*/
background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/bg-header.png) top no-repeat;
margin:0 auto;
padding-top:525px; /*CHANGE TO FIT TOPBAR SIZE*/
width:960px;
overflow:hidden;
}
And change the url to your own. Your header must be 960x300px to fit the layout. Also, change the padding-top so your entries don't overlap the topbar.
You should be able to add whatever you want to the topbar, but keep your summary and link list as short as possible.

CHANGING HEADER OF SIDEBAR LAYOUT:
Easy. Find this part of the code:
.bodyblock { /*entries + sidebar*/
background:transparent url(http://www.mentahelada.net/lj-layouts/layout019/bg-header2.jpg) top no-repeat;
margin:0 auto;
padding-top:310px; /*CHANGE THIS TO FIT YOUR HEADER HEIGHT*/
overflow:hidden;
}
And change the url to your own. Your header must be 960px width to fit the layout. Also, change the padding-top to fit your header height.

USED COLORS:
Orange layout:
Main orange: e75b18
Header-hover orange: e14900

Green layout:
Main green: 90c33c
Header-hover green: 79ad25

EASY RULES:
  • Credit frozen_mint if you use. Please don't credit mintyapple, please change the credit you have in your userinfo. Thanks!
  • Comment if you like / if you take

@ mintyapple

Oh, and I have two new affiliates:
pavanes &
deegroovy_icons.
Both make amazing icons. Please go to their pretty journals and friend them for updates! :D

layouts:topbar, layouts:smooth sailing, headers, headers:robert pattinson, layouts, ! affiliates

Leave a comment

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