InsaneJournal

Tweak says, "Dumbledore's Army"

♛ lobelia (lobelia) wrote,
@ 2011-11-15 00:09:00

Entry tags:

& stylesheet, - stylesheet: s2 complete style

stylesheet ▸ drowning

static preview

layout: drowning (#21)
live preview:

sorafune
theme: S2 Complete style
compatibility: Firefox, IE 8, Gchrome, Safari
features: Custom blurb support.

installation instructions:

1. Go to Customize Journal, under "Journal" in the sidebar.

2. In Basic choose S2 under Style System, and Save Changes.

3. In Look and Feel choose Complete under Layout (in Layout & Language). Save Changes.

4. In Custom Options choose Two column (Sidebar on Right) under Layout Type and paste the codes into the Custom stylesheet area. Save Changes.

5. Credit, and all done!

layout codes:

/* -------------------------------------------

s2 complete style: drowning, 14/11/2011
	available at lobelia.insanejournal.com
		
	stylesheet by mirka (medea.insanejournal.com)  
	complete style base code by emily ravenwood

-------------------------------------------  */

/* ------------------------------------------- 
		miscellaneous 
   -------------------------------------------  */

.pkg {}
.separator {}

blockquote { border-right: 1px dashed #ccc; padding: 4px; font-style: normal; background: #fafafa; }
h1, h2, h3 {font-size: 15pt; line-height: 30pt;  font-family: helvetica, sans-serif; text-transform: uppercase; letter-spacing: 6px; }

a { text-decoration: none; }
a:visited { }
a:hover { text-decoration: none; }
a:active {}

ol { margin: 19px 40px; padding: 0px; list-style: upper-roman; }
input, textarea { margin: 1px; border: 1px solid #cccccc; color: #444444; }
font { font-family: inherit; font-size: inherit; color: inherit }

/* ------------------------------------------- 
		body & page layout 
   -------------------------------------------  */

html { margin: 0px; padding: 0px; }
body { color: #000000; background: url(http://i53.tinypic.com/fbz33k.jpg) #222; background-attachment: fixed;  margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif;  }

.layout-two-column-right {}
.layout-two-column-right #alpha {width: 565px; margin: 0px; padding: 0px;}
.layout-two-column-right #beta { width: 190px;  }

.lj-view-recent {}
.lj-view-archive {}
.lj-view-month {}
.lj-view-day {}
.lj-view-tags {}
.lj-view-entry {}

#container { background: none;  margin: auto; }
#container-inner {  margin: auto}
#content-footer { clear: both; height: 30px; background: none; }

#pagebody { margin: auto; padding: 0px; padding-top: 0px; padding-bottom: 0px; width: 900px;} 
#pagebody-inner {width: 760px;}

#page-footer {display:none}
#page-footer-inner {}

#alpha {background: none; border: 0px!important } 
#alpha a, #alpha a:visited { font-weight: normal!important; }
#alpha a:hover {}
#alpha-inner { }

#beta { margin-bottom: 30px; padding-bottom: 0px; } 
#beta-inner {}

/* ------------------------------------------- 
		header & banners 
   -------------------------------------------  */

#header { display:none; }

/* ------------------------------------------- 
		entries & content 
   -------------------------------------------  */

.content-nav { margin: 0; text-align: right; background: none; padding: 4px; min-height: 50px;}

.nav-top { display: none;}
.nav-bottom { padding: 20px 0 0px 5px; margin: 0px; color: #202020;  font-size: 7pt; font-family: arial, sans-serif; text-transform: uppercase; letter-spacing: 1px; text-align: right; }
.nav-bottom a, .nav-bottom a:visited { font-size: 15pt; line-height: 30pt;  font-family: helvetica, sans-serif; text-transform: uppercase; letter-spacing: 6px; color: white!important; padding: 2px 5px}
.nav-bottom a:hover {color: #aaa!important; }
.entrypage { text-align: center;}

#tagpage-header { text-align: center;}

.date-header { display:none; }

#column-footer { clear: both; }

#sticky-note { display:none; } .entry {margin: 0px; background: none;  margin-bottom: 0px;}

.entry-inner {background: none; }

.entry-header { background: white; margin-left: 101px; text-align: center; border: 0px; padding: 0px; padding-top: 10px; }

.entry-header h3, .entry-header h2 { margin: 0; padding: 9px 6px;  font-size: 15pt; line-height: 30pt;  font-family: helvetica, sans-serif; text-transform: uppercase; letter-spacing: 6px;}
#alpha .entry-header a, #alpha .entry-header a:visited { color: #000; text-decoration: none; font-weight: normal}
#alpha .entry-header a:hover {color: #fff}
.entry-datetime {display:none; }

.outer-entry-userpic { display:inline; float: left; padding: 0px;  margin: 0px; text-align: right; }
.inner-entry-userpic {display:none;}
.mid-entry-userpic {display:none; }

.lj-user { }
.pic-poster {margin: 3; margin-bottom: 4px;  font-size: 8pt; font-family: courier new, monospace; color: black; text-align: right!important; text-transform: uppercase; letter-spacing: 1px;}
.outer-entry-userpic a { color: #e9e9e9!important; padding: 1px; font-weight: normal!important; text-decoration: underline }
.outer-entry-userpic b {font-weight: normal}
.outer-entry-userpic img { width: 80px; height: 80px; padding: 10px; background: url(http://i51.tinypic.com/315ep8z.jpg);   }
.outer-entry-userpic a:hover {color: #aaa!important; text-decoration: none}

.header-poster { display: none; }

.entry-content { margin-top: 0px;}

.entry-body {background: white; margin-left: 101px;} 
.entry-text { background: none; margin: 0px; padding: 20px; padding-top: 5px; min-height: 100px;  text-align: justify; font-size:8pt; font-family: courier new, monospace; color: #999; font-style: normal; line-height: 121% }
.entry-text a { text-decoration: underline; color: black!important; }
.entry-text a:hover {color: #999!important; text-decoration: none}
.entry-text img {max-width: 420px; }
.entry-metadata {display:none}

.ljtags {  font-size: 7pt; font-family: arial, helvetica, sans-serif; text-transform: lowercase; letter-spacing: 1px; font-weight: bold; padding-top: 20px; margin: 0px; padding-bottom: 5px;  }

#alpha .ljtags a, #alpha .ljtags a:visited { text-decoration:none; font-size: 7pt; font-weight: normal; font-family: arial, helvetica, sans-serif; letter-spacing: 1px; color: #000;}

.entry-linkbar {font-size: 8pt; background: none; padding: 0px;  margin: 0px;  margin-left: 121px!important;margin-top: 0px; margin-bottom: 20px; }

.entry-linkbar ul { list-style: none; padding-left: 0; margin-left: 0px;; text-align: centeR; }

.entry-linkbar li { display: inline; border: 0px; padding: 2px 5px; margin: 0;   font-size: 7pt; font-family: arial, sans-serif; color: white; text-transform: uppercase; letter-spacing: 2px; } 
.entry-linkbar a {color: #fff!important; font-weight: bold;}
.entry-linkbar a:hover {color: #000!important}

li.first-el { border-left: none; padding-left: 0; }

.permalink {}
.entry-footer {}

/* ------------------------------------------- 
		comments 
   -------------------------------------------  */

#comments { margin: 0 1em; }
#comments-inner {}
.comments-header {}

.comments-nav { text-align: center; margin: 2em; }

.comments-list {}

.comment {}

.comment-each {margin: 20px 0 0 0; padding: 1px; min-height: 100px; }

.comment-header {  border: 1px solid #818f48; background: #e1e8c4; padding: 2px 5px; }

.comment-userpic { float: right; margin: 5px;}

.comment-by {}

.poster {}
.metadata {  font-size: 7pt; font-family: arial, sans-serif; color: #ffa500; text-transform: uppercase; letter-spacing: 1px; font-weight: bold}
.metadata strong {font-weight: normal; color: black}

.comment-date { font-size: small; color: #999;}

.comment-subject {}

.comment-subject h3 { margin: 0; padding: .15em 0; font-weight: normal;  }

.comment-content { padding-top: 1em; }

.comment-footer {}

.comment-linkbar {}

.comment-linkbar ul { list-style: none; margin-left: 0; padding-left: 0; }

.comment-linkbar li { display: inline; padding: 0 .5em; border-left: 1px solid #000; }

li.first-cl { border-left: none; }

.comment-replies { margin-left: 35px;}

.collapsed-comment {}

.collapsed-comment .comment-footer { margin-bottom: 1em; }

.collapsed-comment-link {}

.replyform {}

.quickreply_comment {}

#commenttext { width: 100%;}

/* ------------------------------------------- 
		tags & calendar 
   -------------------------------------------  */

.yearlinks {background: white; margin: 0; margin-left: 102px; margin-right: 1px;  padding: 9px 6px;  font-size: 15pt; line-height: 30pt;  font-family: helvetica, sans-serif; text-transform: uppercase; letter-spacing: 6px;}

.year { list-style: none; }

.year li { display: inline; padding: .5em;font-size: 15pt; line-height: 30pt;  font-family: helvetica, sans-serif; text-transform: uppercase; letter-spacing: 6px; }

.active {}

.yeartable { border-collapse: collapse; border: 0!important; margin-top: 20px; margin-bottom: 20px;  border: 0px;   }

td.monthlable { text-align: left;font-size: 14pt!important; line-height: 20pt!important;  font-family: helvetica, sans-serif!important; text-transform: uppercase; letter-spacing: 6px!important;  }
td.viewmonth { text-align: right;font-size: 14pt!important; line-height: 20pt!important;  font-family: helvetica, sans-serif!important; text-transform: uppercase; letter-spacing: 6px!important;} 
td.viewmonth a {color: black!important; text-decoration:none!important;}
td.viewmonth a:hover {color: #aaa!important}

.dayname {background: none; font-size:8pt; font-family: courier new, monospace; color: #999; text-transform: uppercase}

.yeartable td { border: 0!important; font-size:8pt; font-family: courier new, monospace; color: #999; line-height: 121% }
.yeartable td a {color:black!important; text-decoration: underline}
.yeartable td a:hover {color: #aaa!important; text-decoration: none;}

.lj-view-month form {}
.lj-view-month dl { margin: .5em 1em; }
.lj-view-month dt {} 
.lj-view-month dd {}

.day {}

.lj-view-tags #alpha { padding: 0; margin: 0px; width: 565px; margin: 0px; padding: 0px; }
.lj-view-tags h2 { background: white; margin: 0; margin-left: 101px; padding: 9px 6px;  font-size: 15pt; line-height: 30pt;  font-family: helvetica, sans-serif; text-transform: uppercase; letter-spacing: 6px; text-align: center; font-weight: normal!important}

.ljtaglist {background: white; margin-top: 0px; margin-left: 101px; padding: 20px; padding-top: 5px; min-height: 100px;  text-align: justify; font-size:8pt; font-family: courier new, monospace; color: #999; font-style: normal; line-height: 121%; list-style: none; }
.ljtaglist a { text-decoration: underline; color: black!important; }
.ljtaglist a:hover {color: #999!important; text-decoration: none}

/* ------------------------------------------- 
		modules & stuff 
   -------------------------------------------  */

.module {  padding: 0px!important;  border: 0!important; background: none!important; margin: 0px!important;  }
.module-inner {}
.module-content {}
.module-content a {text-decoration: none; color: #333; font-weight: bold; font-style: normal;}
.module-content a:hover {color: #aaa; text-decoration: none; font-weight: bold}

.module-header { display:none }

.module-content {}
.module-list {}
.module-list-item {}

.module-about, .module-typelist, .module-calendar, .module-customtext2, .module-pagesummary, .module-syndicate, .module-powered, .module-layoutcredit, .module-categories {display:none}

.module-customtext {padding: 7px; }
.module-customtext .module-content { padding: 7px; border-right: 1px dashed #555; text-align: justify; font-size: 7pt; font-weight: normal; font-family: arial, helvetica, sans-serif; letter-spacing: 1px; color: #fafafa  }
.module-customtext a {text-decoration: none; color: #333; font-weight: bold; font-style: normal;}
.module-customtext a:hover {color: #aaa; text-decoration: none; font-weight: bold}

.module-viewlinks {padding: 0px; margin: 0px; }
.module-viewlinks .module-content { text-align: left;font-size: 15pt; line-height: 30pt;  font-family: helvetica, sans-serif; text-transform: uppercase; letter-spacing: 6px; }
.module-viewlinks a {text-decoration: none; color: #fff; font-weight: normal; font-style: normal;}
.module-viewlinks a:hover {color: #aaa; text-decoration: none; font-weight: bold}

.all-link {  }

/* ------------------------------------------- 
		replacement icons & stuff 
   -------------------------------------------  */

#ad-leaderboard {}

#ad-5linkunit {}

.ljuser a {border-bottom:none!important;padding-bottom: 0px;}
.ljuser a b {padding-left:0px; }

.ljuser a:hover b {text-decoration: none;
}

.ljuser img[src="http://www.insanejournal.com/img/userinfo.gif"] { width: 0!important; height: 0!important; background-repeat: no-repeat !important; background-image: url(http://i52.tinypic.com/11lmvxd.jpg) !important; padding: 7px 9px 5px 4px !important; }

.ljuser img[src="http://www.insanejournal.com/img/community.gif"] { width: 0!important; height: 0!important; background-repeat: no-repeat !important; background-image: url(http://i54.tinypic.com/qpmopj.jpg) !important; padding: 9px 9px 3px 5px !important; }

.pic-poster img[src="http://www.insanejournal.com/img/userinfo.gif"] { width: 0!important; height: 0!important; background-repeat: no-repeat !important; background-image: url(http://i52.tinypic.com/11lmvxd.jpg) !important; padding: 0px !important; }

.pic-poster img[src="http://www.insanejournal.com/img/community.gif"] { width: 0!important; height: 0!important; background-repeat: no-repeat !important; background-image: url(http://i54.tinypic.com/qpmopj.jpg) !important; padding: 0px !important; }

.entry-header h3 img[src="http://www.insanejournal.com/img/userinfo.gif"] { width: 0!important; height: 0!important; background-repeat: no-repeat !important; background-image: url(http://i52.tinypic.com/11lmvxd.jpg) !important; padding: 17px 9px 6px 5px !important; }

.entry-header h3 img[src="http://www.insanejournal.com/img/community.gif"] { width: 0!important; height: 0!important; background-repeat: no-repeat !important; background-image: url(http://i54.tinypic.com/qpmopj.jpg) !important; padding: 18px 8px 5px 6px !important; }

.lj-entry-securityicon img[src="http://www.insanejournal.com/img/icon_private.gif"] {width: 0!important; height: 0!important; background-repeat: no-repeat !important; background-image: url(http://i51.tinypic.com/29bjzew.jpg) !important; padding: 10px 10px 5px 5px !important; }

.lj-entry-securityicon img[src="http://www.insanejournal.com/img/icon_protected.gif"] { width: 0!important; height: 0!important; background-repeat: no-repeat !important; background-image: url(http://i53.tinypic.com/35d5csp.jpg) !important; padding: 10px 10px 6px 5px !important; }

.entry-linkbar a[href*=tellafriend], .entry-linkbar a[href*=flag], .entry-linkbar a[href*=memadd], .entry-linkbar a[href*=subscriptions] {  display:none;  }

additional notes:

⇒ Please credit by adding a layout by <lj user="lobelia"> or some other kind of link to your profile, or one in your Link List.

⇒ Original Complete style base code by Emily Ravenwood. Mini icons from yusukekamiyamane.com/.

Trouble? Check the FAQ!

(Post a new comment)

	ainokallas 2011-11-14 10:25 pm UTC (link)
	Oh no, I just changed my layout and now you tempt me with this gorgeosity ; _ ; (Reply to this)

	salazarspet 2011-11-16 01:32 pm UTC (link)
	Lovely! (Reply to this)

	newjersey_devil 2011-11-21 02:46 am UTC (link)
	Using this over at newjersey_devil, credited you in the profile. Thank you very much! (Reply to this)

	zifang 2011-12-17 11:56 pm UTC (link)
	I'll possibly be using this layout here. Thank you! (Reply to this)

	jensenian 2012-01-02 05:44 am UTC (link)
	snagging and crediting. thank you! (Reply to this)

	rkolter 2012-02-22 06:09 am UTC (link)
	This is awesome. Love that hardwood. Using and crediting, works perfectly. (Reply to this)

	armored_up 2012-04-04 03:18 am UTC (link)
	Using and crediting! Thank you so much! (Reply to this)