tofuhouse | layout (tabula rasa)

[ click to see full size. live preview @

lipsum ]

I told a few people I'll make something more for text heavy purposes, with readable colours. The purpose of this is to have a pretty simple layout, so that when you use it on a small screen (like phones), it'll still be readable and clean. This way, if you make giant walls of text, like fiction, it will look like an e-reader. Both ways it should work on big monitors and little ones.

It's also made so that you can showcase your fiction (or site or art, etc) with the module order at the top, so your links, custom text, even sticky entries. The sizes of the custom font should still allow easy use of fancy codes (like navigation) without borking them. To see it with all its modules where they best are, check out

lipsum, even though it's SUPER MESSY.

Crystal Ball is named after "Crystal Ball" by Keane.

ABOUT THE LAYOUT
It's a super simple and layout with no patterns and only custom font, mostly for the purpose of writing:
- Screen Width: Aim for bigger than 1024+, but should be any cos it's--
- Fluid Width: Also phone friendly, cos that's the purpose!
- Custom: Navigation Bar, Comments, Icons, Hover Pop-up thing, Sticky Entries.
- Fonts: The fonts chosen are Varela (san serif) for titles, and Droid Serif (serif) for body text. Both of these fonts are good for lots of text.
--- The open source used here is Google Fonts, but I am sure Brick.im has Droid Serif at least.
- Optimal on: Firefox and Chrome (and consequently their forks and Opera). Works on Internet Explorer and Safari too (at least I think so when I clicked around).
--- Decently passable on phone screens because that's my aim.

WHAT CAN YOU USE THIS FOR?
- Journals + Communities (of any kind)
- Walls of text
- Actual online novel?!
- Browsing on the phone/tablet/small screens without squinting at layouts until DW becomes fully responsive.

HOW TO INSTALL
1. Select Tabula Rasa: Plain. (the ultimate layout base in DW)
2. Customise
2.1 Scroll down and choose a Page Set Up: Choose "1 Column (modules at top and bottom; no sidebar)".
--- NOTE: It doesn't work on anything else.
3 Reorder and Choose Modules: Choose the ones you want, and put them according:
3.1: Put these in Main Module Section
- Navigation (1st position)
- Link List (any position after 1)
- Tags (in any position after 1): Change to Cloud
--- Change number of tags to 0 if you want for all tags.
- Custom Text (any position after 1)
3.2: Put These in Secondary Module Section in Any Order
- Profile, Calendar, Syndication, Page Summary, Recent Active Entries, Style Credit, Search, Cut Tag Controls, Time Loaded, Powered By
--- None of these will appear in Main Module Section even if you put them there
- Any of the above in Main Module Section can also go here. Tags can be in any form.
4. Customise Links and Custom Text:
4.1 Links
4.2 Custom Text of any kind: Scroll down to "Custom Text" options.
--- You can change the names of anything here anyway
5.1 Custom CSS: Make sure "Use layout's stylesheet(s)" is checked.
--- It uses the original Plain css. My code just overlaps extra on top of it.
--- This method keeps all these layouts practically mobile responsive.
--- I dare you to uncheck the box. Do it. The layout will look super hideous.
5.2 Copy and paste the following code into "Use embedded CSS"

/*----CRYSTAL BALL----*/
/* Base: Tabula Rasa (Plain) */
/* Edited by saga @ tofuhouse | 9th December 2015 */
/* feel free to edit as you like */
/* look at me trying to make easy to read things */

/*----CUSTOM FONTS DECLARATION----*/

