dreamwidthlayouts | Tabula Rasa: Morning Comrades

Title: Morning Comrades
Credit to:

coliseu
Base style: Tabula Rasa
Type: CSS
Best resolution: 1366x768
Tested in: Google Chrome, Firefox
Features: Sidebar
Screenshot: Here

• Instructions:

Customize • Select Plain (Tabula Rasa);

Customize • Select 2 Column (sidebar on the left);

Modules • In Main Module Section select Profile (position 1) and Custom Text (position 2). All the other modules, including Navigation must be disabled;

Text • In Text for the 'Custom Text' box, paste this code:

and customize as you like;

Custom CSS • Make sure Use layout's stylesheet(s) is selected. Paste this code:

/* ----- FONTS ----- */
@font-face {
  font-family: 'Alegreya SC';
  font-style: normal;
  font-weight: 400;
  src: local('Alegreya SC'), local('AlegreyaSC-Regular'), url(http://themes.googleusercontent.com/static/fonts/alegreyasc/v4/-74JUGs8W14C5cCBFRS304bN6UDyHWBl620a-IRfuBk.woff) format('woff');
}
@font-face {
  font-family: 'Amethysta';
  font-style: normal;
  font-weight: 400;
  src: local('Amethysta'), local('Amethysta-Regular'), url(http://themes.googleusercontent.com/static/fonts/amethysta/v2/uuO0VFu8kdKx34ju6adj-D8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}

/* ----- BODY ----- */

body { font-family: Amethysta; background: #fff url() repeat fixed; }

a, a:link, a:hover, a:visited, a:active { text-decoration: none; color: #999; }

a:hover { color: #aaa; }

blockquote { padding: 10px; font-style: italic; color: #555; border-bottom: 10px solid #eee; }

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

#content { margin: 0 auto; }

/* ---- PRIMARY ---- */

#primary { width: 700px; margin-left: 230px;  margin-top: 55px; }

div.inner > div.userpic { text-align: center !important;    
margin-top: -140px; }

div.inner > div.userpic img { width: 50px; height: 50px;
padding: 10px; background: #efefef none repeat scroll 0 0;  }

div.inner > div.userpic img:hover { transform: rotate(30deg); -moz-transform: rotate(30deg); -o-transform: rotate(30deg); -webkit-transform: rotate(30deg); -webkit-transition: 0.8s ; -moz-transition: 0.8s ; -ms-transition: 0.8s ; -o-transition: 0.8s ; transition: 0.8s ; }

div.separator { height: 50px; }

.entry { background: #ffffff; line-height: 1.5em; }

.entry-title { font-size: 22px; text-transform: uppercase;  color: #686868; font-family: Alegreya SC; }

.entry-title a { color: #686868; }

.datetime { text-transform: uppercase; font-size: 11px;                 color: #898989; margin-top: -10px !important; }

.header { padding: 5px; text-align: center;   }

.entry-content { padding: 15px; color: #666; padding-top: 65px; }

ul.entry-interaction-links.text-links { text-align: center; padding-bottom: 10px; text-transform: uppercase;}

ul.entry-management-links.icon-links { text-align: center; }

img { max-width: 500px; text-align: center; }

/* ---- SECONDARY ---- */

#secondary { position: fixed !important; width: 350px !important; float: left; text-align: justify;
height: 100% !important; background: url(http://i.imgur.com/V4SDtYm.jpg) fixed #eee; padding-top: 150px; margin-top: -120px; z-index: 200; border-right: 1px solid #efefef; }

div.module-content > div.userpic { text-align: center !important; }

div.module-content > div.userpic img { margin-bottom: 15px;
border: 20px solid #fff; }

.module-customtext.module { width: 120px !important; margin-left: auto; margin-right: auto; padding: 10px; font-size: 12px; font-family: Alegreya SC; color: #999; background-color: #fff;   }

.linkbox {color: #666; border-bottom: 1px solid #e6e4e4; padding: 5px; text-align: center; margin-bottom: 8px; }

.linkbox a {color: #666;}

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

li.page-back, li.page-forward { text-transform: uppercase; font-size: 14px; }

/* ----- CONTROL STRIP ----- */

#lj_controlstrip {
background:#ffffff;
background-position: 0 0;
color: #666 !important;
border:0px;
z-index: 1000;
text-align: center; box-shadow: 3px 3px 3px #aaa;
 }

#lj_controlstrip a { color: #666 !important; }

#lj_controlstrip_userpic { display: none !important; }

#lj_controlstrip td, #lj_controlstrip_statustext {
color: #777 !important;
}

#lj_controlstrip input {
color:#606060 !important;
background-color: #f5f5f5 !important; 
border: 0px solid #cccccc;
}

#lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_login {
border-right: 0 !important;
color: #666 !important;
}

/* ---- DISPLAY ---- */

h2#pagetitle, h2#subtitle, h1#title, h2.module-header, .journal-name, #footer, div.navigation.topnav, .tag, .manage-link, ul.userlite-interaction-links.icon-links, .ljuser img, .header img, .cuttag img { display: none; }

Notes:
• I'm fully aware that this layout is impractical and not responsive at all. It's (mostly) my first time coding for Dreamwidth and I'm far too used with LiveJournal coding.
• You can modify this as you want.
• Credit is appreciated.
• If you wish to use another pattern on the sidebar, I recommend Subtle Patterns.

Flat | Top-Level Comments Only

This is lovely, thank you for making.

This is lovely!

This is really pretty, well done!

I used this for my journal, though as you can probably see, I edited it a good bit. Hope that's cool!

Lovely layout! I was wondering, though, how I can make entry tags show up?

Replace all the content after /* ---- DISPLAY ---- */ with this:

I've tried this layout, and I love the way it looks, but when I make a post in the journal, the whole layout scrambles. Any idea why?

Hey, not the op but I think I know the problem you are having because I just had it, haha. Not the fanciest coder in the world, but I hope this helps. With my settings, it'll end up roughly to what I have done on the layout I have on this account for quick reference. BUT this fixes the float issues that's come up.

1. Apply the layout as the OP said, etc, etc,
2. Once done go to the CSS code, and find this line:

3. Replace it with this:

#primary { width: 600px; margin-left: 500px; margin-top: 10px; float: left; margin: 60px 10px 10px 350px;}

The 60px denotes the height up and down the page you want it at, the 350px will move it left and right, effectivetly. Adjust as you need! I hope this helps.

Thanks for your help! The suggested changes ended up not being what I needed, unfortunately, and every time I thought I figured it out, something else went wrong. I'm still on a trial and error stage of coding, so unfortunately I think I need to find a layout that's not so high maintenance.

Damn, ah well. I hope you manage to find something that gets it working for you. If I can be of any help let me know! Best of luck. c:

Tabula Rasa: Morning Comrades

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject