The Sweet Shop - 2 Variants [LAYOUT]
Live Preview (Temporary) | Static Preview (Pink) | Static Preview (Teal)
The Sweet Shop
s2flexiblesquares
Instructions
♥ Go to CUSTOMIZE and choose any S2 Flexible Squares layout, apply it, then scroll down and make sure ads are set to HORIZONTAL and sidebar placement is on the RIGHT.
♥ Go to CUSTOMIZE JOURNAL STYLE and then to CUSTOM CSS.
♥ Set dropdown menus to NO, NO, YES, paste the code in and save!
Code
Pink:
/*--------The Sweet Shop by Tessisamess--------*/
/*--Made On: January 2012--*/
/*--S2 Style: Flexible Squares--*/
/*--------CREDITS---------*/
/*--Coding + Design + Tinyicons: tessisamess@LJ--*/
/*--Tessisamess Layout Comm: layouttesst@LJ--*/
body {
background-color: #222222;
background: url('http://i.imgur.com/hSCT5.png') repeat fixed;
text-align: center;
color: #FFFFFF;
font-family: Tahoma;
font-size: 11px;
margin: 20px 0 20px 0;
}
a, a:link, a:visited {
color: #E3385B;
text-decoration: none;
}
a:hover {
color: #DC143C;
text-decoration: none;
border-bottom: 1px dotted;
}
p, td, blockquote {
font-size: 11px;
}
code, kbd, pre, tt {
font-family: monospace;
}
/*--------- General page alignment and width ---------*/
#content {
width: 800px;
margin-left: auto; margin-right: auto;
background-color: transparent;
border-style: none;
padding: 15px;
}
#maincontent {
margin-top: 15px;
font-family: Tahoma;
font-size: 11px;
background-color: transparent;
color: #FFFFFF;
border-style: none;
margin-right: 180px;
text-align: left;
background: transparent url('http://i.imgur.com/8PD9V.png') repeat top left;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border-left: 2px dotted #DC143C;
}
#sidebar {
padding-top: 15px;
margin-top: 15px;
background: transparent url('http://i.imgur.com/8PD9V.png') repeat top left;
border-style: none;
font-size: 11px;
font-family: Tahoma;
color: #FFFFFF;
width: 160px;
float: right;
text-align: left;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border-right: 2px dotted #DC143C;
line-height: 180%;
}
/*--------- Header - you can add a header image with either #header or .headerimage ---------*/
#header {
width: 100%;
padding: 10px 0px 20px 0px;
margin: 0px;
text-align: center;
font-size: 25px;
font-family: 'Lobster';
color: #E3385B;
font-weight: bold;
letter-spacing: 2px;
border-style: none;
background: transparent url('http://i.imgur.com/8PD9V.png') repeat top left;
color: #FFFFFF;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border-left: 2px dotted #DC143C;
border-right: 2px dotted #DC143C;
}
.headerimage {
/* for formatting header image */
}
/*look and color of links (also partly for footer)*/
div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
color: #E3385B;
}
div#header a:hover, div#footer a:hover {
color: #DC143C;
text-decoration: none;
}
/*title and subtitle*/
.title {
display: none;
}
.subtitle{
display: none;
}
/*--------- Header - top navigation ---------*/
/* header -- links to views; title of journal; subtitle of journal */
ul.navheader
{
padding: 0px;
margin: 0px;
}
ul.navheader li {
display: inline;
padding: 0 3px 0 3px;
}
/*--------- Entry stuff ---------*/
.subcontent {
}
.entry {
margin: 0px 10px 10px 30px;
padding: 10px;
color: #FFFFFF;
font-family: Tahoma;
font-size: 11px;
text-align: left;
border-style: none;
background: transparent;
line-height: 180%;
}
.userpic {
position: relative;
float: left;
padding: 5px;
margin: 10px;
z-index: 15;
border-style: none;
background-color: #E3385B;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.date {
line-height: 200%;
top: 5px;
color: #FFFFFF;
font-family: Tahoma;
font-size: 11px;
}
.subject {
padding: 10px;
font-family: 'Lobster Two';
font-size: 20px;
color: #DC143C;
}
.subject a, .subject a:link, .subject a:visited {
color: #E3385B;
}
.subject a:hover {
color: #DC143C;
}
.datesubject {
background-color: transparent;
padding: 5px;
}
.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 {
font-family: Tahoma;
font-size: 11px;
}
/*--------- Entry Stuff - Comments ---------*/
.comments {
font-family: 'Lobster';
font-size: 18px;
text-align: center;
background-color: #DC143C;
padding: 8px;
position: relative;
top: 15px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #ffffff;
}
div.comments a:hover {
color: #E3385B;
text-decoration: none;
}
/*--------- Entry Stuff - Separator ---------*/
.separator{
/* for formatting separators between entries */
height: 35px;
}
/*--------- Special friends page customization ---------*/
.userpicfriends {
position: relative;
background-color: #E3385B !important;
float: left;
padding: 5px;
margin: 10px;
text-align: center;
border-style: none;
font-family: 'Lobster Two';
font-size: 11px;
z-index: 15;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
/*--------- Sidebar ---------*/
.defaultuserpic {
text-align: center;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.sbarheader {
padding: 0px 5px 0px 5px;
}
.sbarbody {
padding: 0px 5px 0px 5px;
}
.sbarbody2 {
padding: 0 15px 0 15px;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #E3385B;
}
div#sidebar a:hover {
color: #DC143C;
text-decoration: none;
}
/*--------- Sidebar - Calendar ---------*/
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
border-color: #E3385B;
border-width: 1px;
border-style: dotted;
text-align: center;
font-family: 'Lobster Two';
font-size: 11px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
padding: 2px;
}
.sbarcalendarposts {
border-style: none;
background-color: #E77088;
text-align: center;
font-family: 'Lobster Two';
font-size: 11px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
padding: 2px;
}
/*----------- Sidebar - link box contents and sidebar box titles ---------*/
ul.sbarlist
{
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
li.sbaritem
{
padding-left: 15px;
list-style: none;
}
li.sbartitle
{
text-align: center;
list-style: none;
border-style: none;
background-color: transparent;
font-family: 'Lobster';
color: #DC143C;
font-size: 20px;
margin-bottom: 10px;
margin-top: 20px;
}
/*----------- footer -----------*/
#footer {
width: 100%;
text-align: center;
font-family: 'Lobster';
font-size: 18px;
letter-spacing: 1px;
color: #DC143C;
z-index: 100;
clear: both;
background: transparent url('http://i.imgur.com/8PD9V.png') repeat top left;
border-left: 2px dotted #DC143C;
border-right: 2px dotted #DC143C;
border-top: none;
border-bottom: none;
padding: 10px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {
clear: both;
}
/*----------- Archive Pages -----------*/
ul.year {
text-align: center;
padding-bottom: 30px;
padding-top: 10px;
font-family: 'Lobster Two';
font-size: 16px;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border-width: 2px;
border-style: dotted;
border-color: #DC143C;
font-family: 'Lobster Two';
font-size: 13px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
table.yeartable td.yearday {
background-color: #DC143C;
text-align: center;
}
td.yearmonth {
border-style: none;
font-family: 'Lobster';
font-size: 16px;
}
/*----------- Comments pages -----------*/
.datesubjectcomment {
background-color: #E3385B;
padding: 5px;
margin-top: 20px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.userpiccomment {
position: relative;
border-style: none;
background-color: #DC143C;
top: -30px;
left: 0px;
padding: 5px;
margin: 10px 10px -20px 10px;
z-index: 15;
float: left;
border-style: none;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.box {
border-style: none;
padding: 10px;
clear: left;
}
input, textarea {
background-color: #E3385B;
color: #FFFFFF;
}
textarea.textbox {
width: 100% !important;
}
.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: Tahoma;
font-size: 11px;
line-height: 125%;
background-color: #DC143C;
color: #FFFFFF;
}
.replytosubject {
font-weight: bold;
}
.commentreply {
position: relative;
margin: 10px;
font-size: 11px;
font-family: Tahoma;
color: #FFFFFF;
}
.commentbox {
border-style: none;
padding: 10px;
margin: 10px;
background-color: transparent;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #ffffff;
}
.datesubjectcomment a:hover {
color: #DC143C;
}
.commentboxpartial {
border-style: none;
padding: 10px;
margin: 10px;
background-color: #DC143C;
}
.commentinfo {
background-color: #DC143C;
margin-top: 10px;
width: 100%;
}
.skiplinks {
text-align: center;
}
/*----------- Misc -----------*/
.clear {
height: 15px;
}
::selection {
background: #E3385B;
}
::-moz-selection {
background: #E3385B;
}
h1 {
font-size: 25px;
font-family: 'Lobster';
color: #E3385B;
}
h2 {
font-size: 22px;
font-family: 'Lobster';
color: #E3385B;
}
h3 {
font-size: 20px;
font-family: 'Lobster Two';
color: #E3385B;
}
h4 {
font-size: 18px;
font-family: 'Lobster Two';
color: #E3385B;
}
blockquote {
background-color: #E77088;
padding: 10px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
text-align: justify;
line-height: 150%;
font-face: verdana;
}
textarea {
background-color: #E77088;
padding: 10px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
code {
color: #E77088;
padding: 10px;
}
.ljtaglist {
padding: 20px;
line-height: 200%;
list-style-type:none;
}
ul {
list-style-image: url('http://i.imgur.com/xfMl2.png');
}
@font-face {
font-family: 'Lobster';
font-style: normal;
font-weight: normal;
src: local('Lobster'), url('http://themes.googleusercontent.com/static/fonts/lobster/v4/MWVf-Rwh4GLQVBEwbyI61Q.woff') format('woff');
}
@font-face {
font-family: 'Lobster Two';
font-style: normal;
font-weight: 400;
src: local('Lobster Two'), local('LobsterTwo'), url('http://themes.googleusercontent.com/static/fonts/lobstertwo/v3/Law3VVulBOoxyKPkrNsAaIbN6UDyHWBl620a-IRfuBk.woff') format('woff');
}
/* Generated by Malionette's Tiny Icon Generator */
img[src*="img/userinfo.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(http://i.imgur.com/R62Vq.png) no-repeat !important; padding: 16px 0 0 16px !important; }
img[src*="img/community.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(http://i.imgur.com/hh05t.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/L2Mje.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/wHtVv.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/L2Mje.png) no-repeat !important; padding: 16px 0 0 16px !important; }
Teal:
/*--------The Sweet Shop by Tessisamess--------*/
/*--Made On: January 2012--*/
/*--S2 Style: Flexible Squares--*/
/*--------CREDITS---------*/
/*--Coding + Design + Tinyicons: tessisamess@LJ--*/
/*--Tessisamess Layout Comm: layouttesst@LJ--*/
body {
background-color: #222222;
background: url('http://i.imgur.com/hSCT5.png') repeat fixed;
text-align: center;
color: #FFFFFF;
font-family: Tahoma;
font-size: 11px;
margin: 20px 0 20px 0;
}
a, a:link, a:visited {
color: #4AD3BD;
text-decoration: none;
}
a:hover {
color: #18BCA2;
text-decoration: none;
border-bottom: 1px dotted;
}
p, td, blockquote {
font-size: 11px;
}
code, kbd, pre, tt {
font-family: monospace;
}
/*--------- General page alignment and width ---------*/
#content
{
width: 800px;
margin-left: auto; margin-right: auto;
background-color: transparent;
border-style: none;
padding: 15px;
}
#maincontent {
margin-top: 15px;
font-family: Tahoma;
font-size: 11px;
background-color: transparent;
color: #FFFFFF;
border-style: none;
margin-right: 180px;
text-align: left;
background: transparent url('http://i.imgur.com/8PD9V.png') repeat top left;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border-left: 2px dotted #18BCA2;
}
#sidebar {
padding-top: 15px;
margin-top: 15px;
background: transparent url('http://i.imgur.com/8PD9V.png') repeat top left;
border-style: none;
font-size: 11px;
font-family: Tahoma;
color: #FFFFFF;
width: 160px;
float: right;
text-align: left;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border-right: 2px dotted #18BCA2;
line-height: 180%;
}
/*--------- Header - you can add a header image with either #header or .headerimage ---------*/
#header {
width: 100%;
padding: 10px 0px 20px 0px;
margin: 0px;
text-align: center;
font-size: 25px;
font-family: 'Lobster';
color: #4AD3BD;
font-weight: bold;
letter-spacing: 2px;
border-style: none;
background: transparent url('http://i.imgur.com/8PD9V.png') repeat top left;
color: #FFFFFF;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border-left: 2px dotted #18BCA2;
border-right: 2px dotted #18BCA2;
}
.headerimage {
/* for formatting header image */
}
/*look and color of links (also partly for footer)*/
div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
color: #4AD3BD;
}
div#header a:hover, div#footer a:hover {
color: #18BCA2;
text-decoration: none;
}
/*title and subtitle*/
.title {
display: none;
}
.subtitle{
display: none;
}
/*--------- Header - top navigation ---------*/
/* header -- links to views; title of journal; subtitle of journal */
ul.navheader
{
padding: 0px;
margin: 0px;
}
ul.navheader li {
display: inline;
padding: 0 3px 0 3px;
}
/*--------- Entry stuff ---------*/
.subcontent {
}
.entry {
margin: 0px 10px 10px 30px;
padding: 10px;
color: #FFFFFF;
font-family: Tahoma;
font-size: 11px;
text-align: left;
border-style: none;
background: transparent;
line-height: 180%;
}
.userpic {
position: relative;
float: left;
padding: 5px;
margin: 10px;
z-index: 15;
border-style: none;
background-color: #4AD3BD;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.date {
line-height: 200%;
top: 5px;
color: #FFFFFF;
font-family: Tahoma;
font-size: 11px;
}
.subject {
padding: 10px;
font-family: 'Lobster Two';
font-size: 20px;
color: #18BCA2;
}
.subject a, .subject a:link, .subject a:visited {
color: #4AD3BD;
}
.subject a:hover {
color: #18BCA2;
}
.datesubject {
background-color: transparent;
padding: 5px;
}
.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 {
font-family: Tahoma;
font-size: 11px;
}
/*--------- Entry Stuff - Comments ---------*/
.comments {
font-family: 'Lobster';
font-size: 18px;
text-align: center;
background-color: #18BCA2;
padding: 8px;
position: relative;
top: 15px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #ffffff;
}
div.comments a:hover {
color: #4AD3BD;
text-decoration: none;
}
/*--------- Entry Stuff - Separator ---------*/
.separator{
/* for formatting separators between entries */
height: 35px;
}
/*--------- Special friends page customization ---------*/
.userpicfriends {
position: relative;
background-color: #4AD3BD !important;
float: left;
padding: 5px;
margin: 10px;
text-align: center;
border-style: none;
font-family: 'Lobster Two';
font-size: 11px;
z-index: 15;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
/*--------- Sidebar ---------*/
.defaultuserpic {
text-align: center;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.sbarheader {
padding: 0px 5px 0px 5px;
}
.sbarbody {
padding: 0px 5px 0px 5px;
}
.sbarbody2 {
padding: 0 15px 0 15px;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #4AD3BD;
}
div#sidebar a:hover {
color: #18BCA2;
text-decoration: none;
}
/*--------- Sidebar - Calendar ---------*/
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
border-color: #4AD3BD;
border-width: 1px;
border-style: dotted;
text-align: center;
font-family: 'Lobster Two';
font-size: 11px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
padding: 2px;
}
.sbarcalendarposts {
border-style: none;
background-color: #6C9F96;
text-align: center;
font-family: 'Lobster Two';
font-size: 11px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
padding: 2px;
}
/*----------- Sidebar - link box contents and sidebar box titles ---------*/
ul.sbarlist
{
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
li.sbaritem
{
padding-left: 15px;
list-style: none;
}
li.sbartitle
{
text-align: center;
list-style: none;
border-style: none;
background-color: transparent;
font-family: 'Lobster';
color: #18BCA2;
font-size: 20px;
margin-bottom: 10px;
margin-top: 20px;
}
/*----------- footer -----------*/
#footer {
width: 100%;
text-align: center;
font-family: 'Lobster';
font-size: 18px;
letter-spacing: 1px;
color: #18BCA2;
z-index: 100;
clear: both;
background: transparent url('http://i.imgur.com/8PD9V.png') repeat top left;
border-left: 2px dotted #18BCA2;
border-right: 2px dotted #18BCA2;
border-top: none;
border-bottom: none;
padding: 10px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {
clear: both;
}
/*----------- Archive Pages -----------*/
ul.year {
text-align: center;
padding-bottom: 30px;
padding-top: 10px;
font-family: 'Lobster Two';
font-size: 16px;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border-width: 2px;
border-style: dotted;
border-color: #18BCA2;
font-family: 'Lobster Two';
font-size: 13px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
table.yeartable td.yearday {
background-color: #18BCA2;
text-align: center;
}
td.yearmonth {
border-style: none;
font-family: 'Lobster';
font-size: 16px;
}
/*----------- Comments pages -----------*/
.datesubjectcomment {
background-color: #4AD3BD;
padding: 5px;
margin-top: 20px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.userpiccomment {
position: relative;
border-style: none;
background-color: #18BCA2;
top: -30px;
left: 0px;
padding: 5px;
margin: 10px 10px -20px 10px;
z-index: 15;
float: left;
border-style: none;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.box {
border-style: none;
padding: 10px;
clear: left;
}
input, textarea {
background-color: #4AD3BD;
color: #FFFFFF;
}
textarea.textbox {
width: 100% !important;
}
.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: Tahoma;
font-size: 11px;
line-height: 125%;
background-color: #18BCA2;
color: #FFFFFF;
}
.replytosubject {
font-weight: bold;
}
.commentreply {
position: relative;
margin: 10px;
font-size: 11px;
font-family: Tahoma;
color: #FFFFFF;
}
.commentbox {
border-style: none;
padding: 10px;
margin: 10px;
background-color: transparent;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #ffffff;
}
.datesubjectcomment a:hover {
color: #18BCA2;
}
.commentboxpartial {
border-style: none;
padding: 10px;
margin: 10px;
background-color: #18BCA2;
}
.commentinfo {
background-color: #18BCA2;
margin-top: 10px;
width: 100%;
}
.skiplinks {
text-align: center;
}
/*----------- Misc -----------*/
.clear {
height: 15px;
}
::selection {
background: #4AD3BD;
}
::-moz-selection {
background: #4AD3BD;
}
h1 {
font-size: 25px;
font-family: 'Lobster';
color: #4AD3BD;
}
h2 {
font-size: 22px;
font-family: 'Lobster';
color: #4AD3BD;
}
h3 {
font-size: 20px;
font-family: 'Lobster Two';
color: #4AD3BD;
}
h4 {
font-size: 18px;
font-family: 'Lobster Two';
color: #4AD3BD;
}
blockquote {
background-color: #6C9F96;
padding: 10px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
text-align: justify;
line-height: 150%;
font-face: verdana;
}
textarea {
background-color: #6C9F96;
padding: 10px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
code {
color: #6C9F96;
padding: 10px;
}
.ljtaglist {
padding: 20px;
line-height: 200%;
list-style-type:none;
}
ul {
list-style-image: url('http://i.imgur.com/3eXFJ.png');
}
@font-face {
font-family: 'Lobster';
font-style: normal;
font-weight: normal;
src: local('Lobster'), url('http://themes.googleusercontent.com/static/fonts/lobster/v4/MWVf-Rwh4GLQVBEwbyI61Q.woff') format('woff');
}
@font-face {
font-family: 'Lobster Two';
font-style: normal;
font-weight: 400;
src: local('Lobster Two'), local('LobsterTwo'), url('http://themes.googleusercontent.com/static/fonts/lobstertwo/v3/Law3VVulBOoxyKPkrNsAaIbN6UDyHWBl620a-IRfuBk.woff') format('woff');
}
/* Generated by Malionette's Tiny Icon Generator */
img[src*="img/userinfo.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(http://i.imgur.com/HMIvk.png) no-repeat !important; padding: 16px 0 0 16px !important; }
img[src*="img/community.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(http://i.imgur.com/SmVs4.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/EYD9o.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/oeOzZ.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/EYD9o.png) no-repeat !important; padding: 16px 0 0 16px !important; }
I offer a download of this layout in addition to the copy/paste code.
The download includes:
Layout codes, all image files, all tinyicons, extra background image options, and a replacement guide for customizing the colors, fonts, images, and width in this layout.
Notes
This is a pretty simple layout (I'm still stuck on a netbook), but I wanted to do an LJ version of the layout I did for my personal site, so here it is! Thanks to Rav for taking my screencaps for me since my current monitor is way too small for that stuff.
Please note that the opacity in the content boxes is an image, so if you want to change the color of it you'll have to do it in an image editor.
Hidden:
Title and subtitle.
Custom:
Tinyicons, bullets, archive page, tags page.
Tested in:
Credit
Credit when using this layout is a must, no matter how much you change in the code. There are three main ways to credit:
♥ In your profile with text and an LJ user link or HTML link to the layout.
♥ In your profile with a button.
♥ In your journal's linklist or blurb.
Basically anything visible. It doesn't have to be big, but it does need to be there.
tessisamess via layouttesst @ livejournal