@font-face {
  font-family: 'Droid Serif';
  font-style: normal;
  font-weight: 400;
  src: local('Droid Serif'), local('DroidSerif'), url(https://fonts.gstatic.com/s/droidserif/v6/0AKsP294HTD-nvJgucYTaIbN6UDyHWBl620a-IRfuBk.woff) format('woff');
}

@font-face {
  font-family: 'Varela';
  font-style: normal;
  font-weight: 400;
  src: local('Varela'), url(https://fonts.gstatic.com/s/varela/v7/_yYHMt_E4smqfVTA22m7TQ.woff) format('woff');
}

/*----MAIN----*/

body {
color: #333333;
background: #eeeeee;
font-family: 'Droid Serif', Georgia;
font-size: 1em;
    }

a {
text-decoration: none!important;
color: #790000;
}

a:visited {
color: #790000;
}

a:hover {
color: #000000;
}

a:active {
color: #790000;
}

blockquote {
color:#555555!important;
background:#eaeaea;
border: none;
margin: 1em;
padding: 0em 1em;
font-size:1em;
font-style:normal;
}

blockquote:before {
margin-bottom: 1em;
content: '';
display: block;
height: 1px;
background-image: linear-gradient(to right, rgba(51, 51, 51, 0), rgba(51, 51, 51, 1), rgba(51, 51, 51, 0));
}

blockquote:after {
margin-top: 1em;
content: '';
display: block;
height: 1px;
background-image: linear-gradient(to right, rgba(51, 51, 51, 0), rgba(51, 51, 51, 1), rgba(51, 51, 51, 0));
}

hr {
border:0px;
}

hr:after {
content: '';
display: block;
height: 1px;
background-image: linear-gradient(to right, rgba(51, 51, 51, 0), rgba(51, 51, 51, 1), rgba(51, 51, 51, 0));
}

h1, h2, h3 {
font-weight: normal;
text-shadow: 1px 1px #cccccc;
padding:0px;
margin:0px;
}

/*----LAYOUT----*/

#primary, #secondary, #tertiary, .page-top { 
margin: 0 auto;
}

#primary > .inner:first-child, #secondary > .inner:first-child, #tertiary > .inner:first-child {
    padding: 0em;
width:100%;
}

@media only screen and (min-width: 40em) {
#primary, #header, #secondary, .page-top { 
width: 57%; }
}

#header, #footer {
    margin: 0;
    clear: both;
    padding: 0;
}

#secondary .module-navlinks .module {
width:100%!important;
}

div.navigation.topnav {display: none;}
div.navigation.bottomnav { margin: 1em 0;
padding:1em;
font-size: 1em;
font-weight: normal; 
text-align:right; }

div.navigation.bottomnav.empty {padding:0em!important;}

#secondary, #tertiary { text-align: center; }

@media only screen and (min-width: 40em) {
#tertiary .module { 
display: inline-block;
vertical-align: top;
width: 24%;
padding: 0 0.25em;
margin: 0.5em 0; }
}

#secondary .module-content, #tertiary .module-content {
padding: 0 1em 1em 1em;
}

@media only screen and (min-width: 40em) {
#secondary .module-content, #tertiary .module-content { 
padding: 0 0 1em 0; }
}

/*----HEADER + FOOTER----*/

#header {
margin: 0 auto 0;
}

#header>.inner {
padding: 1em;
text-align:center;
}

#footer {
margin: 0 auto;
}

#footer>.inner {
padding: 1em;
text-align:center;
}

#footer .page-top {
text-align:center;
color: #333333;
font-size: 1em;
letter-spacing: 0.1em;
text-transform: lowercase;
    }

#header h1#title {
color: #333333;
text-shadow: 1px 1px 1px #888888;
font-weight:normal;
font-family: 'Varela', Arial;
font-size: 1.7em;
letter-spacing: 0.1em;
}

#header h1#title a {
color: #333333 !important;
}

#header h1#title a:hover {
color: #000000!important;
}

#header h2#subtitle {
color: #888888;
text-shadow: 1px 1px 1px #cccccc;
font-weight:normal;
font-family: 'Varela', Arial;
font-size: 1.1em;
letter-spacing: 0.1em;
margin-top:1em;
}

#header h2#pagetitle {
display: none;
}

#footer a {color:#333333;}
#footer a:hover {color:#790000;}

/*----NAV LINKS (NOT CONTROL STRIP) ---*/

#secondary .module-navlinks {
text-align: center;
width:100%;
margin: 0 0 2em 0;
}

#secondary .module-navlinks ul {
margin: 0;
padding: 0;
display: inline;
}

#secondary .module-navlinks.module li {
font-size: 0.8em;
padding: 0.5em ;
display: inline;}

#secondary .module-navlinks.module li:hover {}

#secondary .module-navlinks .module-header {display:none;}

#secondary .module-navlinks ul.module-list {
display: inline;
letter-spacing: 0.2em;
text-transform: lowercase;
font-family:  'Varela', Arial;
}

#secondary .module-navlinks ul.module-list li a {
color:#aaaaaa;
}

#secondary .module-navlinks ul.module-list li a:hover {
color:#790000;
}

#tertiary .module-navlinks .module-content {
text-align:left;
}

