Layout #023: Felt Like Paisley

May 20, 2010 17:21

Стиль: S2 Smooth Sailing
Тип аккаунта: любой
Разрешение экрана: 1024+
Посты: резиновые
Браузеры: Mozilla, Chrome, Safari, Opera
Комментарии в стиле журнала: да
Контрольная панель: включена
Сайдбар: полный
Заголовок и подзаголовок: только заголовок
Style: S2 Smooth Sailing
Account type: all types
Screen Resolution: 1024+
Entries: stretch
Browsers: Mozilla, Chrome, Safari, Opera
Comments in journal's style: yes
Controlstrip: enabled
Sidebar: enabled, full
Title & Subtitle: title only


Вживую // Live preview:
recent // friends // comments


1. В настройках журнала выбираете тему Smooth Sailing (положение сайдбара - слева!) и жмете кнопку внизу "Customise selected theme ->".

2. В левом меню выбираете пункт "Custom CSS". В разделе "Page" ставите:

- Use layout's stylesheet(s): Yes
- Use layout's stylesheet(s) when including custom external stylesheet: No

3. В окошко Custom stylesheet вставляете текст:
1. In Customize section choose Smooth Sailing style (sidebar on the left!) and click "Customise selected theme ->" below.

2. In left menu choose "Custom CSS". In "Page" section choose:

- Use layout's stylesheet(s): Yes
- Use layout's stylesheet(s) when including custom external stylesheet: No

3. In Custom stylesheet block, insert the following code:
/* Layout #23: Felt Like Paisley */
/* Date: May 20, 2010 */
/* S2 Style: Smooth Sailing */

/*--------CREDITS---------*/

/* Design & Codes: Ruthenia Alba (ruthenia_alba.livejournal.com) */
/* Header background: Ruthenia Alba (ruthenia_alba.livejournal.com) */

/*-------- COLORS -------

#ca316c - a, calendar bg (pink);
#c75b84 - a:hover, textbox border (light pink);
#450325 - entry text (dark magenta);
#a95c4c - title & footer a (light brown);
#dced4f - header menu a:hover, subject (yellow);
#eb68a6 - header menu a, date (pink);
#ca316c - userpic border (light pink);
#e1ee6f - blockquote bg (light yellow);

*/

/*-------- BASICS ---------*/

body {
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-bg.gif) transparent repeat scroll;
}

.bodyheaderblock {
display: none;
}

/*-------- links---------*/

a, a:link, a:visited {
color: #ca316c;
text-decoration: none;
}

a:hover {
color: #c75b84;
text-decoration: none;
}

/* ----------- CONTENT ----------- */

/* ----------- header ----------- */

.pageheaderblock {
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-header-bg.gif) transparent repeat scroll;
height: 200px;
}

/* ----------- title & subtitle ----------- */

.header-title {
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-title-bg.png) transparent repeat-x scroll;
color: #a95c4c;
font: normal 15px century gothic;
text-transform: uppercase;
letter-spacing:1px;
height: 48px;
padding-top: 9px;
margin-top: -4px;
text-align: center;
}

.header-subtitle {
display: none;
}

/* ----------- header navigation ----------- */

.header-menu {
border: 0;
margin-top: 135px;
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-ribbon.png) transparent repeat-x scroll;
height: 40px;
padding-top: 10px;
text-align: center;
}

.header-menu ul li {
font: normal 14px Century Gothic;
text-transform: uppercase;
padding: 10px;

}

.header-menu ul {
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-credit.gif) no-repeat top right !important;
}

.header-menu ul a:hover {
background: transparent;
color: #DCED4F !important;
}

.header-menu ul a:link,
.header-menu ul a:visited {
background: transparent;
color: #eb68a6;
}

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

.sidebox {
margin: 0 10px 20px 0;
background: transparent;
}

.sideboxTitle {
position: relative;
border: 0;
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-title-bg.png) transparent repeat-x scroll;
height: 22px;
padding-top: 12px;
font: normal 11px century gothic;
text-transform:uppercase;
letter-spacing:1px;
color: #a95c4c;
z-index: 1;
}

.sideboxContent {
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-entry-bg.gif) transparent repeat scroll;
padding: 10px 10px;
margin-top: -2px;
font: normal 13px Trebuchet MS, Sans Serif;
color: #450325;
}

.profile-userpic {
padding: 2px;
background: #c75b84;
border: 1px solid #CA316C;
margin: 5px auto;
}

/* --------- sidebar items (summary, links) ------------------------- */

#summary b {
color: transparent;
}

.summaryList,
.listitem {
margin: 10px auto;
padding-left: 10px;
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-bullet.gif) transparent no-repeat;
text-align: left;
}

.listitem a {
padding-left: 10px;
}

/* --------- sidebar items (tags etc.) ------------------------- */

#tags_sidebox {
color: transparent;
font: normal 8px Trebuchet MS, Sans Serif;
padding: 20px 10px 20px 10px;
}

