Style: S2 Flexible Squares
Resolution: 800 x 600 and higher
Browser: Best in Firefox, passable in IE
Nav bar: Yes
Ads: Not tested
Custom comment page: No
Website: If you want
live preview* |
image preview * The live preview does not work in IE, as it is hosted on Freewebs; however, it will work fine on Livejournal. For some reason, Freewebs in hating me right now.
Rules:
- Credit
exitclosed (for the stylesheet) with a clear link in your userinfo.
- Change anything you like, but please still link back to me!
- Don't redistribute the codes, edited or not.
Codes
/*-------------------------------------------------------------------
S2 Flexible Squares Stylesheet
by exitclosed.livejournal.com
Change anything you like, but you MUST credit me with a LINK BACK.
Please do not remove this section
------------------------------------------------------------------*/
/*-------------------------------------------------------------------
Basics
-------------------------------------------------------------------*/
body {
background-color: #EEEEEE;
text-align: justify;
color: #C0C0C0;
font-family: Garamond;
font-size: 12px;
margin: 10px 0px 10px 0px;
}
a, a:link, a:visited {
cursor: hand;
color: #D9B7C1;
text-decoration: none;
}
a:hover {
cursor: hand;
color: #634B52;
text-decoration: none;
}
p, blockquote {
font-size: 9px;
padding: 20px;
}
code, kbd, pre, tt {
font-size: 9px;
padding: 20px;
}
/*-------------------------------------------------------------------
General page alignment and width
-------------------------------------------------------------------*/
#content {
width: 620px;
margin-left: auto;
margin-right: auto;
background-color: transparent;
border: 0px;
padding: 0px;
}
#maincontent {
float: right;
width: 100%;
background-color: #FFFFFF;
color: #C0C0C0;
text-align: justify;
margin-top: 15px;
}
#sidebar {
padding-top: 10px;
padding-bottom: 10px;
margin-top: 15px;
margin-left: auto;
margin-right: auto;
margin-bottom: 15px;
background-color: #FFFFFF;
width: 620px;
text-align: justify;
}
/*-------------------------------------------------------------------
Header and header image
-------------------------------------------------------------------*/
#header {
visibility: hidden
}
.title {
visibility: hidden
}
.subtitle{
visibility: hidden
}
/*-------------------------------------------------------------------
Header links section
-------------------------------------------------------------------*/
ul.navheader {
padding: 0px;
margin: 0px;
}
ul.navheader li {
display: inline;
padding: 0 3px 0 3px;
}
/*-------------------------------------------------------------------
Entry stuff
-------------------------------------------------------------------*/
.entry {
margin: 0px 0px 0px 0px;
padding: 15px 15px 15px 130px;
background-color: #FFFFFF;
font-weight: none;
text-align: justify;
font-size: 12px;
font-family: Garamond;
font-color: #C0C0C0;
}
.userpic {
position: relative;
float: left;
text-align: center;
margin: 10px 10px 15px 10px;
padding: 10px;
background-color: transparent !important;
color: #C0C0C0 !important;
}
.userpic img {
background-color: #FFFFFF;
padding-top: 5px;
padding-right: 5px;
padding-left: 15px;
padding-bottom: 5px;
}
.date {
text-align: left;
line-height: 100%;
text-decoration: italic;
color: #ABABAB;
font-family: Garamond;
font-size: 10px;
margin-top: 5px;
}
.subject {
padding: 0px;
text-align: left;
color: #8D9999;
font-family: Garamond;
font-size: 22px;
text-transform: lowercase;
line-height: 12px;
}
a, a:link, a:visited {
cursor: hand;
color: #D9B7C1;
text-decoration: none;
}
.subject a:hover {
cursor: hand;
color: #634B52;
text-decoration: none;
}
.datesubject {
background-color: #FFFFFF;
padding-top: 5px;
padding-left: 5px;
padding-right: 5px;
padding-bottom: 2px;
}
.entry ul li {
padding-left: 5px;
margin-left: 15px;
}
.entry ol li {
padding-left: 5px;
margin-left: 15px;
}
/*-------------------------------------------------------------------
Entry Stuff - Current Mood, Music and Location
-------------------------------------------------------------------*/
.currents, .currentmood, .currentmusic {
color: #91BDBF;
font-family: Garamond;
font-size: 9px;
}
/*-------------------------------------------------------------------
Entry Stuff - Comments
-------------------------------------------------------------------*/
.comments {
font-family: Garamond;
font-size: 12px;
text-align: right;
padding: 10px 10px 10px 10px;
position: relative;
top: 15px;
}
div.comments a, div.comments a:link, div.comments a:visited{
cursor: hand;
color: #D9B7C1;
text-decoration: none;
}
div.comments a:hover {
cursor: hand;
color: #634B52;
text-decoration: none;
}
/*-------------------------------------------------------------------
Entry Stuff - Separator
-------------------------------------------------------------------*/
/* for formatting separators between entries */
.separator{
height: 15px;
background-color: #EEEEEE !important;
border: 0px !important;
}
/*-------------------------------------------------------------------
Sidebar
-------------------------------------------------------------------*/
.defaultuserpic {
display: none;
visibility: hidden;
}
.sbarheader {
padding: 0px 0px 0px 0px;
}
.sbarbody {
padding: 0px 0px 0px 0px;
}
.sbarbody2 {
padding: 0px 0px 0px 0px;
}
/*-------------------------------------------------------------------
Special friends page customization
-------------------------------------------------------------------*/
.userpicfriends {
position: relative;
float: left;
text-align: center;
margin: 10px 10px 0px 0px;
padding: 0px;
background-color: transparent !important;
color: #C0C0C0 !important;
}
.userpicfriends img {
background-color: transparent;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 15px;
}
/*-------------------------------------------------------------------
Archive Pages
-------------------------------------------------------------------*/
ul.year {
text-align: center;
padding-bottom: 40px;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border: 1px solid #C0C0C0;
}
table.yeartable td.yearday {
background-color: #FFFFFF;
text-align: center;
}
td.yearmonth {
border-style: none;
}
/*-------------------------------------------------------------------
Misc
-------------------------------------------------------------------*/
.clear {height: 0px;}
.entry ul li {
padding-left: 5px;
margin-left: 15px;
}
.entry ol li {
padding-left: 5px;
margin-left: 15px;
}
/*-------------------------------------------------------------------
Footer
-------------------------------------------------------------------*/
#footer {
width: 100%;
color: #C0C0C0;
font-family: Garamond;
font-size: 12px;
background-color: #FFFFFF;
clear: none;
text-align: right;
}
div#footer a, div#footer a:link, div#footer a:visited {
cursor: hand;
color: #D9B7C1;
text-decoration: none;
}
div#footer a:hover {
cursor: hand;
color: #634B52;
text-decoration: none;
}
ul.navfooter{
padding: 5px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0px;
padding: 0px 5px 0px 5px;
background: transparent;
text-align: center;
font-size: 12px;
text-transform: lowercase;
}
.clearfoot {
display: none;
}
/*-------------------------------------------------------------------
Misc
-------------------------------------------------------------------*/
.clear {height: 0px;}
Topbar
http://i34.tinypic.com/r8fp04.png">
link link link link linkYou can write some stuff here. You can write some stuff here. You can write some stuff here. You can write some stuff here. You can write some stuff here. You can write some stuff here. You can write some stuff here. You can write some stuff here. You can write some stuff here. | You can write some stuff here. You can write some stuff here. You can write some stuff here. You can write some stuff here. You can write some stuff here. You can write some stuff here. You can write some stuff here. You can write some stuff here. You can write some stuff here. |
Note:
Header is uploaded to tinypic. Save an upload yourself, I can't guarantee how long it will stay up.
Instructions:
1. Go to Journal >> Customize Journal
2. To get S2 Flexible Squares, type 'Flexible Squares' into the Search box.
3. Choose any one of them, and Apply it.
4. Now click 'Customize Theme'
5. Press 'Custom CSS' on the left
6. Choose 'No' for all the drop down boxes.
7. Paste the codes in.
8. Save
9. Click 'Sidebar'.
10. Make sure only the blurb will be visible. Make sure you delete the title of the blurb.
11. Paste topbar codes in. Don't forget to change all the links and text.
12. Save.
Check out the layout
FAQ before asking any questions, please :)
You can
watch exitclosed if you like what you see :)