032 - Layout 012 [Flexisquares: Dressed In Summer Clothes]

Jan 15, 2009 19:12


Here I am with the most... non-brighty layout I could ever made. smashleighfig asked for something like this and here it is. Honey, I sent you a private message with the code. You can use it when you want. :)
Watch the original here.
And here is the version for all of you. With and without sidebar. Enjoy!



Live preview | Image Preview





Live preview | Image Preview
/********************DO NOT REMOVE THIS******************** Layout 012 [Dressed In Summer Clothes] by Yam @ Frozen Mint (frozen_mint.livejournal.com) Style: Flexible Squares Account level: Basic / Paid / Plus Tested on: IE (7 and higher), Firefox, Safari and Chrome CREDITS: Header image by Dearest (http://community.livejournal.com/dearest/) WITH SIDEBAR *****************************************************/ /*****BASICS*****/ * {margin: 0; padding: 0;} i, em{font-style:italic;} .ippu {font-size:12px;} a{outline:none;} a img{border:0;} p, td {font-size:inherit;} code, kbd, pre, tt {font-family:monospace;} #lj_controlstrip {background:transparent!important;padding:3px; color:#fff!important; text-transform:none!important;} #lj_controlstrip a{color:#fff; text-decoration:none; text-transform:none;} #lj_controlstrip a:hover{color:#fff; text-decoration:underline;} #lj_controlstrip b{color:#fff!important; text-decoration:none; text-transform:none;} #lj_controlstrip_statustext{color:#fff; font-weight:100;} #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search{border:0;} body { background:#82a84a url() top left repeat fixed; color:#3c3c3c; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:100%/*16px*/; line-height:104%; } a, a:link, a:visited { color:#82a84a; font-weight:300; text-decoration:none; text-transform:uppercase; } a:hover { text-decoration:underline; } blockquote { background:#82a84a; margin:10px auto; padding:20px 20px 20px 15px; width:65%; color:#f4f4f4; font-size:1.0909em/*12px*/; font-style:italic; text-align:left; } ::-moz-selection { background:#82a84a; color:#f4f4f4; } b, strong{ color:#444; font-weight:bold; } /*****LAYOUT*****/ #content { background:#f4f4f4; margin:15px auto; padding:15px; width:770px; } #header { background:#82a84a url(http://www.mentahelada.net/lj-layouts/layout012/header-dearest.jpg) top right no-repeat; height:230px; font-size:0.6875em/*11px*/; text-align:left; } #sidebar { background:transparent; float:right; padding-bottom:5px; width:220px; font-size:0.6875em/*11px*/; text-align:left; } #maincontent { background:transparent; border-right:1px solid #ccc; margin: 0 235px 0 0; font-size:0.6875em/*11px*/; } #footer { background:transparent; border-top:1px solid #ccc; font-size:0.6875em/*11px*/; text-align:left; } /*****HEADER*****/ ul.navheader { float:right; margin:0; padding:15px; width:200px; } ul.navheader li{list-style:none;} #header li.view { background:transparent url(http://www.mentahelada.net/lj-layouts/layout012/trans-gray.png) repeat; display:block; margin:0 0 3px 0; padding:5px 10px; color:#f4f4f4; font-weight:normal; text-align:left; text-decoration:none; text-transform:uppercase; } #header a, #header a:link, #header a:visited { background:transparent url(http://www.mentahelada.net/lj-layouts/layout012/trans-black.png) repeat; display:block; margin:0 0 3px 0; padding:5px 10px; color:#f4f4f4; font-weight:normal; text-align:left; text-decoration:none; text-transform:uppercase; } #header a:hover { background:transparent url(http://www.mentahelada.net/lj-layouts/layout012/trans-gray.png) repeat; display:block; color:#f4f4f4; font-weight:normal; text-decoration:none; text-transform:uppercase; } .title, .subtitle {display:none;} /*****SIDEBAR******/ .defaultuserpic { display:none; margin:15px auto; text-align:center; } li.sbartitle { background:transparent; border-bottom:1px solid #ccc; list-style:none; margin-top:15px; padding:0; color:#5d5d5d; font-size:1em/*11px*/; text-align:left; text-transform:uppercase; font-weight:normal; } .sbarbody2 { background-color:transparent; padding:10px 0; } div#sidebar a, div#sidebar a:link, div#sidebar a:visited { color:#82a84a; font-weight:normal; text-decoration:none; text-transform:none; } div#sidebar a:hover { background:transparent; font-weight:normal; text-decoration:underline; } ul.sbarlist {list-style:none;} li.sbaritem { background:#f4f4f4; border-bottom:1px dotted #ccc; padding:5px; font-weight:normal; text-align:left; text-decoration:none; } #sidebar_linklist li.sbaritem a, #sidebar_tags li.sbaritem a{ display:block; text-decoration:none!important; } #sidebar_linklist li.sbaritem:hover, #sidebar_tags li.sbaritem:hover{ background:#e8e8e8; border-bottom:1px dotted #82a84a; } #sidebar_summary li.sbaritem { background:#f4f4f4; border-bottom:1px dotted #ccc; padding:5px; font-weight:normal; text-align:left; text-decoration:none; } #sidebar_summary li.sbaritem a:hover{ font-weight:normal!important; text-decoration:underline; } #sidebar_summary li.sbaritem:hover{ display:block; background:#e8e8e8; border-bottom:1px dotted #82a84a; } table.calendar { background:#f9f9f9; padding:10px; margin:auto; width:100%; } .sbarcalendar { background:#e8e8e8; border:1px solid #e8e8e8; font-size:1em/*12px*/; padding:2px; text-align:center; } .sbarcalendarposts { background:#82a84a; border:1px solid #82a84a; font-size:1em/*12px*/; padding:2px; text-align:center; } .sbarcalendarposts a, .sbarcalendarposts a:link, .sbarcalendarposts a:visited{color:#f9f9f9!important;} .sbarcalendarposts a:hover{ color:#f4f4f4!important; text-decoration: underline!important; font-weight:normal!important; } .sbarcalendarposts:hover{ background:#5d5d5d; border:1px solid #5d5d5d; } /*****FOOTER*****/ ul.navfooter {margin:20px 0 10px;} ul.navfooter li { display:inline; list-style:none; } #footer li.viewing { background:#f4f4f4; color:#444; text-transform:uppercase; text-decoration:none; margin:0; padding:10px; } #footer a, #footer a:link, #footer a:visited { background:#e8e8e8; color:#5d5d5d; text-transform:uppercase; text-decoration:none; font-weight:normal; padding:10px; } #footer a:hover { background:#f4f4f4; color:#444; } /*****ENTRY****/ .subcontent { background:#f4f4f4; border-bottom:1px solid #ccc; overflow:auto; margin-bottom:5px; padding:15px 10px 0 0; } .entry{text-align:left;} .entry ul li { list-style:circle; margin-left:40px; padding-left:0; } .entry ol li { list-style:decimal-leading-zero; margin-left:40px; padding-left:0; } /*****USERPICS*****/ .userpic, .userpicfriends { background:transparent!important; float:right; margin:0 5px 10px 10px; position:relative; font-size:0.9090em/*10px*/; text-align:center; text-transform:lowercase; } .userpicfriends font{ color:#666; font-size:1em/*10px*/; text-align:center; text-transform:lowercase; } .userpic a, .userpic a:link, .userpic a:visited, .userpicfriends a, .userpicfriends a:link, .userpicfriends a:visited, userpicfriends font{ background:transparent; color:#82a84a!important; text-decoration: none; text-transform:lowercase; } .userpic a, .userpicfriends a:hover, userpicfriends a:hover font { background:transparent; color:#82a84a!important; text-decoration:underline; text-transform:lowercase; } /*****DATE, SUBJECT, CURRENTS GENERAL, COMMENTS, TAGS*****/ .datesubject { background:transparent!important; padding:5px 0; } .date{ color:#5d5d5d; font-size:0.9090em/*10px*/; text-align:right; text-transform:lowercase; margin:0; } .subject { border-bottom:1px dotted #ccc; padding-bottom:5px; color:#5d5d5d; font-size:1.1818em/*13px*/; font-weight:normal; text-align:right; text-transform:uppercase; } .subject a, .subject a:link, .subject a:visited { color:#5d5d5d; font-weight:normal; text-align:left; text-decoration:none; text-transform:uppercase; } .subject a:hover { color:#82a84a; text-decoration:underline; } .ljtags { border-left:10px solid #ccc; margin-top:10px; padding:5px; color:#444; font-size:0.9090em/*10px*/; font-weight:normal; text-align:left; } .currents{ border-left:10px solid #ccc; margin-top:10px; padding:5px; color:#444; font-size:0.9090em/*10px*/; font-weight:normal; text-align:left; } .currents strong, .ljtags strong { color:#444; font-weight:normal; } .ljtags a, .ljtags a:link, .ljtags a:visited, .currents a, .currents a:link, .currents a:visited { background:transparent; color:#5d5d5d; font-weight:normal; text-decoration:none; } .ljtags a:hover, .currents a:hover { color:#82a84a; text-decoration:underline; } .comments { border-left:10px solid #ccc; margin-top:10px; padding:5px; color:#444; font-size:0.9090em/*10px*/; font-weight:normal; text-align:left; } .comments a, .comments a:link, .comments a:visited { background:transparent; color:#82a84a; font-weight:normal; text-decoration:none; text-transform:uppercase; } .comments a:hover { color:#5d5d5d; text-decoration:underline; } /*****TAGS PAGE*****/ h2{ background:#f4f4f4; border-bottom:1px solid #ccc; list-style:none; padding:25px 0 5px; color:#444; font-size:1.1818em/*13px*/; font-weight:normal; line-height:1em; text-align:left; text-transform:uppercase; } .ljtaglist { background:#f4f4f4 url(http://www.mentahelada.net/lj-layouts/layout012/''); list-style:none; width:100%; } .ljtaglist li { background:#f4f4f4 url(http://www.mentahelada.net/lj-layouts/layout012/''); border-bottom:1px dotted #ccc; color:#666; padding:10px 5px 5px; } .ljtaglist a, .ljtaglist a:link, .ljtaglist a:visited { color:#82a84a; text-decoration:none; text-transform:none; } .ljtaglist a:hover { color:#5d5d5d; text-decoration:underline; font-weight:100; } /*****CALENDAR PAGE*****/ ul.year{ background:#f4f4f4; list-style:none; margin: 0 auto; padding:15px; text-align:center; } ul.year a, ul.year a:link, ul.year a:visited { padding:5px; color:#5d5d5d; text-decoration:none; text-transform:none; } ul.year a:hover { background:#82a84a; color:#f9f9f9; } ul.year li { display:inline; color:#666; } ul.year li.active { background:#82a84a; padding:5px; color:#f9f9f9; font-size:1.1538em/*15px*/; font-weight:normal; } table.yeartable { margin-left:auto; margin-right:auto; width:100%; padding:20px; background:#f4f4f4; } table.yeartable td.yeardate{ border:1px solid #e8e8e8; background:#e8e8e8; height:4em; padding:2px; } table.yeartable td.yearday { background:#82a84a; border:1px solid #82a84a; color:#f4f4f4; text-align:center; } td.yearmonth {color:#82a84a;} .yearmonth a, .yearmonth a:link, .yearmonth a:visited { background:transparent; padding:3px; color:#82a84a; text-decoration:underline; text-transform:none; } .yearmonth a:hover { background:#82a84a; color:#f9f9f9; } table.yeartable td.yeardate a, table.yeartable td.yeardate a:link, table.yeartable td.yeardate a:visited { background:transparent; display:block; padding:5px; color:#666; font-size:1em/*12px*/; text-decoration:underline; text-transform:none; } table.yeartable td.yeardate a:hover { background:#5d5d5d; color:#f4f4f4; } /*****CLEARS, SKIPLINKS*****/ .clear{ height:0; background:transparent; } .clearfoot { clear: both; height:0; background:transparent; } .separator { height:0; background:transparent; } .skiplinks { background:#f4f4f4; border:0; margin:auto; padding:10px; color:#666; font-size:0.9166em/*11px*/; text-transform:none; text-align:center; } .skiplinks a, .skiplinks a:link, .skiplinks a:visited { padding:5px; color:#5d5d5d; text-decoration:none; text-transform:none; } .skiplinks a:hover { color:#f4f4f4; background:#5d5d5d; } /*****COMMENTS VIEW*****/ .datesubjectcomment { border-top:1px solid #ccc; border-bottom:1px dotted #ccc; padding:0; } .userpiccomment { float:left; margin:0 10px 10px 0; position:relative; width:70px; height:70px; } .box { font-size:1em/*12px*/; clear:left; color:#666; } input, textarea { background-color:#f4f4f4; border:1px solid #ccc; color:#666; } textarea.textbox { width:95%!important; } .reply{ background:#f4f4f4; margin:5px; padding:5px; position:relative; color:#666; text-align:left; } .replytosubject { font-weight:normal; } .commentreply { position:relative; padding:5px; color:#666; } .commentbox, .commentboxpartial { background:#f4f4f4; padding:10px; margin:5px 0; overflow:auto; } .datesubjectcomment a:link, .datesubjectcomment a:visited { color:#5d5d5d; text-decoration:none; } .datesubjectcomment a:hover { color:#82a84a; text-decoration:underline; } .commentinfo { background-color:#f4f4f4; margin-top:10px; width: 100%; } #qrform table { border:1px solid #f4f4f4!important; background:#f4f4f4; padding:10px; height:auto; } /*****LJ-USER / COMMUNITY / PROTECTED ICONS icons by http://www.brandspankingnew.net/*****/ .ljuser img {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout012/person.gif) no-repeat; padding: 10px 10px 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/layout012/person.gif) no-repeat; padding: 10px 10px 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/layout012/home.gif) no-repeat; padding: 10px 10px 0 0!important;} .entry img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout012/key.gif) no-repeat; padding: 10px 10px 0 0!important;} #sidebar_summary img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout012/key.gif) no-repeat; padding: 10px 10px 0 0!important;} #sidebar_summary img[src="http://l-stat.livejournal.com/img/icon_private.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout012/key.gif) no-repeat; padding: 10px 10px 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/layout012/key.gif) no-repeat; padding: 10px 10px 0 0!important;} .entry img[src="http://l-stat.livejournal.com/img/icon_private.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout012/key.gif) no-repeat; padding: 10px 10px 0 0!important;} #lj_controlstrip .ljuser img { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout012/person.gif) no-repeat; padding: 10px 10px 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/layout012/person.gif) no-repeat; padding: 10px 10px 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/layout012/home.gif) no-repeat; padding: 10px 10px 0 0!important;} /*****CONTEXTUAL POPUP*****/ div.ContextualPopup img {border:0 none;} div.ContextualPopup div.Inner {background:#fff!important; border:1px solid #ccc; padding:5px; color:#303030!important; font-size:1em; font-weight:100!important;} div.ContextualPopup .Content {margin-right:50px; font-weight:100!important;} div.ContextualPopup .Relation {color:#444; font-size:1.4em/*14px*/; font-weight:500!important; font-style:italic;} 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:#82a84a!important; font-weight:100; text-decoration:none!important;} div.ContextualPopup div.Inner a:hover{color:#303030!important; font-weight:100; text-decoration:none!important;} Without sidebar:
Live preview
/********************DO NOT REMOVE THIS******************** Layout 012 [Dressed In Summer Clothes] by Yam @ Frozen Mint (frozen_mint.livejournal.com) Style: Flexible Squares Account level: Basic / Paid / Plus Tested on: IE (7 and higher), Firefox, Safari and Chrome CREDITS: Header image by Dearest (http://community.livejournal.com/dearest/) W/O SIDEBAR *****************************************************/ /*****BASICS*****/ * {margin: 0; padding: 0;} i, em{font-style:italic;} .ippu {font-size:12px;} a{outline:none;} a img{border:0;} p, td {font-size:inherit;} code, kbd, pre, tt {font-family:monospace;} #lj_controlstrip {background:transparent!important;padding:3px; color:#fff!important; text-transform:none!important;} #lj_controlstrip a{color:#fff; text-decoration:none; text-transform:none;} #lj_controlstrip a:hover{color:#fff; text-decoration:underline;} #lj_controlstrip b{color:#fff!important; text-decoration:none; text-transform:none;} #lj_controlstrip_statustext{color:#fff; font-weight:100;} #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search{border:0;} body { background:#82a84a url() top left repeat fixed; color:#3c3c3c; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:100%/*16px*/; line-height:104%; } a, a:link, a:visited { color:#82a84a; font-weight:300; text-decoration:none; text-transform:uppercase; } a:hover { text-decoration:underline; } blockquote { background:#82a84a; margin:10px auto; padding:20px 20px 20px 15px; width:65%; color:#f4f4f4; font-size:1.0909em/*12px*/; font-style:italic; text-align:left; } ::-moz-selection { background:#82a84a; color:#f4f4f4; } b, strong{ color:#444; font-weight:bold; } /*****LAYOUT*****/ #content { background:#f4f4f4; margin:15px auto; padding:23px; width:770px; } #header { background:#82a84a url(http://www.mentahelada.net/lj-layouts/layout012/header-dearest.jpg) top right no-repeat; height:230px; font-size:0.6875em/*11px*/; text-align:left; } #sidebar {display:none;} #maincontent { background:transparent; border-right:0; margin: 0; font-size:0.6875em/*11px*/; } #footer { background:transparent; border-top:0; font-size:0.6875em/*11px*/; text-align:left; } /*****HEADER*****/ ul.navheader { float:right; margin:0; padding:25px; width:200px; } ul.navheader li{list-style:none;} #header li.view { background:transparent url(http://www.mentahelada.net/lj-layouts/layout012/trans-gray.png) repeat; display:block; margin:0 0 3px 0; padding:5px 10px; color:#f4f4f4; font-weight:normal; text-align:left; text-decoration:none; text-transform:uppercase; } #header a, #header a:link, #header a:visited { background:transparent url(http://www.mentahelada.net/lj-layouts/layout012/trans-black.png) repeat; display:block; margin:0 0 3px 0; padding:5px 10px; color:#f4f4f4; font-weight:normal; text-align:left; text-decoration:none; text-transform:uppercase; } #header a:hover { background:transparent url(http://www.mentahelada.net/lj-layouts/layout012/trans-gray.png) repeat; display:block; color:#f4f4f4; font-weight:normal; text-decoration:none; text-transform:uppercase; } .title, .subtitle {display:none;} /*****FOOTER*****/ ul.navfooter { margin:20px 0 10px; } ul.navfooter li { display:inline; list-style:none; } #footer li.viewing { background:#f4f4f4; color:#444; text-transform:uppercase; text-decoration:none; margin:0; padding:10px; } #footer a, #footer a:link, #footer a:visited { background:#e8e8e8; color:#5d5d5d; text-transform:uppercase; text-decoration:none; font-weight:normal; padding:10px; } #footer a:hover { background:#f4f4f4; color:#444; } /*****ENTRY*****/ .subcontent { background:#f4f4f4; border-bottom:1px solid #ccc; overflow:auto; margin-bottom:5px; padding:15px 0 0 0; } .entry{text-align:left;} .entry ul li { list-style:circle; margin-left:40px; padding-left:0; } .entry ol li { list-style:decimal-leading-zero; margin-left:40px; padding-left:0; } /*****USERPICS*****/ .userpic, .userpicfriends { background:transparent!important; float:right; margin:0 5px 10px 10px; position:relative; font-size:0.9090em/*10px*/; text-align:center; text-transform:lowercase; } .userpicfriends font{ color:#666; font-size:1em/*10px*/; text-align:center; text-transform:lowercase; } .userpic a, .userpic a:link, .userpic a:visited, .userpicfriends a, .userpicfriends a:link, .userpicfriends a:visited, userpicfriends font{ background:transparent; color:#82a84a!important; text-decoration: none; text-transform:lowercase; } .userpic a, .userpicfriends a:hover, userpicfriends a:hover font { background:transparent; color:#82a84a!important; text-decoration:underline; text-transform:lowercase; } /*****DATE, SUBJECT, CURRENTS GENERAL, COMMENTS, TAGS*****/ .datesubject { background:transparent!important; padding:5px 0; } .date{ color:#5d5d5d; font-size:0.9090em/*10px*/; text-align:right; text-transform:lowercase; margin:0; } .subject { border-bottom:1px dotted #ccc; padding-bottom:5px; color:#5d5d5d; font-size:1.1818em/*13px*/; font-weight:normal; text-align:right; text-transform:uppercase; } .subject a, .subject a:link, .subject a:visited { color:#5d5d5d; font-weight:normal; text-align:left; text-decoration:none; text-transform:uppercase; } .subject a:hover { color:#82a84a; text-decoration:underline; } .ljtags { border-left:10px solid #ccc; margin-top:10px; padding:5px; color:#444; font-size:0.9090em/*10px*/; font-weight:normal; text-align:left; } .currents{ border-left:10px solid #ccc; margin-top:10px; padding:5px; color:#444; font-size:0.9090em/*10px*/; font-weight:normal; text-align:left; } .currents strong, .ljtags strong { color:#444; font-weight:normal; } .ljtags a, .ljtags a:link, .ljtags a:visited, .currents a, .currents a:link, .currents a:visited { background:transparent; color:#5d5d5d; font-weight:normal; text-decoration:none; } .ljtags a:hover, .currents a:hover { color:#82a84a; text-decoration:underline; } .comments { border-left:10px solid #ccc; margin-top:10px; padding:5px; color:#444; font-size:0.9090em/*10px*/; font-weight:normal; text-align:left; } .comments a, .comments a:link, .comments a:visited { background:transparent; color:#82a84a; font-weight:normal; text-decoration:none; text-transform:uppercase; } .comments a:hover { color:#5d5d5d; text-decoration:underline; } /*****TAGS PAGE*****/ h2{ background:#f4f4f4; border-bottom:1px solid #ccc; list-style:none; padding:25px 0 5px; color:#444; font-size:1.1818em/*13px*/; font-weight:normal; line-height:1em; text-align:left; text-transform:uppercase; } .ljtaglist { background:#f4f4f4 url(http://www.mentahelada.net/lj-layouts/layout012/''); list-style:none; width:100%; } .ljtaglist li { background:#f4f4f4 url(http://www.mentahelada.net/lj-layouts/layout012/''); border-bottom:1px dotted #ccc; color:#666; padding:10px 5px 5px; } .ljtaglist a, .ljtaglist a:link, .ljtaglist a:visited { color:#82a84a; text-decoration:none; text-transform:none; } .ljtaglist a:hover { color:#5d5d5d; text-decoration:underline; font-weight:100; } /*****CALENDAR PAGE*****/ ul.year{ background:#f4f4f4; list-style:none; margin: 0 auto; padding:15px; text-align:center; } ul.year a, ul.year a:link, ul.year a:visited { padding:5px; color:#5d5d5d; text-decoration:none; text-transform:none; } ul.year a:hover { background:#82a84a; color:#f9f9f9; } ul.year li { display:inline; color:#666; } ul.year li.active { background:#82a84a; padding:5px; color:#f9f9f9; font-size:1.1538em/*15px*/; font-weight:normal; } table.yeartable { margin-left:auto; margin-right:auto; width:100%; padding:20px; background:#f4f4f4; } table.yeartable td.yeardate{ border:1px solid #e8e8e8; background:#e8e8e8; height:4em; padding:2px; } table.yeartable td.yearday { background:#82a84a; border:1px solid #82a84a; color:#f4f4f4; text-align:center; } td.yearmonth {color:#82a84a;} .yearmonth a, .yearmonth a:link, .yearmonth a:visited { background:transparent; padding:3px; color:#82a84a; text-decoration:underline; text-transform:none; } .yearmonth a:hover { background:#82a84a; color:#f9f9f9; } table.yeartable td.yeardate a, table.yeartable td.yeardate a:link, table.yeartable td.yeardate a:visited { background:transparent; display:block; padding:5px; color:#666; font-size:1em/*12px*/; text-decoration:underline; text-transform:none; } table.yeartable td.yeardate a:hover { background:#5d5d5d; color:#f4f4f4; } /*****CLEARS, SKIPLINKS*****/ .clear{ height:0; background:transparent; } .clearfoot { clear: both; height:0; background:transparent; } .separator { height:0; background:transparent; } .skiplinks { background:#f4f4f4; border:0; margin:auto; padding:10px; color:#666; font-size:0.9166em/*11px*/; text-transform:none; text-align:center; } .skiplinks a, .skiplinks a:link, .skiplinks a:visited { padding:5px; color:#5d5d5d; text-decoration:none; text-transform:none; } .skiplinks a:hover { color:#f4f4f4; background:#5d5d5d; } /*****COMMENTS VIEW*****/ .datesubjectcomment { border-top:1px solid #ccc; border-bottom:1px dotted #ccc; padding:0; } .userpiccomment { float:left; margin:0 10px 10px 0; position:relative; } .box { font-size:1em/*12px*/; clear:left; color:#666; } input, textarea { background-color:#f4f4f4; border:1px solid #ccc; color:#666; } textarea.textbox {width:95%!important;} .reply{ background:#f4f4f4; margin:5px; padding:5px; position:relative; color:#666; text-align:left; } .replytosubject {font-weight:normal;} .commentreply { position:relative; padding:5px; color:#666; } .commentbox, .commentboxpartial { background:#f4f4f4; padding:10px; margin:5px 0; overflow:auto; } .datesubjectcomment a:link, .datesubjectcomment a:visited { color:#5d5d5d; text-decoration:none; } .datesubjectcomment a:hover { color:#82a84a; text-decoration:underline; } .commentinfo { background-color:#f4f4f4; margin-top:10px; width: 100%; } #qrform table { border:1px solid #f4f4f4!important; background:#f4f4f4; padding:10px; height:auto; } /*****LJ-USER / COMMUNITY / PROTECTED ICONS icons by http://www.brandspankingnew.net/*****/ .ljuser img {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout012/person.gif) no-repeat; padding: 10px 10px 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/layout012/person.gif) no-repeat; padding: 10px 10px 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/layout012/home.gif) no-repeat; padding: 10px 10px 0 0!important;} .entry img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout012/key.gif) no-repeat; padding: 10px 10px 0 0!important;} #sidebar_summary img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout012/key.gif) no-repeat; padding: 10px 10px 0 0!important;} #sidebar_summary img[src="http://l-stat.livejournal.com/img/icon_private.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout012/key.gif) no-repeat; padding: 10px 10px 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/layout012/key.gif) no-repeat; padding: 10px 10px 0 0!important;} .entry img[src="http://l-stat.livejournal.com/img/icon_private.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout012/key.gif) no-repeat; padding: 10px 10px 0 0!important;} #lj_controlstrip .ljuser img { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout012/person.gif) no-repeat; padding: 10px 10px 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/layout012/person.gif) no-repeat; padding: 10px 10px 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/layout012/home.gif) no-repeat; padding: 10px 10px 0 0!important;} /*****CONTEXTUAL POPUP*****/ div.ContextualPopup img {border:0 none;} div.ContextualPopup div.Inner {background:#fff!important; border:1px solid #ccc; padding:5px; color:#303030!important; font-size:1em; font-weight:100!important;} div.ContextualPopup .Content {margin-right:50px; font-weight:100!important;} div.ContextualPopup .Relation {color:#444; font-size:1.4em/*14px*/; font-weight:500!important; font-style:italic;} 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:#82a84a!important; font-weight:100; text-decoration:none!important;} div.ContextualPopup div.Inner a:hover{color:#303030!important; font-weight:100; text-decoration:none!important;}
LAYOUT INFO:
  • Style: Flexible Squares
  • Account level: Basic, Paid, Plus
  • Tested on: IE (7 and higher), Firefox Safari and Chrome. IE6 does not support PNG transparency, so this layout looks really ugly in that browser. I really hope you are not using it anymore.

IMAGES:
Please upload the images to your own server. Thanks.
Header (By Mozart @ dearest)
Header view and hover transparency, Header link transparency.
User, community, locked/protected icons:


(by BrandSpankingNew)
Carlisle icon in the preview made by me. Find it here.
BASIC INSTRUCTIONS:
  1. Choose a Flexible Squares 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.
  • Make changes if you know how (but still credit me!)
  • Ask if you have doubts, I'll try to answer asap

CHANGING THE HEADER:

If you want to change the header, find this part of the code:
#header {
background:#82a84a url(http://www.mentahelada.net/lj-layouts/layout012/header-dearest.jpg) top right no-repeat;
height:230px;
font-size:0.6875em/*11px*/;
text-align:left;
}
And change the url to your own. Change also the "height" so it fits your header size.

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

Also: I'm making LJ a more visually stimulating place -
find out how you can too!
:D

layouts:flexible squares, layouts

Previous post Next post
Up