smooth sailing: skies on fire
loalsfjasdf the product of a day that managed to be both extremely lazy and extremely stressful. Don't ask.
EDIT: Added a method to insert an image into the topbar.
EDIT2: lolfail for some reason I forgot to replace the old comment pages code, so they showed up in the Live and Let Die style I used as a base. It's fixed now.
layout notes.
Account Types:
Basic, Plus and Paid
Compatible Browsers:
Mozilla Firefox, Internet Explorer 7, Opera, Safari, Google Chrome.
Min. Resolution:
800x600
Credits and Misc.:
• Topbar background by mixremix.
• Layout background by cielo_gris.
Navstrip:
Works with and without.
Custom Comment Pages?:
Yes
Disabled Elements:
• Default navigation (uses Links List), tiny icons
installation.
CSS Stylesheet:
/*---------------------------------------------------
STYLESHEET CREATOR: scythe.livejournal.com
STYLESHEET NAME: Skies on Fire
S2 STYLE: Smooth Sailing
DOWNLOAD: thrashmetal.livejournal.com
****Please remember to credit!****
-----------------------------------------------------*/
body {
background:#F6F6F6 url(http://i40.tinypic.com/f59c07.jpg) repeat scroll 0 0;
color:#222222;
font-family:helvetica,arial;
font-size:11px;
margin:0;
}
.pageblock {
padding-bottom:12px;
position:absolute;
width:100%;
}
a, a:visited {
color:#FD0819;
letter-spacing:0;
text-decoration:none;
}
a:hover {
color:#949494;
}
a img {
border:medium none;
}
ul {
}
li {
background:transparent url(http://lj.irondevil.org/components/grayli.png) no-repeat scroll 0 7px;
list-style-type:none;
margin:2px 0;
padding:0 0 0 11px;
}
blockquote {
font-family:georgia;
font-size:12px;
line-height:18px;
padding:8px 0 8px 15px;
}
.header-title, .header-subtitle {
display:none;
}
.header-icon {
border-bottom:2px solid #F6F6BB;
border-left:2px solid #F6F6BB;
position:absolute;
right:0;
top:0;
z-index:1;
}
.pageheaderblock {
}
.pagefooterblock {
display:none;
}
.bodyblock {
margin:0 auto;
padding-top:307px;
width:500px;
}
.bodyheaderblock {
display:none;
padding:6px 0;
}
.bodynavblock {
color:#AAAAAA;
margin:0 33px;
padding:0;
}
.body-title {
display:none;
}
.body-midtitle {
display:none;
}
.entryHolder {
background:#FFFFFF none repeat scroll 0 0;
font-size:11px;
margin-bottom:20px;
}
.entryUserinfo {
margin-left:-149px;
margin-top:-29px;
position:absolute;
}
.entryUserinfo-username {
line-height:18px;
margin-bottom:6px;
max-width:130px;
padding:2px;
text-align:center;
}
.entryUserinfo-username .ljuser a b {
background:transparent none repeat scroll 0 0;
font-size:12px;
font-weight:normal;
letter-spacing:0;
text-decoration:none !important;
}
.entryUserinfo-usericon img {
background:#FD0819 none repeat scroll 0 0;
border:15px solid #FD0819;
cursor:auto !important;
}
.entryUserinfo-usericon img:hover {
border:15px solid #FFFFFF;
cursor:pointer;
background:white;
}
.entryText {
color:#222222;
font-size:12px;
line-height:20px;
min-height:100px;
padding:1px 14px 14px;
text-align:justify;
}
.entryHeader {
color:#FD0819;
line-height:17px;
min-height:24px;
padding:18px 0 5px 25px;
text-align:left;
text-transform:lowercase;
}
.entryHeader a {
color:#222222;
font-family:courier new;
font-size:14px;
letter-spacing:2px;
text-transform:uppercase;
}
.entryHeader a:hover {
}
.entryHeaderSubject {
color:white;
font-size:0;
margin-left:10px;
}
.entryHeaderDate {
color:#FD0819;
display:block;
font-family:georgia;
font-size:24px;
letter-spacing:2px;
margin-right:5px;
text-align:left;
text-transform:lowercase;
z-index:10;
}
.entryMetadata {
background:#FBFBFB none repeat scroll 0 0;
font-family:arial;
margin-bottom:0;
padding:0 33px 17px;
}
.entryMetadata a, .entryMetadata a:visited {
font-size:9px;
text-transform:lowercase;
}
.entryMetadata a:hover {
border-bottom:0 none;
text-decoration:none;
}
.entryMetadata ul {
margin:0;
padding:0;
}
.entryMetadata li {
background:transparent none repeat scroll 0 0;
display:block;
font-size:9px;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0;
padding-right:10px;
}
.entryMetadata-label {
font-family:helvetica;
font-size:10px;
font-weight:bold;
padding-right:4px;
text-transform:uppercase;
}
.entryLinkbar {
background:#F7F7F7 none repeat scroll 0 0;
color:#000000;
padding:4px 7px 8px 0;
position:relative;
text-align:right;
text-transform:lowercase;
top:0;
}
.entryLinkbar a {
background:transparent none repeat scroll 0 0;
color:#222222;
font-family:courier new;
font-size:10px;
font-weight:normal;
letter-spacing:0;
padding:0;
text-transform:uppercase;
}
.entryLinkbar a:hover {
}
.entryLinkbar ul {
margin-bottom:0 !important;
margin-left:0 !important;
margin-top:0 !important;
padding:0;
}
.entryLinkbar li {
background:transparent none repeat scroll 0 0;
display:inline;
margin:0;
padding:0 5px;
}
.commentHolder {
background:#030505 none repeat scroll 0 0;
border-left:0 none;
margin:19px 0 0;
}
.commentUserinfo {
background:transparent none repeat scroll 0 0;
color:#C3C3C3;
font-size:0;
line-height:19px;
text-align:center;
}
.commentUserinfo .ljuser a b {
background:transparent none repeat scroll 0 0;
font-size:12px;
letter-spacing:0;
text-decoration:none !important;
}
.commentUserinfo-usericon img {
border:15px solid #FF4546;
cursor:auto;
height:85px;
width:85px;
}
.commentUserinfo-usericon img:hover {
border:15px solid #111818;
}
.commentText {
background:#FBFBFB none repeat scroll 0 0;
color:#030505;
line-height:20px;
min-height:143px;
padding:10px 13px 0 12px;
text-align:justify;
}
.commentHeader {
background:#030505 none repeat scroll 0 0;
color:#FF4546;
font-size:17px;
letter-spacing:1px;
padding:10px 0 8px 10px;
position:relative;
text-transform:lowercase;
}
.commentHeaderScreened {
color:#4F4F4F;
font-family:georgia;
font-size:19px;
letter-spacing:2px;
margin-right:-12px;
position:relative;
text-transform:uppercase;
z-index:10;
}
.commentLinkbar {
background:#F7F5F5 none repeat scroll 0 0;
color:#878787;
font-size:11px;
text-align:right;
}
.commentLinkbar ul {
margin:0;
padding:0;
}
.commentLinkbar li {
background:transparent none repeat scroll 0 0;
color:#030505;
display:inline;
margin:0;
padding:0 5px;
}
.commentLinkbar a:hover {
text-decoration:none;
}
.commentLinkbar a {
background:transparent none repeat scroll 0 0;
color:#030505;
font-size:10px;
font-weight:normal;
padding:0;
text-transform:uppercase;
}
.replyform {
background:#FFFFFF none repeat scroll 0 0;
line-height:16px;
padding:20px;
}
.replyform textarea {
max-width:396px;
}
#qrform {
background:#FBFBFB none repeat scroll 0 0;
color:#030505;
}
#qrform table {
border:medium none !important;
}
.yearlinks {
text-align:right;
}
.yearlink {
padding-left:4px;
padding-right:4px;
}
.month {
background:transparent none repeat scroll 0 0;
margin:10px auto;
width:479px;
}
.daysubjects {
color:#434343;
padding:8px 8px 8px 40px;
}
.daytitles {
border:1px solid white;
color:#FF4546;
font-family:courier new;
font-size:17px;
text-align:center;
text-transform:lowercase;
}
.day-blank {
}
.day {
background:white none repeat scroll 0 0;
border:1px solid white;
margin-bottom:0;
padding:3px;
}
.day-date {
color:#000501;
font-family:arial;
text-align:center;
width:58px;
}
.day-count {
float:right;
font-size:20px;
text-align:center;
width:50%;
}
.day-count a {
font-family:georgia;
font-weight:normal;
padding:3px;
text-decoration:none;
}
.sidebar {
background:#FFFFFF url(http://i39.tinypic.com/1z4ighx.jpg) repeat scroll 0 0;
font-family:helvetica;
font-size:11px;
height:199px;
line-height:19px;
margin:0 auto;
padding-top:90px;
position:absolute;
text-align:center;
top:0;
width:500px;
}
.sidebox {
color:#CCCCCC;
margin-bottom:0;
margin-right:auto;
margin-top:0;
padding:0 22px;
text-align:justify;
}
.sideboxTitle {
display:none;
}
.sideboxContent {
background:transparent none repeat scroll 0 0;
font-size:11px;
line-height:18px;
text-align:justify;
}
.sidebox #freetext {
color:#222222;
float:right;
font-size:10px;
line-height:13px;
width:113px;
}
.sidebox #profile, , .sidebox #tags_sidebox, .sidebox #search, .sidebox #summary, .sidebox #latestmonth {
display:none;
}
.profile-label {
display:none;
}
.profile-content {
display:none;
}
.sidebox #systemlinks {
float:right;
line-height:19px;
text-align:right;
}
.sidebox #systemlinks a:link, .sidebox #systemlinks a:active, .sidebox #systemlinks a:visited {
color:#FD0819;
font-family:georgia;
font-size:23px;
letter-spacing:1px;
margin-right:7px;
text-transform:lowercase;
}
.sidebox #systemlinks a:hover, .sidebox #systemlinks a:active {
}
.listitem {
}
.listspacer {
height:10px;
}
.sidebox #latestmonth table {
margin-left:auto;
margin-right:auto;
margin-top:4px;
width:90%;
}
.listtitle {
display:none;
}
.header-menu {
display:none;
}
#footer-menu {
text-align:center;
}
#footer-menu a {
background:#FFFFFF none repeat scroll 0 0;
color:#222222;
padding:7px;
text-transform:lowercase;
}
.header-menu ul, #footer-menu ul {
margin:0 0 0 16px;
padding:0;
}
.header-menu li, #footer-menu li {
background:transparent none repeat scroll 0 0;
display:inline;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin-right:6px;
padding:0;
}
.tagstable, .tagstable td {
border:0 none;
}
.tagstable {
width:100%;
}
.taglist {
padding-bottom:10px;
}
textarea, input, select {
border:1px solid #F2F2F2;
color:#FD0819;
font-family:courier new;
font-size:12px;
line-height:normal;
margin:2px;
}
.ljuser a b {
background:transparent none repeat scroll 0 0;
font-family:courier new;
font-weight:normal;
letter-spacing:0;
text-decoration:none !important;
}
.ljuser a {
text-decoration:none !important;
}
.ljuser a:hover b {
background:transparent none repeat scroll 0 0;
border-bottom:0 none;
text-decoration:none !important;
}
img[src*="userinfo.gif"] {
height:0;
width:0;
}
img[src*="openid-profile.gif"] {
height:0;
width:0;
}
img[src*="anonymous.gif"] {
height:0;
width:0;
}
img[src*="community.gif"] {
height:0;
width:0;
}
img[src*="partnercomm.gif"] {
height:0;
width:0;
}
img[src*="newsinfo.gif"] {
height:0;
width:0;
}
img[src*="syndicated.gif"] {
height:0;
width:0;
}
img[src*="icon_protected.gif"] {
background-image:url(http://irondevil.org/icon/categories/fugue/lock.png) !important;
background-repeat:no-repeat !important;
height:0;
padding:16px 18px 0 0 !important;
width:0;
}
img[src*="icon_groups.gif"] {
background-image:url(http://irondevil.org/icon/categories/fugue/lock.png) !important;
background-repeat:no-repeat;
height:0;
padding:16px 18px 0 0 !important;
width:0;
}
img[src*="icon_private.gif"] {
background-image:url(http://irondevil.org/icon/categories/fugue/key.png) !important;
background-repeat:no-repeat;
height:0;
padding:17px 18px 0 0 !important;
width:0;
}
div.ContextualPopup img {
border:0 none;
}
div.ContextualPopup div.Inner {
background:transparent none repeat scroll 0 0 !important;
border:0 none;
color:#222222 !important;
font-family:helvetica;
font-size:11px;
padding:0;
width:23em;
}
div.ContextualPopup .Content {
background:white none repeat scroll 0 0;
line-height:1.4;
margin-right:81px;
padding:2px 4px 6px;
}
div.ContextualPopup .Relation {
font-weight:bold !important;
}
div.ContextualPopup .Content .OnlineStatus {
font-weight:bold;
}
div.ContextualPopup .Userpic {
border:10px solid #FD0819;
margin-left:11px;
padding:0;
}
div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
color:#FD0819 !important;
font-weight:normal;
text-decoration:none !important;
}
#lj_controlstrip {
background:#222222 none repeat scroll 0 0;
}
#lj_controlstrip td {
border-bottom:medium none;
color:#CFCFCF;
}
#lj_controlstrip_statustext {
color:#FFFFFF;
}
#lj_controlstrip a {
color:#FFFFFF;
}
#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_userpic {
background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo.gif/ptd4dce8000000);
;){kind=link}
}
#lj_controlstrip_loggedout_userpic {
background-image:url(http://stat.livejournal.com/palimg/controlstrip/ljlogo-loggedout.gif/ptd4dce8000000);
;){kind=link}
}
#lj_controlstrip input {
background:#FF4546 none repeat scroll 0 0 !important;
border:medium none;
color:#FFFFFF;
}
#lj_controlstrip_search_input_text, #lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember {
background:#FF4546 none repeat scroll 0 0 !important;
border:medium none;
color:#FFFFFF !important;
}
#lj_controlstrip .ljuser a b {
background:transparent none repeat scroll 0 0;
letter-spacing:0;
text-decoration:none !important;
}
How to Install:
1. Click here OR type "Smooth Sailing" into the search box. Apply one of the listed themes.
2. Click Customize your theme in the Current Theme box on the upper-right.
3. Go to Links List and define your links -- these are the big red links which appear in the topbar.
4. Click Sidebar. Set these drop down boxes to the following:
- Links Visibility - 2
- Free Text Position - 1
5. Click Custom CSS. Make sure the drop-down box is set to No, paste the code into the box, and click Save Changes.
Credit and Comment:
• Please credit thrashmetal somewhere public. (Profile, Links List, Friends Only post, etc.)
• Comments aren't required, but are appreciated!
Other Instructions:
Upload BG graphics to your own server:
http://i40.tinypic.com/f59c07.jpg (layout)
http://i39.tinypic.com/1z4ighx.jpg (topbar)
Upload the images to a site like Tinypic or Photobucket, then replace the old URL's.
Get the simplified date format in the preview:
Go to Entry Text » Page » Format for Date and Time (Recent/Friends/Entry/Reply page) and paste in the following:
%%mon%%.%%dd%%.%%yy%%
Add an image to the topbar:
If you don't care about the grungey background in the topbar disappearing, you can simply insert it in the background property under .sidebar, and change repeat to no-repeat. However, there is a way to add a header without interfering with the existing background.
- Go to Sidebar » Free Text #2 Position and set it to 3. Leave the box empty.
- Insert this code into your CSS:
.sidebox #freetext2 {
background: url(HEADER URL HERE) 0px 0px no-repeat;
width:250px;
height:250px;
position:absolute;
top:0;
margin-top:20px;
}
Adjust the 0px values at the end to shift the image horizontally and vertically, respectively. You can also change the width and height values if you want to show more of an image, though it'll overlap with the topbar links and text. - Hit Save Changes and you're done!
Please read all instructions and the LAYOUT FAQ before asking questions!