#53 - Strawberry Fields

Aug 21, 2007 11:52



D E S C R I P T I O N

Name:

The Beatles - Strawberry Fields

Description:

S2 - Mixit layout featuring the Beatles and accents in red.

G E N E R A L     I N F O R M A T I O N

Works with ads?:

Yes

Style:

Mixit.

Tested in:

IE and Mozilla Firefox.

Best Resolution:

1024*768 and above

Works with Navigation Strip?:

Yes

Credit:

Please put a link to gawariel_design in your profile or sidebar.



{Bigger} - {Live Preview}



I N S T A L L A T I O N

Go to Manage:

Customize

Select a New Theme:

  • Type Mixit in the search box.
  • Click 'Search'.
  • Apply   any   theme that you get in the search results, it doesn't really matter which one!


Choose a Page Setup:



Note:

The following section(s) can be found in the  left, blue sidebar  of the page.
Only the sections I mention are the ones you MUST adjust. You can play with the rest as you please.

Text:

  • Under Comments:
    Change all the comment links to short words.
    E.g.
    • Leave a comment --> comment
    • 1 comment // # comments --> 1 // #
    • Edit Entry --> Edit
    • Add to Memories --> + Mem
    • Etc ...
Hit "save changes".

Custom CSS:

  • Use layout's "Base Weblog" stylesheet: No
  • Custom external stylesheet URL: Leave empty
  • Custom stylesheet: Paste the stylesheet (given bellow) in this box.
Hit "save changes".



I M A G E S     &     C O D E

Images:

The images are hosted on my account, but it is recommended that you upload them yourself. Don't forget to change the URL's in the code!


Code:

/* LAYOUT 53: STRAWBERRY FIELDS */
/* S2 STYLE: MIXIT */
/* AVAILABLE AT GAWARIEL_DESIGN (http://community.livejournal.com/gawariel_design/) */
/* CREATED BY GAWARIEL (http://gawariel.livejournal.com/) */
/* ALL IMAGES MADE IN PHOTOSHOP CS */
/*-----------------------------------------------------------------------------------------------*/

/*--------------------------*/
/*---------- MISC ----------*/
/*--------------------------*/

.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
/* so that IE users will still see an image */
background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/53_The%20Beatles/LJ-user.png);
padding: 18px 16px 0 2px;
}

.ljuser img[src="http://stat.livejournal.com/img/userinfo.gif"] {
background-color:transparent;
background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/53_The%20Beatles/LJ-user.png);
padding: 18px 16px 0px 2px!important;
}

.ljuser img[src="http://stat.livejournal.com/img/community.gif"] {
background-color:transparent;
background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/53_The%20Beatles/LJ-comm.png);
padding: 16px 16px 0 2px!important;
}

span.ljuser a b, .user-icon .ljuser a{
font-weight:normal;
}

/*-----------------------------*/
/*---------- GENERAL ----------*/
/*-----------------------------*/

body {
background: #555555 url(http://i19.photobucket.com/albums/b153/gawariel_design/53_The%20Beatles/BG.jpg) repeat-y top center;
color: #555555;
font-family: times new roman;
font-size: 9pt;
line-height: 20px;
letter-spacing: 1px;
margin-bottom: -10px;
}

a {
color: #B82323;
text-decoration: none;
}

a:hover {
color: #616161;
border-bottom: 2px solid #B82323
}

/*------------------------------------*/
/*---------- PAGE STRUCTURE ----------*/
/*------------------------------------*/

#container {
width: 820px;
margin-left: auto;
margin-right: auto;
}

#alpha {
width: 590px;
float: left;
padding: 0px 0px 0px 10px;
}

#beta {
width: 200px;
float: right;
}

/*----------------------------*/
/*---------- HEADER ----------*/
/*----------------------------*/

#header {
background: url(http://i19.photobucket.com/albums/b153/gawariel_design/53_The%20Beatles/BeatlesHeader.jpg) no-repeat;
width: 800px;
height: 400px;
margin-left: 9px;
margin-top: -8px;
border-bottom: 40px solid #fff;
border-top: 10px solid #fff;
}

html*#header {
margin-top: -15px;
}

#header-name {
display: none;
}

#header-description {
display: none;
}

/*-------------------------------*/
/*---------- NAVIGATION ---------*/
/*-------------------------------*/

.nav {
margin: 410px 0px 0px -40px;
}

ul.nav {
list-style: none;
}

ul.nav li.item {
display: inline;
}

.nav .item a {
float: left;
color: white;
margin: 0 5px 0px 0;
padding: 5px 5px;
text-decoration: none;
letter-spacing: 1px;
background-color: #cccccc;
border-bottom: 1px solid white;
}

.nav .item a:hover {
background-color: #CB8181;
}

/*----------------------------------*/
/*---------- ENTRY STYLING ---------*/
/*----------------------------------*/

.asset {
clear:both;
margin: 30px 0px 30px 0px;
}

.asset-header {
clear:both;
margin: 0px 0px 50px 0px;
}

h2.asset-name.page-header2 {
font-family: georgia,times,serif;
font-style: italic;
font-weight: bold;
font-size: 15px;
margin: 0px 15px 10px 0px;
padding: 0px 0px 5px 0px;
border-bottom: 2px solid #B82323;
}

h2.asset-name.page-header2 a{
color: #B82323;
}

h2.asset-name.page-header2 a:hover{
color: #B82323;
border: 0;
}

.asset-header .asset-meta-list li.item {
list-style: none;
}

.datetime {
float: right;
font-family: times new roman;
font-size: 9pt;
letter-spacing: 1px;
color: #aaaaaa;
margin: 0px 15px 0px 0px;
padding:3px 0px 0px 20px!important;
background:url(http://i19.photobucket.com/albums/b153/gawariel_design/53_The%20Beatles/Date.png) no-repeat center left;
}

.user-icon {
float:right;
position:relative;
margin:0px 5px 0px 0px;
padding: 5px;
font-size:10px;
text-align:center;
background-color: #cccccc;
}

.user-icon img {
border: 1px solid #fff;
}

.lj-currents {
margin: 20px 0px 0px 0px;
font-size:8pt;
padding: 12px 0px 0px 25px;
color: #aaaaaa;
}

.lj-currents .entryMetadata-label {
margin:0px 8px 0px 0px;
font-weight: normal;
text-decoration: underline;
}

.lj-currents ul{
margin:0px;
padding:0px;
list-style-type:none;
}

.asset-tags-list {
margin: -18px 0px 0px -15px;
font-size: 7pt;
list-style-type:none;
color:#c4c4c4;
}

html*.asset-tags-list {
margin: -22px 0px 0px 25px;
}

.asset-tags-list li.item {
display:inline;
padding:0px!important;
border:none!important;
}

.asset-tags-header {
padding: 0px 0px 0px 23px;
font-size:8pt;
color: #aaaaaa;
font-weight: normal;
text-decoration: underline;
}

li.asset-meta-comments {
display:block;
float:right;
font-size:10pt;
}

li.asset-meta-comments a {
display:block;
float:left;
text-decoration:none;
margin:15px 0px 20px 0px;
padding: 0px 5px 0px 20px;
background:url(http://i19.photobucket.com/albums/b153/gawariel_design/53_The%20Beatles/Website.png) no-repeat center left;
}

.asset-footer {
height: 80px;
}

/*--------------------------------*/
/*---------- PAGE FOOTER ---------*/
/*--------------------------------*/

#footer{
clear:both;
height:120px;
width: 820px;
background: url(http://i19.photobucket.com/albums/b153/gawariel_design/53_The%20Beatles/Footer.jpg) no-repeat;
border-top: 20px solid #fff;
}

/*------------------------------------*/
/*---------- SIDEBAR STYLING ---------*/
/*------------------------------------*/

.widget {
margin: 0px 8px 50px -8px;
}

h3.widget-header {
font-family: georgia,times,serif;
color: #B82323;
font-style: italic;
font-weight: bold;
font-size: 9pt;
letter-spacing: 2px;
margin: 0px 15px 10px 0px;
padding: 0px 0px 0px 10px;
border-bottom: 2px solid #B82323;
}

h3.widget-header a:hover{
color: #B82323;
border:0;
}

.widget-content {
color: #555555;
}

.widget-footer a {
float: right;
padding: 0px 10px 0px 15px;
background:url(http://i19.photobucket.com/albums/b153/gawariel_design/53_The%20Beatles/Website.png) no-repeat bottom left;
}

.user-pic {
text-align: center;
}

.user-pic img {
padding: 5px;
background-color: #cccccc;
border: 1px solid #B82323;
}

.profile-name a{
float: right;
padding: 0px 10px 0px 15px;
background:url(http://i19.photobucket.com/albums/b153/gawariel_design/53_The%20Beatles/Website.png) no-repeat bottom left;
}

.calendar-widget table {
margin: 0px 0px 0px 20px;
border-top: 1px solid #eeeeee;
border-left: 1px solid #eeeeee;
border-bottom: 1px solid #cccccc;
border-right: 1px solid #cccccc;
background: #fafafa;
}

.typelist-widget .widget-list {
list-style-type:none;
margin: 0px 10px 0px -40px;
}

html*.typelist-widget .widget-list {
margin: 0px 0px 0px 0px;
}

.typelist-widget li a {
display:block;
padding:6px 5px 6px 9px;
text-decoration:none;
font-weight:normal;
border-bottom:1px solid #cccccc;
}

.typelist-widget li a:hover {
border-left: 3px solid #B82323;
padding-left: 6px;
background: #fafafa;
}

.categories-widget .widget-list {
list-style-type:none;
margin: 0px 0px 0px -40px;
}

html*.categories-widget .widget-list {
margin: 0px 0px 0px 0px;
}

.categories-widget li a{
display:inline;
}

.archive-widget .widget-list {
list-style-type:none;
margin: 0px 10px 0px -40px;
}

html*.archive-widget .widget-list {
margin: 0px 0px 0px 0px;
}

.archive-widget li a {
display:block;
padding:6px 5px 6px 9px;
text-decoration:none;
font-weight:normal;
border-bottom:1px solid #cccccc;
}

.archive-widget li a:hover {
border-left: 3px solid #B82323;
padding-left: 6px;
background: #fafafa;
}

.syndicate-widget {
display: none;
}

.powered-widget {
display:none;
}

.designed-widget {
display: none;
}

/*------------------------*/
/*----- ARCHIVE PAGE -----*/
/*------------------------*/

.yeartable {
clear:both;
}

td.yearmonth {
color: #B82323;
font-weight: bold;
font-size: 11pt;
letter-spacing:1px;
padding:0px 0px 15px 0px;
}

.yearday {
background: #cccccc;
text-align:center;
color: #ffffff;
letter-spacing: 2px;
}

td.yeardate div {
text-align:center;
}

td.yeardate div{
border-top: 1px solid #eeeeee;
border-left: 1px solid #eeeeee;
border-bottom: 1px solid #cccccc;
border-right: 1px solid #cccccc;
background: #fafafa;
}

ul.year li {
display: block;
float: left;
color: white;
margin: 10px 5px 20px 0;
padding: 5px 10px;
text-decoration: none;
letter-spacing: 1px;
background-color: #cccccc;
border-bottom: 1px solid white;
}

ul.year li a {
color: #B82323;
}

ul.year li a:hover {
color: #616161;
border-bottom: 2px solid #B82323
}

dt {
display:block;
text-align: center;
height:20px;
width:40px;
color: white;
margin: 0 5px 5px 0;
padding: 5px 10px;
text-decoration: none;
letter-spacing: 1px;
background-color: #cccccc;
border-bottom: 1px solid white;
}

/*-------------------------*/
/*----- COMMENT PAGES -----*/
/*-------------------------*/

#comments .comment{
min-height: 115px;
margin:10px 10px 20px 10px;
padding: 10px;
background: #fafafa;
}

.comment-body {
padding:10px!important;
margin:0px!important;
line-height:18px;
width:auto;
}

.comment-odd, .comment-even {
border-top: 1px solid #f1f1f1!important;
border-left: 1px solid #f1f1f1!important;
border-bottom: 1px solid #e0e0e0!important;
border-right: 1px solid #e0e0e0!important;
}

#comments .comment-odd .comment-links, #comments .comment-even .comment-links {
padding: 5px 5px 5px 5px;
clear:both;
text-align: right;
}

.comment .user-icon {
float: left;
}

.comment-date {
margin: 0px 0px 20px 0px;
border-top: 1px solid #B82323;
}

.commenter-name {
font-size: 11pt;
}

.comment-subject {
font-size:11pt;
color: #B82323;
letter-spacing:1px;
padding:3px;
background:#fff;
font-weight: bold;
}

h2.comments-header {
text-align: center;
border-top: 1px solid #cccccc;
margin: 0px 5px 0px 0px;
padding: 10px 0px 0px 0px;
}

.comments-nav {
text-align:center;
}

textarea#commenttext.textbox {
width:90%;
}

form#postform {
margin: 0px 10px 0px 0px;
background: #fafafa;
border-top: 1px solid #f1f1f1!important;
border-left: 1px solid #f1f1f1!important;
border-bottom: 1px solid #e0e0e0!important;
border-right: 1px solid #e0e0e0!important;
}

textarea, input#subject.textbox, select {
background:#fff!important;
border:1px solid #cccccc!important;
margin:0px 0px 8px 0px;
padding:2px;
color:#888888;
font-family: times new roman;
font-size: 9pt;
line-height: 20px;
letter-spacing: 1px;
}

input {
border-top: 1px solid #f1f1f1!important;
border-left: 1px solid #f1f1f1!important;
border-bottom: 1px solid #e0e0e0!important;
border-right: 1px solid #e0e0e0!important;
background: #cccccc;
color: #ffffff;
font-family: times new roman;
}



E X T R A

FO Banner:



Icon:





T R O U B L E S H O O T I N G

Before asking any questions, make sure you read all information above thouroughly and that your question isn't adressed in the FAQ.

If your problem still isn't solved, you are welcome to ask your question here

layouts: account status: plus, graphics, layouts: account status: paid, layouts: [s2]: mixit, layouts: account status: basic, graphics: fo banners, layouts: [s2], layouts, graphics: icons

Previous post Next post
Up