#tags_sidebox a {
display: block;
padding-left: 20px !important;
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-bullet.gif) transparent no-repeat;
text-align: left;
line-height:16px;
font: normal 13px Trebuchet MS, Sans Serif;
}

#freetext,
#search {
padding: 10px 15px 20px 15px;
}

/* --------- sidebar calendar ------------------------- */

.latestmonth-inactive {
height: 20px;
width: 20px;
margin: 2px;
}

.latestmonth-active {
height: 20px;
width: 20px;
background: #ca316c;
margin: 2px;
}

.latestmonth-active a:hover {
color: #DCED4F !important;
}

.latestmonth-active a,
.latestmonth-active a:visited {
color: #eb68a6 !important;
}

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

.bodyblock {
margin: 70px auto 50px auto;
padding: 0;
max-width: 1300px;
min-width: 900px;
}

.entryHolder,
.commentHolder {
border: 0;
margin: 0 0 30px 0;
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-entry-bg.gif) transparent repeat scroll;
font: normal 13px Trebuchet MS, Sans Serif;
color: #450325;
}

/* ------ entry header: date & subject ------ */

.entryHeader,
.commentHeader {
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-date-bg.png) transparent repeat-x scroll;
height: 22px;
padding-top: 12px;
font: normal 11px century gothic;
text-transform:uppercase;
letter-spacing:1px;
color: #eb68a6;
}

.commentHeaderSubject,
.entryHeaderSubject a,
.entryHeaderSubject a:hover,
.entryHeaderSubject a:visited {
font: normal 11px century gothic;
color: #DCED4F;
}

.entryUserinfo,
.commentUserinfo {
margin: 15px 0 10px 20px;
padding: 5px;
background: transparent;
border: 1px dashed #eb68a6;
}

/* -------- entry text -------------- */

.entryText,
.commentText {
text-align: justify;
padding: 10px 20px;
}

blockquote {
font: normal 13px Trebuchet MS, Sans Serif;
letter-spacing:px;
margin: 10px 100px;
padding: 10px 15px;
text-align: justify;
background: #e1ee6f;
border-left: solid 10px #ca316c;
}

/* -------- entry metadata -------------- */

.entryMetadata {
text-align: justify;
padding: 5px 20px;
font: normal 11px Trebuchet MS, Sans Serif;
}

.entryMetadata li {
padding: 1px 20px 0 0;
}

/* ------- entry links (comments, memories etc.) --------- */

.entryLinkbar,
.commentLinkbar {
background: transparent;
padding: 5px 20px 20px;
font: normal 13px Trebuchet MS, Sans Serif;
}

.entryLinkbar li,
.commentLinkbar li {
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-bullet.gif) transparent no-repeat;
padding: 1px 15px;
}

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

.bodynavblock {
background: transparent;
border: 0;
text-align: center;
margin: 0 200px;
padding: 0;
}

.bodynavblock ul {
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-title-bg.png) transparent repeat-x scroll;
height: 30px !important;
padding-top: 10px !important;
}

.bodynavblock b {
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-title-bg.png) transparent repeat-x scroll;
height: 40px !important;
padding: 10px 40px !important;
font: normal 14px century gothic;
text-transform: uppercase;
}

#footer-menu a,
.bodynavblock b a,
#footer-menu a:link,
.bodynavblock b a:link,
#footer-menu a:visited,
.bodynavblock b a:visited {
font: normal 14px century gothic;
text-transform: uppercase;
color: #a95c4c !important;
}

.pagefooterblock {
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-date-bg.png) transparent repeat-x scroll;
height: 24px;
border: 0;
color: transparent !important;
//color: #eb68a6 !important;
font: normal 11px century gothic !important;
text-transform: uppercase;
//padding-top: 5px;
position: relative;
z-index: 10;
}

/* ---------------- COMMENTS PAGE ------------------------ */

.commentUserinfo {
margin: 10px 0 10px 20px;
}

.commentHolder {
margin-bottom: 20px;
}

.bodynavblock {
margin-top: 50px;
}

/* ------ QUICK REPLY ------ */

.quickreply_entry form table,
.quickreply_comment form table,
#postform {
background: transparent;
border: 0 !important;
color: #450325;
font: normal 12px Trebuchet MS, Sans Serif;
line-height: 20px;
padding: 10px 50px;
margin: 30px;
}

#postform b {
color: #450325;
}

.replyform {
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-entry-bg.gif) transparent repeat scroll;
border: 0 !important;
}

.textbox {
border: 1px solid #c75b84;
padding: 3px;
}

/* ---------------- TAGS PAGE ------------------------ */

table .tagstable {
border: 0;
margin: 20px auto 40px auto;
}

table .tagstable td {
border: 0;
border-bottom: 1px solid #450325;
}

/* ---------------- CALENDAR ------------------------ */

.month {
background: transparent;
border: 0;
margin: 30px auto 70px auto;
padding:0;
width:500px;
}

.daysubjects {
}

.daytitles {
background: transparent;
border: 0;
border-bottom: 1px solid #450325;
padding: 5px;
font: normal 13px Century Gothic;
text-transform: uppercase;
color: #ca316c;
text-align:left;
}

.day-blank {
border: 0;
}

.day {
background: tranparent;
border:0;
margin:5px;
padding:3px;

}

.day-date {
width:40%;
background: transparent;
border: 0;
padding: 7px 3px;
color: #;
text-align: left;
font: normal 13px Trebuchet MS, Sans Serif;
}

.day-count {
float:right;
text-align:left;
width: 100%;
}

.day-count a,
.day-count a:visited {
background: transparent;
padding:3px;
color: #ca316c;
font: normal 13px Trebuchet MS, Sans Serif;
text-decoration: none;
}

.day-count a:hover {
color: #c75b84;
}

/* ------------------ MISCELLANEOUS ------------------------- */

/* --------------------- input & textarea ----------------------------- */

textarea, select {
border: solid 1px #c75b84;
background: #fff;
font: normal 12px Trebuchet MS, Sans Serif;
color: #450325;
line-height:20px;
margin:2px;
padding: 2px 5px;
}

input {
background: #eb68a6;
border: 0;
border-right: solid 5px #B62369;
margin:3px;
padding: 2px 5px;
font: normal 12px Trebuchet MS, Sans Serif;
color: #450325;
}

/* -------- lj user & images --------------- */

.ljuser a b {
color: #ca316c !important;
text-decoration: none;
}

.ljuser a:hover b {
color: #c75b84 !important;
text-decoration: none;
}

span.i-ljuser img[src*="img/userinfo.gif"] {
width: 0 !important;
height: 0 !important;
padding: 7px 10px 10px 8px !important;
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-ljuser.gif) no-repeat transparent;
}

span.i-ljuser img[src*="img/community.gif"] {
width: 0 !important;
height: 0 !important;
padding: 7px 10px 10px 10px !important;
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-ljcomm.gif) no-repeat transparent;
}

/* ---------------- controlstrip ------------------------------ */

#lj_controlstrip {
background: url(http://ruthenia-alba.webs.com/023paisley-layout/upload/023paisley-bg.gif) transparent repeat scroll;
}

#lj_controlstrip_statustext {
color: #a95c4c;
font: normal 12px Trebuchet MS, Sans Serif;
}

#lj_controlstrip a,
#lj_controlstrip a:link,
#lj_controlstrip a:visited {
color: #ca316c;
font: normal 12px Trebuchet MS, Sans Serif;
}

#lj_controlstrip a:hover {
color: #c75b84;
text-decoration: none;
}

#lj_controlstrip_user,
#lj_controlstrip_actionlinks,
#lj_controlstrip_search,
#lj_controlstrip_login,
#lj_controlstrip_loggedout_userpic {
border-right: 0 none;
}

#lj_controlstrip_login td {
border-bottom:0 none;
}

#lj_controlstrip td td {
border-bottom:0 none;
}

#lj_controlstrip input {
background: #eb68a6;
border: 0;
border-right: solid 5px #ca316c!important;
padding: 1px 5px;
font: normal 12px Trebuchet MS, Sans Serif;
color: #450325;
margin: 1px 5px;
}

#lj_controlstrip_search_input_text,
#lj_controlstrip select,
#lj_controlstrip input#xc_user,
#lj_controlstrip input#xc_password,
#lj_controlstrip input#xc_remember {
background: #E1EE6F !important;
border: 0;
}

#lj_controlstrip .ljuser a b {
font: normal 12px Trebuchet MS, Sans Serif;
color:#ca316c;
text-decoration: none !important;
}

#lj_controlstrip .ljuser a:hover b {
color: #c75b84 !important;
text-decoration: none !important;
}

/* ------------------ Contextual Popup ------------------ */

div.ContextualPopup img {
border:0;
}

div.ContextualPopup div.Inner {
background: #fff;
border: 1px dashed #eb68a6;
margin:3px;
padding: 2px 5px;
font: normal 12px Trebuchet MS, Sans Serif;
color: #450325;
}

div.ContextualPopup .Relation {
border-bottom:0px;
color: #450325 !important;
font: normal 13px century gothic !important;
letter-spacing: 0;
margin:2px 0;
padding:2px 0;
text-transform:uppercase;
}

div.ContextualPopup .Content .OnlineStatus {
font-weight:bold;
font: normal 12px Trebuchet MS, Sans Serif;
color: #450325;
}

div.ContextualPopup .Userpic {
padding:8px 8px 0 0;
}

div.ContextualPopup div.Inner a,
div.ContextualPopup div.Inner a:link,
div.ContextualPopup div.Inner a:visited {
color: #ca316c !important;
font: normal 12px Trebuchet MS, Sans Serif;
text-decoration: none !important;
}

div.ContextualPopup div.Inner a:hover {
color: #c75b84 !important;
text-decoration:none !important;
}

layouts, layouts // smooth sailing, layouts [free]

Previous post Next post
Up