Tessisamess

S	M	T	W	T	F	S
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30	31

light image prev |

tess004
dark image prev |

001: Informative Info

Another. Freakin'. Layout. I know, I know, haha. 'TIS THE CHRISTMAS SPIRIT OR... SOMETHING. Anyhoo, a light and dark version of this S1 Generator layout. Enjoy! <3

Want a matching thread tracker? Well, good news! ~affictitious made one and it's super cute. :D

002: The Layout

LIGHT

FRIENDS_OPT_ITEMS=>15

FRIENDS_WEBSITE<=
<div id="sidebar">

<span id="title">title here</span>
<span id="subtitle">subtitle subtitle subtitle subtitle subtitle</span>

<span id="blurb">BLURB HERE</span>

<a href="http://journalname.insanejournal.com/">RECENT</a>
<a href="http://journalname.insanejournal.com/profile">PROFILE</a><br>
<a href="http://journalname.insanejournal.com/friends">FRIENDS</a>
<a href="http://journalname.insanejournal.com/calendar">ARCHIVE</a><br>
<a href="URL">LINK</a>
<a href="URL">LINK</a>

</div>

<div> </div>
<=FRIENDS_WEBSITE

DAY_TALK_LINKS<=
<table>
<tr><td class="comments" colspan="2"><div id="footer">
<a href="%%urlread%%">VIEW ENTRY</a> <a href="%%urlread%%#comments">%%messagecount%% COMMENTS</a> <a href="%%urlpost%%">LEAVE A COMMENT</a> <a href=http://www.insanejournal.com/editjournal_do.bml?%%itemargs%%>EDIT ENTRY</a>
</div>
</td></tr>
<=DAY_TALK_LINKS

DAY_WEBSITE<=
<div id="sidebar">

<span id="title">title here</span>
<span id="subtitle">subtitle subtitle subtitle subtitle subtitle</span>

<span id="blurb">BLURB HERE</span>

</div>

<div> </div>
<=DAY_WEBSITE

LASTN_TALK_LINKS<=
<table>
<tr><td class="comments" colspan="2"><div id="footer">
<a href="%%urlread%%">VIEW ENTRY</a> <a href="%%urlread%%#comments">%%messagecount%% COMMENTS</a> <a href="%%urlpost%%">LEAVE A COMMENT</a> <a href=http://www.insanejournal.com/editjournal_do.bml?%%itemargs%%>EDIT ENTRY</a>
</div>
</td></tr>
<=LASTN_TALK_LINKS

GLOBAL_HEAD<=
<title>JOURNAL TITLE</title>
<style>
<!--
/*-- EMBIGGEN [LIGHT] - TESSISAMESS - 2013 --*/
/*-- Credit me in profile if removing my credit link from main block --*/
/*-- Find more fun stuff at: tessisamess.insanejournal.com --*/