#tertiary .module-navlinks:before {
margin-top:0.25em;
content:'Navigation';
display:block;
font-family: 'Varela', Arial !important;
font-size:1.3em;
letter-spacing:0.1em;
padding:0.5em;
text-transform: uppercase; 
text-align:center !important;
font-weight:normal;
color:#333333!important;
text-shadow: 1px 1px #cccccc;
}

#tertiary .module-navlinks .module-content:before {
content: '';
display: block;
height: 1px;
background-image: linear-gradient(to right, rgba(51, 51, 51, 0), rgba(51, 51, 51, 1), rgba(51, 51, 51, 0));
}

/*----MODULES----*/

#secondary {
clear:both;
}

#secondary>.inner {
border-left: 0px;
margin:0px;
padding:0px;
}

#tertiary {
background: #e5e5e5;
}

h2.module-header {
clear:both;
display:block;
font-family: 'Varela', Arial !important;
font-size:1.3em;
letter-spacing:0.1em;
padding:0.5em;
text-transform: uppercase; 
text-align:center !important;
font-weight:normal;
color:#333333!important;
text-shadow: 1px 1px #cccccc;
}

h2.module-header:after {
margin-top:0.5em;
content: '';
display: block;
height: 1px;
background-image: linear-gradient(to right, rgba(51, 51, 51, 0), rgba(51, 51, 51, 1), rgba(51, 51, 51, 0));
}

h2.module-header a {
color:#333333!important;
}

h2.module-header a:hover {
color:#790000!important;
}

#secondary .module-content {
}

#secondary .module-userprofile, #secondary .module-calendar, #secondary .module-syndicate, #secondary .module-pagesummary, #secondary .module-time, #secondary .module-powered, #secondary .module-credit, #secondary .module-cuttagcontrols, #secondary .module-search, #secondary .module-active {
display: none;
}

.module-content {
text-align: center;
}

.module-customtext .module-content {
text-align:justify;
}

.module-pagesummary .module-content, .module-time .module-content, .module-powered .module-content, .module-powered .module-content, .module-tags_list .module-content, .module-tags_cloud .module-content, .module-tags_multilevel .module-content, .module-active .module-content, #tertiary .module-typelist .module-content {text-align: left;}

#tertiary .module-typelist ul, #tertiary .module-navlinks ul {
list-style-type: none;
}

.module-content .userpic  {display:block;
float:none;
clear:both;
text-align: center;
}

.module-content .journal-name {clear:both;
text-align: center;}
ul.userlite-interaction-links.icon-links {
clear:both;
margin-left: 0;
padding-left: 0;
text-align: center;
}
ul.userlite-interaction-links.icon-links li {
clear:both;
display: inline;
padding: 0 .20em;
border:0px;
}

.module-calendar { text-align: center !important; 
padding:0px 0px 10px 0px !important;}
.module-calendar table {width: 100%; text-align: center !important;  }
.module-calendar td {border: 1px solid #dddddd;}
.module-calendar .empty-day {border: 1px solid #d5d5d5;}
.module-calendar .entry-day {border: 1px solid #cccccc; background-color: #eeeeee !important;}
.module-calendar th {background: #eeeeee; border: 1px solid #eeeeee;}

.module-tags_cloud li,
.tags_cloud li {
display:block;
font-size:1em!important;
}

#secondary .module-tags_cloud ul, #secondary .tags_cloud ul, #secondary .module-tags_list ul {
list-style-type: none;
margin-left:0em;
}

#secondary .module-tags_cloud li, #secondary .tags_cloud li {
display:inline;
margin:0 1em 0 0;
}

.manage-link {
font-size:0.8em;
text-align:center;
}

.module-userprofile .userpic img {
background: #eeeeee;
}

#secondary .module-typelist ul { list-style-type: none;
margin-left:0em;
}

#secondary .module-typelist li {
display: inline-block;
width: 19%;
background:#e5e5e5;
font-family: 'Varela', Arial;
font-size: 0.8em;
text-align:center;
padding: 0.5em 0;
vertical-align: top;
}

#secondary .module-typelist li a{
color:#888888;
}

#secondary .module-typelist li a:hover {
color:#790000;
}

#tertiary .module-content {
max-height:200px;
overflow-y:auto;
}

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

.entry {
border-top:5px solid #333333;
margin:2em 0;
padding:0px;
border-bottom: 5px solid #e5e5e5;
}

.entry .header {
font-family: 'Varela', Arial;
text-align: center;
margin:0px;
padding:1em;
}

.entry .header:after {
margin-top:1em;
content: '';
display: block;
height: 1px;
background-image: linear-gradient(to right, rgba(51, 51, 51, 0), rgba(51, 51, 51, 1), rgba(51, 51, 51, 0));
}

h3.entry-title {
font-family: 'Varela', Arial;
font-size: 1.3em; 
font-weight: normal;
letter-spacing: 0.1em;
margin: 0;
padding: 0;
text-shadow: 1px 1px #cccccc;
}

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

.entry .entry-title a:hover {
color: #790000;
}

.entry .datetime {
font-size:0.85em;
color: #aaaaaa;
}

.entry .datetime a {
color: #aaaaaa;
}

.entry .datetime a:hover {
color: #790000;
}

.entry .userpic {
text-align:center; 
}
.entry-poster {
display:block;
text-align: center;
}

@media only screen and (min-width: 40em) {
.entry .userpic {
float:left;
margin: -1em 0em 0em -8em;    }
.entry-poster {
display:block;
text-align: left;
}
}
.userpic img {
width:100px;
height:100px;
background: #e5e5e5;
padding: 5px;
border: 0;
}

.entry .contents { 
min-height:120px;
}

@media only screen and (min-width: 40em) {
.entry .contents { 
margin:1em 0 0 0;
}
}

.entry .entry-content {
padding: 1em;
letter-spacing:0.01em;
text-align: justify;
}

@media only screen and (min-width: 40em) {
.entry .entry-content { overflow:auto;
}
}

.poster.entry-poster { padding: 0em 1em;
text-shadow: 1px 1px #cccccc;
color:#888888;}

.poster.entry-poster.empty { padding: 0em!important; }

ul.entry-management-links li {
padding: 0 .25em;
}

ul.entry-interaction-links li {
padding: 0 .25em;
}

ul.entry-interaction-links, ul.entry-management-links,
ul.comment-interaction-links, ul.comment-management-links {
margin:0;
padding: 0em;
display:block;
text-align:center;
}

ul.text-links li { 
font-family: 'Varela', Arial;
font-weight: normal;
font-size: 0.8em;
padding: 1em;
text-transform: uppercase;
letter-spacing: 1px;
text-decoration:none;
text-shadow: 1px 1px #cccccc;}
.text-links a, #comments .text-links a { color: #888888 !important; text-decoration:none;}
ul.text-links li:hover {text-decoration:none;}
.text-links li:hover a, #comments .text-links li:hover a {color: #790000 !important; text-decoration:none;}

ul.text-links li:active {text-decoration:none;}
.text-links li:active a, #comments .text-links li:active a {text-decoration:none;}

ul.text-links li:visited {text-decoration:none;}
.text-links li:visited a, #comments .text-links li:visited a {text-decoration:none;}

.entry .footer, .comment .footer {
clear:both;
margin: 0px;
padding: 1em 0;
text-align:center;
}

.tag { margin: 0 0 1em 0;
padding: 0 1em 1em 1em;
text-align:left!important;
font-weight: normal;
font-size: 0.8em;
text-shadow: 1px 1px #cccccc;
}

.metadata {
margin: 1em 1em 1em 2em;
}

.metadata-label-location,
.metadata-label-mood,
.metadata-label-music {
display:inline;
text-transform: lowercase;}

.metadata ul {
font-weight: normal;
font-size: 0.9em;
}

.metadata ul li {color:#666666;}

.tag ul li {
font-size:1.1em;
font-weight: normal;
margin: .5em .2em 0 0;
text-align: right;
}

.sticky-entry {
/*background:#e5e5e5;*/
border: 5px #e5e5e5 solid;
}

.sticky-entry .footer, .sticky-entry .datetime, .sticky-entry .metadata, .sticky-entry .userpic, .sticky-entry .poster.entry-poster {
display:none;
}

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

.comment-wrapper {
margin:0px;
}

.comment {
margin:0px;
padding:0px; 
border-top:5px #333333 solid;
border-bottom: 5px #e5e5e5 solid;
}

.comment .contents {padding:1em;}

.comment-pages {
text-align:center;
padding: 1em 0;}

.comment .header {
text-align: center;
margin:0px;
padding:1em;
}

.comment .header:after {
margin-top:1em;
content: '';
display: block;
height: 1px;
background-image: linear-gradient(to right, rgba(51, 51, 51, 0), rgba(51, 51, 51, 1), rgba(51, 51, 51, 0));
}

.comment-title {
font-family: 'Varela', Arial;
font-size: 1.3em; 
color: #333333;
font-weight: normal;
letter-spacing: 0.1em;
margin: 0;
padding: 0;
text-transform: none;
text-shadow:1px 1px #cccccc;
}

.comment-title a { color: #333333; }
.comment-title a:hover { color: #790000; }

.comment .datetime {color: #aaaaaa!important;
font-size:0.85em;
font-family: 'Varela', Arial;}

.comment .userpic {
float:left;
margin: 0 1em 1em 0;
}

.comment-poster {text-transform:none;
color:#888888;
text-shadow: 1px 1px #cccccc;}

.comment .poster-ip {
display:block;
color:#aaaaaa;
font-size:0.85em;
margin-bottom: 1em;
}

.bottomcomment,
.comments-message {
border:0px;
margin:1em 0;
padding: 1em 0;
text-align:center;
}

/*----ARCHIVES---*/

li.active {
color: #333333;
}

.month {
margin: 0em auto;
padding: 0;
}

.month-wrapper, .page-month .month {
border-top:5px #333333 solid;
border-bottom: 5px #e5e5e5 solid;
padding: 0 0 1em 0;
margin: 1em 0;
}

.month .header {
text-align: center;
margin:0px;
padding:1em;
}

.month .header:after {
margin-top:1em;
content: '';
display: block;
height: 1px;
background-image: linear-gradient(to right, rgba(51, 51, 51, 0), rgba(51, 51, 51, 1), rgba(51, 51, 51, 0));
}

.month h3 {
font-family: 'Varela', Arial;
font-size: 1.3em; 
color: #333333;
font-weight: normal;
letter-spacing: 0.1em;
margin: 0;
padding: 0;
text-transform: uppercase;
text-align:center;
text-shadow: 1px 1px #cccccc;
}

.month .contents { padding:1em;}

.month .footer {text-align: center;}

.month table {
width:100%;
border-spacing: 1px;
border-collapse: separate;
}

table.month caption {
margin-bottom:1em;
text-shadow: 1px 1px #cccccc;
}

.month td.day-empty {border: 1px solid #e5e5e5;}
.month td.day {border: 1px solid #dddddd;}
.month td.day-has-entries {border: 1px solid #cccccc; background-color: #f5f5f5 !important;}
.month-wrapper th {background:#f5f5f5; border: 0px!important; text-shadow: 1px 1px #cccccc;}

.month-wrapper .day-has-entries {
}

.month-wrapper .day-has-entries a {
}

.month-wrapper .day-has-entries:hover {
}

h3.day-date {
display:block;
width:100%;
color:#333333; text-shadow: 1px 1px #cccccc;
font-weight:normal;
font-size: 1.2em;
font-family: 'Varela', Arial;
padding: 1em 0;
margin: 2em 0 0 0;
text-align:center;
text-transform: uppercase;
}

h3.day-date:after {
margin-top:1em;
content: '';
display: block;
height: 1px;
background-image: linear-gradient(to right, rgba(51, 51, 51, 0), rgba(51, 51, 51, 1), rgba(51, 51, 51, 0));
}

.month dl {
font-family: 'Varela', Arial;
margin:0px;
padding:1em;
}

.month dl dt {
text-transform: uppercase;
text-shadow: 1px 1px #cccccc;
font-weight: normal;
font-size:1.3em;
}

.month dd h3 {
padding: 0em 0em 0em 0.5em;
}

.month dd h3 a {
color: #333333;
text-shadow: 1px 1px #cccccc;
}

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

.page-tags .tags-container {
margin: 2em auto;
padding: 0;
border-top:5px #333333 solid;
border-bottom: 5px #e5e5e5 solid;
}

.page-tags .header {
text-align: center;
margin:0px;
padding:1em;
}

.page-tags .header:after {
margin-top:1em;
content: '';
display: block;
height: 1px;
background-image: linear-gradient(to right, rgba(51, 51, 51, 0), rgba(51, 51, 51, 1), rgba(51, 51, 51, 0));
}

.page-tags .tags-container h2 {
font-family: 'Varela', Arial;
font-size: 1.3em; 
color: #333333;
font-weight: normal;
letter-spacing: 0.1em;
margin: 0;
padding: 0;
text-transform: uppercase;
text-align: center;
text-shadow: 1px 1px #cccccc;
}

.page-tags .contents { padding:1em;}

.page-tags .footer {text-align: center;}

/*----ICONS----*/

.icons-container {
margin: 2em auto;
padding: 0;
border-top:5px #333333 solid;
border-bottom: 5px #e5e5e5 solid;
}

.icons-container .header {
text-align: center;
margin:0px;
padding:1em;
}

.icons-container .header:after {
margin-top:1em;
content: '';
display: block;
height: 1px;
background-image: linear-gradient(to right, rgba(51, 51, 51, 0), rgba(51, 51, 51, 1), rgba(51, 51, 51, 0));
}

.icons-container h2 {
font-family: 'Varela', Arial;
font-size: 1.3em; 
color: #333333;
font-weight: normal;
letter-spacing: 0.1em;
margin: 0;
padding: 0;
text-transform: uppercase;
text-align: center;
text-shadow: 1px 1px #cccccc;
}

.icons-container .contents { padding:1em;}

.icons-container .icon-pages {
text-align: center;
}

.icons-container .footer {text-align: center;
clear:both;}

.icons-container .icon {
float:left;
min-width: 280px;
vertical-align: bottom;
width: 50%;
display:table;
font-size: 0.9em;
}

.icon-image {
float: left;
clear: left;
margin-bottom: .25em;
min-width: 100px;
padding-right: 1em;
}

.icon-info span {
font-weight: normal;
}

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

#lj_controlstrip {
text-align:center;
background: #e5e5e5;
background-position: 0 0;
border:0px;
text-shadow: 1px 1px #cccccc;
}

#lj_controlstrip td, #lj_controlstrip_statustext {
font-family: Arial !important;
color: #333333 !important;
}

#lj_controlstrip input {
color:#333333 !important;
background-color: #dddddd !important; 
border: 1px solid #dddddd;
}

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

#lj_controlstrip td a {
color: #333333 !important;
}

#lj_controlstrip td a:hover {
color: #888888 !important;
}

/*----HOVER MENU THING----*/

.ContextualPopup {
font-family: 'Varela', Arial;
background: #eeeeee!important;
color: #333333!important;
font-size: 0.8em !important;
font-weight; normal !important;
border:0px !important;
border-radius: 0px!important;
box-shadow: 1px 1px 2px #000000;
text-shadow: 1px 1px #cccccc;
}

.ContextualPopup a { font-size: 0.8em !important;
color: #333333!important; }
.ContextualPopup a:visited { color: #333333!important; }
.ContextualPopup a:hover { color: #790000!important; }
.ContextualPopup a:active { color: #333333!important; }

.ContextualPopup .Relation {
display:block;
font-weight:normal;
font-size:1.1em;
font-family: 'Bitter', Georgia;
margin: 0 0 5px 0;
color: #333333;
border-bottom: 1px solid #666666;
padding:5px 0;
}

.ContextualPopup .Userpic {
padding: 0px!important;
margin: 0px!important;
border: 0px!important;
}

.ContextualPopup .Userpic img {
padding:5px;
background: #e5e5e5;
border: 0px;
}

/*----ADD MORE EDITS BELOW THIS IF YOU LIKE----*/

6. And just so people can find and use this layout too, credit

tofuhouse somewhere on your journal or profile page!
--- Helpful code to copy and paste: <a href="http://tofuhouse.dreamwidth.org/4138.html">layout</a> @ <user name="tofuhouse">

OPTIONAL STUFF This is super customisable again, though you don't have to do much to get what you want.

COLOUR: The colours are basically grey: they're chosen according to sources that recommend colours for reading on a screen. Aside from one red colour for links (red to keep it warm). That single red colour is #790000

CUSTOM ICON PAGE: Check it out, it's pretty cool. I even put in more than one icon now cos it looked so lonely before. How do you get this thing working? Go to Settings: Display, and make sure you check the box "Show my journal's icons pages in my chosen style instead of the site layout".

While you're there...

CUSTOM COMMENT PAGE: I coded it to work, and in fact this time it might be better to stick with the custom layout, but sometimes it's still easier to turn it off and use dreamwidth's default look. The comment system and nesting is much more cleaner on the default site skin, that's why, even though I really tried refining the comments in this layout so that you can use it for writing for as much as possible (and it should be fine!) Anyway, if you do want to change it, go to Settings: Display, and make sure you uncheck the box "Show my journal's entry pages in my chosen style instead of the site skin".

And that's pretty much it! Have fun with my further masochistic attempts at productivity (⊙◞౪◟⊙)