/*GENERAL*/
::-webkit-scrollbar{width:9px;height:9px;}
::-webkit-scrollbar-button:start:decrement,::-webkit-scrollbar-button:end:increment{height:0;width:4px;display:block;background:transparent;}
::-webkit-scrollbar-track-piece{background:#999;}
::-webkit-scrollbar-thumb:vertical{height:0;background:#bbb;}
::-webkit-scrollbar-thumb:horizontal{width:0;background:#bbb;}

body{background:#ddd url(http://i.imgur.com/44zMTZG.png)top left repeat fixed;font-family:helvetica,arial,sans-serif;font-size:10px;color:#333;padding:0;margin:0;}
body,table,tr,td{text-align:justify;}
a{color:#008B8B;text-decoration:none;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-ms-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
a:hover{color:#999;text-decoration:none;}
blockquote{padding-left:5px;border-left:3px solid #008B8B;font-style:italic;}

/*THE GOODS*/
#sidebar{-webkit-border-radius:85px 0 0 0;border-radius:85px 0 0 0;position:fixed;left:20px;top:30px;visibility:visible;width:326px;margin:0;background:#f5f5f5;border:1px solid #ccc;padding:3px;text-align:center;font-family:helvetica,arial,sans-serif;text-transform:uppercase;font-size:10px;}
#sidebar:after {content:"Layout by Tessisamess";display:block;font-size:9px;color:#bbb;text-align:center;padding-top:4px;}
#sidebar img{border:1px solid #bbb;display:inline;margin:3px;-webkit-filter: grayscale(100%);-moz-filter:grayscale(100%);filter:grayscale(100%);-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-ms-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
#sidebar img:hover{-moz-transform:scale(1.1);-webkit-transform:scale(1.1);-o-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);}
#sidebar a{display:inline-block;width:158px;background:#ddd;margin-bottom:3px;padding:2px 0;color:#000;font-family:georgia,serif;font-style:italic;text-transform:lowercase;}
#sidebar a:hover{background:#008B8B;color:#fff;letter-spacing:2px;-moz-transform:scale(1.1);-webkit-transform:scale(1.1);-o-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);}

#big{float:left;width:208px;-webkit-border-radius:80px 0 0 0;border-radius:80px 0 0 0;}
.small{width:100px;}

#title{display:block;font-size:35px;font-family:georgia,serif;font-style:italic;color:#008B8B;text-transform:lowercase;border-bottom:2px solid #e1e1e1;margin-top:10px;line-height:17px;}
#subtitle{display:block;color:#777;font-size:11px;}

#blurb{display:block;padding:5px;background:#e5e5e5;margin:8px 3px;text-align:justify;line-height:150%;color:#222;text-transform:none;}

/*ENTRIES*/
table, tr, td, .shadowed{background:transparent;font-size:11px;}
.content{background:transparent;}
table{width:530px;margin-left:400px;margin-right:100%;}
table td{border:0px transparent;}
table table{background:transparent;width:100%;margin:0;} 
table, table table td{background:transparent;border:none;padding:0;}

.shadowed img{color:#E3DECB;border:none;}

td.caption, .subject{text-align:center;font-size:25px;font-family:georgia,serif;font-style:italic;color:#008B8B;text-transform:lowercase;border-bottom:2px solid #e1e1e1;} 
p table table td.caption, .head{line-height:15px;}
#footer{text-align:center;margin:0;padding:10px 0 0 0;}
#footer a{display:inline-block;width:100px;background:#ddd;margin:0 1px;padding:1px 0;color:#000;font-family:georgia,serif;font-style:italic;text-transform:lowercase;font-size:8px;}
#footer a:hover{background:#008B8B;color:#fff;letter-spacing:2px;-moz-transform:scale(1.1);-webkit-transform:scale(1.1);-o-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);}

.entrybox .index{color:#F6BF96;}
.entrybox{visibility:visible;padding:6px;border:1px solid #ccc;}
.entrybox, .entrybox table{background:#F5F5F5;}
.entrybox table{line-height:150%;}
.entrybox td.index2{text-align:center;}

table table table{background:transparent;width:auto;float:right;}
.meta{font-size:5pt;text-transform:uppercase;}
table table table td.meta{padding:1px;line-height:4pt;font-size:5pt;}

.index2{font-style:normal;text-align:center;}
table table .index img{width:70px;height:70px;border-left:7px solid #f5f5f5;-webkit-filter: grayscale(100%);-moz-filter:grayscale(100%);filter:grayscale(100%);}
table table .index{padding:0;background:transparent;text-transform:uppercase;color:#000;line-height:8px;font-size:8px;text-align:right;}

.ljuser img[src*="img/userinfo.gif"]{width:0!important;height:0!important;background:transparent url(http://i.imgur.com/77SPPSV.png)no-repeat!important;padding:16px 0 0 16px!important;}
.ljuser img[src*="img/community.gif"]{width:0!important;height:0!important;background:transparent url(http://i.imgur.com/ZpzRySg.png)no-repeat!important;padding:16px 0 0 16px!important;}
img[src*="img/icon_protected.gif"]{width:0!important;height:0!important;background:transparent url(http://i.imgur.com/s0UE76O.png)no-repeat!important;padding:16px 0 0 16px!important;}
img[src*="img/icon_private.gif"]{width:0!important;height:0!important;background:transparent url(http://i.imgur.com/s0UE76O.png)no-repeat!important;padding:16px 0 0 16px!important;}
img[src*="img/icon_groups.gif"]{width:0!important;height:0!important;background:transparent url(http://i.imgur.com/s0UE76O.png)no-repeat!important;padding:16px 0 0 16px!important;}

/*HIDING SHIT*/
.shadowed img, tr.caption, .entrybox td.index, .index3{display:none;}
table table table table .meta {visibility:hidden;position:absolute;top:-20px;}
.shadowed td div{visibility:hidden;position:absolute;top:1px;}

-->
</style>
<=GLOBAL_HEAD

FRIENDS_TALK_LINKS<=
<table>
<tr><td class="comments" colspan="2"><div id="footer">
<a href="%%urlread%%">VIEW ENTRY</a> <a href="%%urlread%%#comments">%%messagecount%% COMMENTS</a> <a href="%%urlpost%%">LEAVE A COMMENT</a> <a href=http://www.insanejournal.com/editjournal_do.bml?%%itemargs%%>EDIT ENTRY</a>
</div>
</td></tr>
<=FRIENDS_TALK_LINKS

LASTN_OPT_ITEMS=>10

CALENDAR_WEBSITE<=
<div id="sidebar">

<span id="title">title here</span>
<span id="subtitle">subtitle subtitle subtitle subtitle subtitle</span>

<span id="blurb">BLURB HERE</span>

</div>

<div> </div>
<=CALENDAR_WEBSITE

LASTN_WEBSITE<=
<div id="sidebar">

<span id="title">title here</span>
<span id="subtitle">subtitle subtitle subtitle subtitle subtitle</span>

<span id="blurb">BLURB HERE</span>

</div>

<div> </div>
<=LASTN_WEBSITE

DARK

FRIENDS_OPT_ITEMS=>15

FRIENDS_WEBSITE<=
<div id="sidebar">

<span id="title">title here</span>
<span id="subtitle">subtitle subtitle subtitle subtitle subtitle</span>

<span id="blurb">BLURB HERE</span>

</div>

<div> </div>
<=FRIENDS_WEBSITE

DAY_WEBSITE<=
<div id="sidebar">

<span id="title">title here</span>
<span id="subtitle">subtitle subtitle subtitle subtitle subtitle</span>

<span id="blurb">BLURB HERE</span>

</div>

<div> </div>
<=DAY_WEBSITE

GLOBAL_HEAD<=
<title>JOURNAL TITLE</title>
<style>
<!--
/*-- EMBIGGEN [DARK] - TESSISAMESS - 2013 --*/
/*-- Credit me in profile if removing my credit link from main block --*/
/*-- Find more fun stuff at: tessisamess.insanejournal.com --*/

/*GENERAL*/
::-webkit-scrollbar{width:9px;height:9px;}
::-webkit-scrollbar-button:start:decrement,::-webkit-scrollbar-button:end:increment{height:0;width:4px;display:block;background:transparent;}
::-webkit-scrollbar-track-piece{background:#222;}
::-webkit-scrollbar-thumb:vertical{height:0;background:#111;}
::-webkit-scrollbar-thumb:horizontal{width:0;background:#111;}

body{background:#000 url(http://i.imgur.com/sbGFadU.png)top left repeat fixed;font-family:helvetica,arial,sans-serif;font-size:10px;color:#aaa;padding:0;margin:0;}
body,table,tr,td{text-align:justify;}
a{color:#A82424;text-decoration:none;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-ms-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
a:hover{color:#999;text-decoration:none;}
blockquote{padding-left:5px;border-left:3px solid #A82424;font-style:italic;}

/*THE GOODS*/
#sidebar{-webkit-border-radius:85px 0 0 0;border-radius:85px 0 0 0;position:fixed;left:20px;top:30px;visibility:visible;width:326px;margin:0;background:#111;border:1px solid #010101;padding:3px;text-align:center;font-family:helvetica,arial,sans-serif;text-transform:uppercase;font-size:10px;}
#sidebar:after {content:"Layout by Tessisamess";display:block;font-size:9px;color:#444;text-align:center;padding-top:4px;}
#sidebar img{border:1px solid #010101;display:inline;margin:3px;-webkit-filter: grayscale(100%);-moz-filter:grayscale(100%);filter:grayscale(100%);-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-ms-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
#sidebar img:hover{-moz-transform:scale(1.1);-webkit-transform:scale(1.1);-o-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);}
#sidebar a{display:inline-block;width:158px;background:#191919;margin-bottom:3px;padding:2px 0;color:#bbb;font-family:georgia,serif;font-style:italic;text-transform:lowercase;}
#sidebar a:hover{background:#A82424;color:#000;letter-spacing:2px;-moz-transform:scale(1.1);-webkit-transform:scale(1.1);-o-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);}

#big{float:left;width:208px;-webkit-border-radius:80px 0 0 0;border-radius:80px 0 0 0;}
.small{width:100px;}

#title{display:block;font-size:35px;font-family:georgia,serif;font-style:italic;color:#A82424;text-transform:lowercase;border-bottom:2px solid #1e1e1e;margin-top:10px;line-height:17px;}
#subtitle{display:block;color:#777;font-size:11px;}

#blurb{display:block;padding:5px;background:#191919;margin:8px 3px;text-align:justify;line-height:150%;color:#aaa;text-transform:none;}

.shadowed img{color:#E3DECB;border:none;}

td.caption, .subject{text-align:center;font-size:25px;font-family:georgia,serif;font-style:italic;color:#A82424;text-transform:lowercase;border-bottom:2px solid #1e1e1e;} 
p table table td.caption, .head{line-height:15px;}
#footer{text-align:center;margin:0;padding:10px 0 0 0;}
#footer a{display:inline-block;width:100px;background:#191919;margin:0 1px;padding:1px 0;color:#bbb;font-family:georgia,serif;font-style:italic;text-transform:lowercase;font-size:8px;}
#footer a:hover{background:#A82424;color:#000;letter-spacing:2px;-moz-transform:scale(1.1);-webkit-transform:scale(1.1);-o-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);}

.entrybox .index{color:#F6BF96;}
.entrybox{visibility:visible;padding:6px;border:1px solid #010101;}
.entrybox, .entrybox table{background:#111;}
.entrybox table{line-height:150%;}
.entrybox td.index2{text-align:center;}

table table table{background:transparent;width:auto;float:right;}
.meta{font-size:5pt;text-transform:uppercase;}
table table table td.meta{padding:1px;line-height:4pt;font-size:5pt;}

.index2{font-style:normal;text-align:center;}
table table .index img{width:70px;height:70px;border-left:7px solid #111;-webkit-filter: grayscale(100%);-moz-filter:grayscale(100%);filter:grayscale(100%);}
table table .index{padding:0;background:transparent;text-transform:uppercase;color:#000;line-height:8px;font-size:8px;text-align:right;}

.ljuser img[src*="img/userinfo.gif"]{width:0!important;height:0!important;background:transparent url(http://i.imgur.com/r7NUwep.png)no-repeat!important;padding:16px 0 0 16px!important;}
.ljuser img[src*="img/community.gif"]{width:0!important;height:0!important;background:transparent url(http://i.imgur.com/yWxFOKf.png)no-repeat!important;padding:16px 0 0 16px!important;}
img[src*="img/icon_protected.gif"]{width:0!important;height:0!important;background:transparent url(http://i.imgur.com/39jp3e4.png)no-repeat!important;padding:16px 0 0 16px!important;}
img[src*="img/icon_private.gif"]{width:0!important;height:0!important;background:transparent url(http://i.imgur.com/39jp3e4.png)no-repeat!important;padding:16px 0 0 16px!important;}
img[src*="img/icon_groups.gif"]{width:0!important;height:0!important;background:transparent url(http://i.imgur.com/39jp3e4.png)no-repeat!important;padding:16px 0 0 16px!important;}

-->
</style>
<=GLOBAL_HEAD

LASTN_OPT_ITEMS=>10

CALENDAR_WEBSITE<=
<div id="sidebar">

<span id="title">title here</span>
<span id="subtitle">subtitle subtitle subtitle subtitle subtitle</span>

<span id="blurb">BLURB HERE</span>

</div>

<div> </div>
<=CALENDAR_WEBSITE

LASTN_WEBSITE<=
<div id="sidebar">

<span id="title">title here</span>
<span id="subtitle">subtitle subtitle subtitle subtitle subtitle</span>

<span id="blurb">BLURB HERE</span>

</div>

<div> </div>
<=LASTN_WEBSITE

003: Directions

→Make sure you have a website in your profile page.
→Go to Basics and choose S1, then save.
→Go to Look and Feel, choose Generator for all views, then save.
→Go to Custom Options and paste the layout code, then save. Make sure you've done a replace all on the following:

→journalname
→PIC (this must be square and at least 208x208; desaturation is automatic in the coding)
→ICON1 and ICON2 (these must be square and at least 100x100)
→title here
→subtitle subtitle subtitle subtitle subtitle
→BLURB HERE
→URL and LINK (x2)
→JOURNAL TITLE

→All done! :D

004: CTRL+F This Shit

Ditching the color code format I was trying out; it just wasn't specific enough. Back to our regularly scheduled ctrl+f guide!

LIGHT
→#008B8B to replace the accent color.
→http://i.imgur.com/44zMTZG.png to replace the background image.
→#f5f5f5 to replace sidebar and entry background color.
→#ccc to replace sidebar and entry border color.
→#ddd to replace block link background color.
→#e5e5e5 to replace the blurb background color.

DARK
→#A82424 to replace the accent color.
→http://i.imgur.com/sbGFadU.png to replace the background image.
→#111 to replace sidebar and entry background color.
→#010101 to replace sidebar and entry border color.
→#191919 to replace block link background color.
→#191919 to replace the blurb background color.

LIGHT & DARK
→helvetica,arial,sans-serif to replace the bulk font.
→georgia,serif to replace the accent font.

005: Rules and Shit

→Credit me in your profile if you remove my link from the sidebar's coding.
→Do not remove my credit from the CSS.
→Do not redistribute in part or in whole.
→If you break something during editing don't be scared to ask me to see what happened. Yep. That's a rule.
→If you're a maker like I am and you do something cool with this I'd really like to see it, but it's not necessary.

Tags: layouts, layouts: s1 generator

Profile

Title Here

Navigation

July 2024

Links List

Resources

Tags

Layout By

Layout: Embiggen