dreamscapes | Five AM / Tabula Rasa

Entry tags:

Five AM / Tabula Rasa

Theme name/layout: Five AM / Tabula Rasa
Author:

winterfish
Layout info: CSS layout

/* Five AM */
/* A Dreamwidth Tabula Rasa Layout */
/* Variable width; one column, two column-left, two colum-right page setups */
/* by w i n t e r f i s h */

* {margin: 0; padding: 0;}

body {
	margin: 0;
    padding: 0;
    color: #444;
	font-family: arial, verdana, helvetica, sans-serif;
	font-size: 0.625em;
    background: #fff;
}

h1, h2, h3, h4, h5, h6 {margin: 0; font-weight: normal; font-family: calibri, arial, helvetica, sans-serif; color: #464646;}

img {border: none;}

hr {display: none;}

p {margin: 1em 0;}

blockquote {
	margin: 1em 0;
	padding: 2em 1em 2em 6.5em !important;
        line-height: 1.4em;
        border-top: 4px solid #252525 !important;
        border-bottom: 4px solid #252525 !important;
        background: url(http://pics.livejournal.com/winterfish/pic/00109cgq) top left no-repeat #ffffff;
}

input, textarea, select {
	color: #555;
    background: #fff;
	border: 1px solid #aaa;
}

pre {
	font-size: 1.4em;
}

#qrform {
	margin-top: 1em !important;
}

/* ----- LINKS ----- */

a, a:link, a:active, a:visited {
	font-weight: normal;
	text-decoration: none;
	color: #cc3333;
}

a:hover {color: #93c9d2;}

.module  a, .module h2 a, .module  h2 {color: #252525;}
.module a:hover, .module h2 a:hover {color: #93c9d2;}

.module-calendar td a, .module-powered a, .manage-tags-link a, .manage-link a {color: #cc3333;}
.module-calendar td a:hover, .module-powered a:hover, .manage-tags-link a:hover{color: #93c9d2;}

.entry-title  a, .datetime a {color: #252525;}
.entry-title  a:hover, .datetime a:hover {color: #93c9d2;}

.entry-content a, .comment-content a {color: #cc3333;}
.entry-content a:visited, .comment-content a:visited {color: #63a0b7;}
.entry-content a:hover, .comment-content a:hover {color: #93c9d2;}

.entry-content .ljuser a, .comment-content .ljuser a {color: #004767; font-size: 0.9em;}
.entry-content .ljuser a:hover, .comment-content .ljuser a:hover {color: #93c9d2;}

.entry-poster .ljuser a, .comment-poster .ljuser a, .module-pagesummary .ljuser a {color: #004767;}
.entry-poster a:hover, .comment-poster .ljuser a:hover, .module-pagesummary .ljuser a:hover {color: #93c9d2;}

.entry-interaction-links li a, .entry-management-links li a {color: #404040;}
.entry-interaction-links li a:hover, .entry-management-links li a:hover {color: #929292;}

.comment .comment-title a {color: #004767;}
.comment .comment-title a:hover {color: #93c9d2;}

.comment-interaction-links a, .comment-management-links a {color: #252525;}
.comment-interaction-links a:hover, .comment-management-links a:hover {color: #93c9d2;}

/* ----- PAGE SETUP ----- */

.one-column #content { float: none; }
.two-columns-left #content {
    border-left: 20em solid transparent;
}

.two-columns-right #content {
    border-right: 20em solid transparent;
}

#primary {
    float: left;
    width:100%;
    margin-right:-100%;
    margin-left: 0;
}

.one-column #primary { float: none; }

.one-column  #primary > .inner:first-child {
    padding: 1em;
}
.two-columns-left #primary > .inner:first-child {
    padding: 1em 1em 1em 3em; /* adjust space btwn sidebar and entries */
}

.two-columns-right #primary > .inner:first-child {
    padding: 1em 3em 1em 1em; /* adjust space btwn sidebar and entries */
}

.one-column #secondary { width: 20em; margin-top: -4em;}
.two-columns-left #secondary {
    float: left;
    width: 20em;
    margin-left: -20em;
	margin-top: -2.3em; /* ----- adjust height of sidebar left ----- */
}

.two-columns-right #secondary {
    float: right;
    width: 20em;
    margin-right: -20em;
	margin-top: -2.3em; /* ----- adjust height of sidebar left ----- */
}

#secondary > .inner:first-child {
	margin: 0 1em;
    padding: 1em 0;
}

#tertiary {
	padding-top: 0;
	padding-bottom: 3em;
}

.one-column #tertiary { width: 100%;}
.two-columns-left #tertiary, .two-columns-right #tertiary {
    clear: both;}
.two-columns-left #tertiary { margin-left: -20em; padding-top: 1em;}
.two-columns-right #tertiary { margin-right: -20em; padding-top: 1em;}

#tertiary > .inner:first-child {
	margin: 0;
    padding: 0 1em;
}

#content-footer {
    height: 0;
    font-size: 0; /*to make IE happy*/
    clear: both;
}

/* ----- CANVAS ----- */

#canvas {
	font-size: 1.2em;
}

#canvas > .inner:first-child {
	margin: 0 5% auto;
}

/* ----- HEADER & FOOTER ----- */

#header, #footer {
    margin: 0;
    clear: both;
	text-transform: lowercase;
}

#header {
    margin-top: 5em;
	text-align: left;
    background: #fff;
}

#header .inner {
    margin: 0 1em;
	padding: 1em 0 2em 0;
	border-top: 2px solid #252525;
	border-bottom: 2px solid #252525;
}

#footer {
	margin: 0 5%;
}

#footer .inner {
	margin: 0 .8em;
	padding: 2em 0;
	text-align: left;
	font-size: 1.2em;
	border-top: 2px solid #252525;
}

h1#title {
	margin-top: .5em;
	color: #404040; 
	font-size: 2.8em;
}

h1#title:first-letter {color:#cc3333}

h2#subtitle {
	margin-top: -.4em;
	color: #404040; 
	font-size: 1.7em;
}

h2#pagetitle {display: none;}

#footer a {  }
#footer a:active {  }
#footer a:hover {  }
#footer a:visited {  }

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

.module-navlinks ul {
	position: absolute;
	top: 0;
	padding: 2em 0 1em 0;
	text-align: left;
}

.two-columns-right .module-navlinks ul {
	left: 5%;
	padding-left: .5em;
}

.has-navstrip .module-navlinks ul {
	position: absolute;
	top: 50px;
}

.one-column .module-navlinks ul {margin-left: -10px;}
.two-columns-left .module-navlinks ul {margin-left: -10px;}
.two-columns-right .module-navlinks ul {margin-left: 0;}

.module-navlinks li {
	display:inline;
	padding: 0 .5em !important;
	font-family: calibri, arial, helvetica, sans-serif;
	font-size: 1.7em;
	text-transform: lowercase;
}

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

.module {
	margin-bottom: 2.5em;
	font-size: 0.9em;
	text-align: left;
	line-height: 1.1em;
}

.one-column #secondary  .module {
	padding-left: 0;
	padding-right: 0;
}

.two-columns-left #secondary .module {
	padding-left: 0;
	padding-right: 0;
}

.one-column #tertiary .module, .two-columns-left #tertiary .module, .two-columns-right #tertiary .module {
	margin: 0 2em 1em 0;
	padding-bottom: 2em;
	float: left;
	width: 20em;
	max-height: 280px;
	overflow: auto;
}

.module h2 {
	padding-top: .8em;
    font-family: calibri, arial, helvetica, sans-serif;
	font-size: 1.6em;
	font-weight: normal !important;
	text-transform: lowercase;
	border-top: 1px solid #252525;
}

.module-content {
	padding-top: .8em
}

.module-content ul {
	list-style-type: none;
	padding-left: 0;
}

.module-content li {
    padding: .3em 0;
}

/* --- User Info --- */

.module-userprofile .journal-name {display: none;}

.module-userprofile .userpic {
	padding: 0;
	width: 110px;
	height: 110px;
}

.module-userprofile .userpic img {
	padding: 5px;
	border: 1px solid #252525;
    background: #252525;
}

.module-userprofile .journal-website-name {
	padding-top: 0.8em;
}

ul.userlite-interaction-links {
	list-style: none;
	padding-top: 1em;
}
ul.userlite-interaction-links li { 
	display: block;
}

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

.module-calendar .module-content {
	padding-top: 1em;
}

.module-calendar table {
	text-align: center;
	width: 100%;
}

.module-calendar th, .module-calendar td {
	height: 2em;
	line-height: 2em;
	border: 1px solid #ccc;
}

.module-calendar td a {
	display: block;
	text-align: center;
	background: #e9e9e9;
}

.module-calendar td a:hover {
	background: #fff;
}

/* --- Page Summary --- */

.module-pagesummary .module-content a img {
	display: none;
}

/* multi-level tags list */

.module-tags_multilevel li {
	list-style-type: none;
    margin-left: 0;
	padding-left: 0;
}

.module-tags_multilevel li ul li {
	margin-left: -0.5em;
	padding-left: 2em;
}

/* tags cloud */

.module-tags_cloud .module-list, .module-tags_cloud .module-list ul, .module-tags_cloud .module-list-item {
	list-style-type: none;
	list-style-image: none;
	display:inline;
}

.module-tags_cloud .module-list {
	line-height: 1.8em;
}

.module-tags_cloud .module-list a {
	text-decoration: underline;
}

.manage-tags-link, .manage-link {
	padding-top: .8em;
	font-family: calibri, arial, helvetica, sans-serif;
	font-size: 1.2em;
	text-transform: lowercase;
}

/* powered by, page generated */

.module-powered, .module-time { 
	padding-top: .8em;
    border-top: 1px solid #252525;
}

.module-time {font-size: .9em;}

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

.navigation {
	margin-top: -1.5em;
    padding: 0;
	font-family: calibri, arial, helvetica, sans-serif;
	font-size: 1.3em;
	text-transform: lowercase;
	text-align: right;
}

.navigation ul { 
	list-style: none;
}
.navigation li { 
	display: inline;
	padding: 0 .5em; 
}

.page-day .navigation .page-forward:before {
        content: "|  ";
}

.page-day .navigation .page-forward a {
        padding-left: .6em;
}

.topnav {
        min-height: 1.2em;
}

.bottomnav {
    padding-top: 0;
}

.page-archive .bottomnav, .page-month .bottomnav {
        border-top: 0;
        padding-top: 0;
}

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

#content {
	margin: 0;
    padding: 2em 0 0 0;
	background: #fff;
}

/* line up top of entry with sidebar */
.page-entry .entry-wrapper, .page-tags .tags-container {margin-top: .7em;}

/* ----- ENTRIES ----- */

.entry-content ul, .entry-content ol, .comment-content ul, .comment-content ol {
	margin: 1em 1em 1em 3em;
}

.entry-wrapper {
	margin: 1em 0 4em 0; 
	font-size: 1em;
}

.entry .header {
	padding: 1em 0 0em 0;
	border-top: 1px solid #252525;
}

.entry .entry-title {
    display: inline;
	margin: 0;
	padding: 0;
	font-family: calibri, arial, helvetica, sans-serif;
    font-weight: normal;
	font-size: 1.5em;
}

.entry .access-filter img, .entry .restrictions img {
	display: inline;
	padding-left: .5em;
}

.entry .datetime {
    float: right;
	display: inline-block;
	margin-top: .2em; /* ---height hack ----- */
    font-family: calibri, arial, helvetica, sans-serif;
	font-size: 1.25em;
	text-transform: none;
    color: #464646;
}

.entry .date:after {content: " | ";}

.entry .contents {
	margin-top: .5em;
	padding: 0;
	line-height: 1.45em;
}

.has-userpic .entry .contents {
	min-height: 140px;
	margin-right: 120px;
	padding-right: 2em;
}

/* ------- entry userpics ------- */

.entry .userpic {
	float: right;
	clear: right;
	margin-right: -140px;
margin-top: 1em;
	text-align: center;
	width: 110px;
}

.contents .userpic img {
	padding: 5px;
	border: 1px solid #404040;
	background: #404040;
}

.entry .poster {
    padding-bottom: 2em;
	font-size: 1em;
    color: #004767;
    display: block;
}

.entry-content {
	margin-top: -1em;
	padding: 0 0 2em 0;
}

.entry-content, .comment-content {font-size: 1.1em;}

/* ----- METADATA ----- */

.metadata {
	padding: 0 0 1em 0;
	font-size: 0.9em;
	line-height: 1.2em;
}

.metadata-label {
	font-weight: normal;
	font-size: 0.9em;
	text-transform: uppercase;
}

.metadata ul {
	list-style: none;
}

.metadata ul li {margin: 0; padding: 0;}

.metadata-item-xpost a {padding-right: .5em;}

.entry .footer {
	clear: left;
}

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

.tag {
	padding: 0 0 .7em 0;
	font-family: calibri, arial, helvetica, sans-serif;
	font-size: 1.1em;
    line-height: 1.2em;
	text-transform: lowercase;
	border-top: 0px solid #252525;
}

.tag-text {
	font-size: 1em;
	font-weight: normal;
	text-transform: uppercase;
}

.tag ul { 
	display: inline;
	list-style: none;
	padding-left: 0; 
}
.tag ul li {
	display: inline;
	padding: .25em; 
}

/* ------ entry links bar ----- */

.entry-management-links {
	float: left;
	list-style: none;
	padding: 1em 0 1em .5em;
}

.entry-interaction-links {
	list-style: none;
	text-align: right;
	padding: 1em .5em 1em 0;
    background: #e9e9e9;
}

.entry-interaction-links li, .entry-management-links li { 
	display: inline;
	padding: .5em !important;
	font-family: calibri, arial, helvetica, sans-serif;
    font-size: 1.2em;
	text-transform: lowercase;
}

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

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

#comments {
	margin-top: -2em;
	padding-top: 1em;
	background: #fff;
}

.comment-wrapper {
	margin: .5em 0 0 0;
	padding: .5em 0;
	font-size: 1em;
	border-top: 1px solid #252525;
}

.partial {        
        padding: .3em 0 !important;
		font-size: 1em;
}

.partial .comment {
    display: inline !important;
	padding: 1em 0;
	font-size: 1em;
}
.partial .comment-title {
	display: inline !important;
	font-size: 1.2em !important;
}

.comment-title h4 {
	display: inline !important;
    padding-right: 0.5em;
}

.comment {}

.comment .comment-title {
    padding: 0;
	font-family: calibri, arial, helvetica, sans-serif;
    font-size: 1.3em;
	font-weight: normal;
}

.comment .header .datetime {
	padding: 0 0 .5em 0;
	font-size: 0.9em;
	text-transform: uppercase;
}

.comment .contents {
	clear: both;
	text-align: left;
	line-height: 1.45em;
	padding: .5em 0;
}

.comment .userpic {
	margin-right: 1em;
    padding-right: 0.5em;
	float: left;
	text-align: center;
	width: 110px;
	background: #fff;
}

.comment .poster {
	margin: 0;
	font-size: 1em !important;
}

.comment-poster .anonymous {
	color: #cc3333 !important;
	font-weight: bold;
}

.comment .poster-ip {
	font-size: 1em;
	color: #cc3333;
}

.comment-content {padding: .8em 0 .5em 0;}

/* ------ comment links bar ----- */

.comment .footer {
        clear: left;
        padding: .5em .5em 0 .5em;
}

.comment .multiform-checkbox {
	float: right;
	margin-top: -1px; /* line up the checkbox */
	padding-left: .5em;
	font-family: calibri, arial, helvetica, sans-serif;
    font-size: 1.2em;
	text-transform: lowercase;
}

.comment-interaction-links {
	list-style: none;
	padding-bottom: 1em;
	font-size: 0.9em;
	text-align: right;
}

.comment-interaction-links li, .comment-management-links li {
	display: inline;
	padding: 0 .5em;
	font-family: calibri, arial, helvetica, sans-serif;
    font-size: 1.2em;
	text-transform: lowercase;
	border-right: 1px solid #ccc;
}

.comment-management-links {
	list-style: none;
	font-size: 0.9em;
	float: right;
}

.comment-management-links li:first-child {
	border-left: 0;
}

.edittime {
     padding-top: 1em;
     color: #cc3333;
}

.bottomcomment {
	margin: 0;
	padding: 2.2em 0 .5em 0;
    text-align: center;
}

.bottomcomment .entry-interaction-links{
    margin-bottom: 1.5em;
}

textarea#commenttext { 
	width: 100%; /* fix for FF form width glitch */
}

/* --- DAY PAGE --- */

#archive-day .day {
	margin: 1em 0 0 0;
	border-top: 1px solid #252525;
}

h3.day-date {
    margin-left: 0;
    padding-top: 1em;
	font-size: 1.4em;
	font-family: calibri, arial, helvetica, sans-serif;
}

/* ----- VIEW BY MONTH PAGE ----- */

#archive-month .topnav {display: none;}

#archive-month .month {
	margin-top: .7em;
	padding: 1em 2em 0 2em;
	border-top: 1px solid #252525;
}

.month h3.entry-title {
        font-family: calibri, arial, helvetica, sans-serif;
		font-size: 1.3em;
}

dd.month { display: inline; }

.month .datetime, .month .access-filter, .month .entry-title {
	display: inline;
	margin: 0;
	padding-right: 5px;
}

.month .tag {
    padding-top: 0;
	padding-left: 0;
	border-top: none;
}

#archive-month .navigation {
	text-align: center;
}

#archive-month .bottomnav {
       margin-top: .5em;
}

.navigation .month-back, .navigation .month-forward {
	display: inline;
	list-style-type: none;
	text-align: center;
}

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

#archive-year {
	padding: 0 4em 2em 4em; 
	background: #ffffff;
}

#archive-year .navigation {
	text-align: center;
}

.page-archive .bottomnav {padding-top: 1em;}

.month-wrapper {
	margin: 1.5em 0;
}

.month-wrapper .header {
    padding: 0 0 .5em 2em;	
	font-size: 1.2em;
}

.month-wrapper .contents caption {display: none;}

table.month {
	margin: 0 auto;
	width: 90%;
	text-align: center;
}

.month-wrapper th {
	padding: 0.5em;
	border-right: 1px solid #aaa;
	border-top: 1px solid #aaa;
	border-bottom: 1px solid #aaa;
    font-weight: normal;
	height: 4em;
}

.month-wrapper td {	
	border-right: 1px solid #aaa;
	border-bottom: 1px solid #aaa;
	width: 4em;
	height: 4em;
}

.month-wrapper td:first-child, .month-wrapper th:first-child {	
	border-left: 1px solid #aaa;
}

.month-wrapper .day-has-entries {
	background-color: #e9e9e9;
}

.month-wrapper .day-has-entries a {
        font-size: 1.3em;
}

.month-wrapper .day-has-entries:hover {
	background-color: #fff;
}

.month-wrapper .label {font-weight: normal;}

.month-wrapper .footer {
    padding-top: 1em;
    padding-right: 2.5em;
	text-align: right;
	font-size: 1.1em;
	text-transform: none;
}

/* ------- TAG PAGE ------- */

.tags-container {
	margin-top: .7em !important; /* --- height hack --- */
	padding: 0 1em;
	border-top: 1px solid #252525;
}

.tags-container h2 {
	padding: .5em 0 1em 0;
	font-family: calibri, arial, helvetica, sans-serif;
}

.tags-container .ljtaglist {
	margin-left: 3em;
	line-height: 1.8em;
}

.tags-container ul.ljtaglist {
	list-style-type: none;
}

.tags-container .manage-tags-link {
	margin-bottom: 1em;
}

.page-tags .tags_cloud ul, .page-tags .tags_cloud li {
	list-style-type: none;
	list-style-image: none;
	display:inline;
}

/* ----------------- NAVBAR ----------------- */

#lj_controlstrip {
       background: #000000;
       border-bottom: 1px solid #878080;
}

#lj_controlstrip td {
    color: #989898;
}

#lj_controlstrip a {
       color: #f1f1f1;
}

#lj_controlstrip_statustext, #lj_controlstrip .ljuser a {
       color: #cc3333;
}

#lj_controlstrip_user,
#lj_controlstrip_login,
#lj_controlstrip_loggedout_userpic,
#lj_controlstrip_actionlinks
{
    border-right: 1px solid #878080;
}

/*--- paste any additional css overrides below this line ---*/

Layout preview: At my test journal: http://robotfish.dreamwidth.org/?s2id=138594
Image info: One image made by me. http://pics.livejournal.com/winterfish/pic/00109cgq
Additional info (for layouts): Works with one column, and two column left/right page setups only. Navigation needs to be set as 1 in Group One for the layout to display properly.

First time submitting, my CLA was sent earlier this evening. This is the layout I'd previously posted at

dreamwidthlayouts. I was unsure of how to tag this, so I just put conversion as I'm hoping an s2 styles person is willing to take this on. I hope I'm doing it right! Let me know if anything needs changing.

Flat | Top-Level Comments Only

Claiming, claiming, claiming! :P

I'll probably have more questions later but for now just two:
-- can you think of a name for this lovely white theme?
-- would you object to displaying the page title again? It can be useful to some users but it's your design and if you think it looks better without it, fine.

Woohoo! That's awesome, thank you so much! I'm so glad you're taking this on. S2 styles people are a little like the Wizard of Oz to me. Stuff happens behind the curtain and then voila! there's a layout. :P To answer your questions:

1. I am really bad at coming up with names, so any suggestions are very much appreciated.
2. Sure, that's no problem. I played around with adding pagetitle and came up with this:

h2#pagetitle {
	padding-top: .3em;
	font-size: 2em;
}

h2#pagetitle:first-letter {color:#cc3333}

Please ask away with any other questions you have, I'll help all I can. And thanks once again for your help with this! :)

(Also, just to let you know, I'll be away Friday-Sunday, so I may not be able to respond until after the weekend.)

How about Early Edition? This reminds me of the news-y type blogs out there.
Different colored versions can be called late edition, afternoon edition, or whatever.

Just having brain bubbles here.

Oooh yes, that's perfect! Early Edition, let's go with that. :D

Thanks and no worries. I'll be away all of next week and it's going to take me a while to reach the point where I have more questions. :)

If you'd like to see what I've got so far, here's the layout layer, the theme layer and the style preview. I removed all font sizes for now as official styles must have their base font size set to 1em and these will all have to be adjusted accordingly. I've mostly focused on removing hard-coded colors and duplicate code, and haven't looked beyond the Recent/Reading pages yet. It's still very much a WIP.

Very cool! It looks really great, even as a WIP. :)

Hey there! I was browsing back through the comm, and noticed that this is tagged as "needs CLA" so I thought I should mention that Denise did receive my CLA via email after I'd submitted the layout.

(Er, is there someone else I should contact about this? I wasn't sure if you were the right person, but thought you could point me in the right direction if need be.)

Hi Winterfish, the tag is there because I'll need confirmation from Denise that she received it so it's more of a reminder for me to ask her about it. :)

BTW sorry for the radio silence but RL's keeping me very busy so I haven't had time to make any progress on this since I'm back to work.

Cool! :) Good to know, I wasn't sure if I needed to send it again. And no worries about the radio silence! RL is what is it is.

So CLA received and tag removed. :)

I think I have time to work on this again so here's question-time:

1) The most problematic issue is the navigation strip. Because the colors you've chosen don't match those of your style theme, I can't make an automatic scheme for it. That leaves us with two solutions: you can alter the nav strip colors to use those from the style so that any future theme will have a matching nav strip or I can set the nav strip colors as a one-time thing and let other future themes use the default strip.

2) As I said before, I removed most (all?) font sizes because I needed a 1em base. Are you ok with the current sizes or do you want to make some changes?

3) In order to decrease the number of color options this theme will have in addition to the basic options, I've changed some colors (when they were close shades of gray, I've only used one color for instance). Can you tell me what's acceptable for you and what isn't? I don't want to make any changes you wouldn't be ok with.

Awesome! It's looking great. To answer your questions:

1) I'm kind of drawing a blank on colours, so setting the nav strip as a one time option sounds good.

2) Font sizes: there are a few things that stand out. (I hope it's okay to use relative terms to explain what I mean, ie. bigger or smaller to what it is now. Let me know if anything doesn't make sense, I'll try to explain better.)

a) the navlinks (recent, archive, etc.) should be a couple font sizes bigger than they are now.

b) Header: subtitle should be a couple sizes smaller for a more exaggerated size difference from the title. (Title, and Pagetitle look good, though.)

c) entry title and date look good, but if it's okay can the entry text and metadata be a size or two smaller. Or alternately, the entry title and date could be a size bigger if you think readability is a concern with a smaller entry text size. (Just, I think the title needs to stand out a bit more from the entry text.)

d) The sidebar got enormous! :p Could you to change it to 17em. The proportions will look better. And the text: set the module titles to the same size as the entry subject title, and the module links/text a size or two smaller than the entry text. Again, if readability is an issue, module links/text could be set to the same size as the entry text. I don't think that would change the look too much.

3) Sure, that sounds fine. It's in keeping with the minimal look of the layout. :)

I hope this makes sense. Let me know if anything needs a better explanation, or you have more questions. :)

Thanks for you detailed answers! It was very clear. Could you have a look again and tell me if it's better or some things are still too big/too small?

Wow, you're fast! :D I think the only tweaks are: bump up the header subtitle a size, and bring the entry date down a size so it's less dominant. Otherwise, everything looks great! (You've even got icon set to the left working. :D)

Thanks for all your work on this!

I've tweaked the font sizes as requested. Does it look better?

My pleasure, really. I've even realized some stuff while fiddling with sidebar margins and paddings, which I'll have to correct in other layouts.

Oh I wanted to ask you something. I get a weird bug with the title's first letter. Sometimes it isn't red as it should be until I refresh the page. I don't think I get this with your preview but I've used the same code so I'm a bit clueless. Have you ever got this bug too with your code? And do you get this with mine?

Edit: didn't seem to get it on my Dreamhack so I wonder what's causing it.

Also, the style is now live on my Dreamhack. If you want to test it, you can create an account over there. No invite's needed.

Edit2: before I forget; any thoughts about styling the icons page (http://ninetydegrees.dreamwidth.org/icons?s2id=346091)?

Edited 2011-06-05 13:50 (UTC)

Looks great! One last tweak, could you bring the entry date down one more size. It still looks a little too big next to the subject title to me.

One other thing I noticed, what's the font-family for #title, #subtitle and #pagetitle? It should be calibri, arial, etc.

I did get that bug once or twice with the first letter not changing to red (while browsing with ?style=mine). I could never figure out what was causing it, though. Your layer, and your dreamhack are both displaying properly for me. So puzzling! (I'm using Firefox 3.6 with Windows 7 on pc.)

Cool! Thanks, I'll give that a try.

Thoughts: maybe move the text beside the icon rather than underneath it. Less scrolling, and it would use up the width of the page more. My other thought is, YAAAAY! \o/ I am so very excited for this feature to go live. :)

Done, done and done! :) Let me see if you think of anything else.

Hmm. So it may be when there's a ? in the URL... Weird.

Yay! It all looks great. Last tweaks: increase the header subtitle another font size, and on the archive-month page, the entry titles look like they need to be bumped up a couple sizes. I think that's it! :)

The icon page looks fantastic!

OK now?

Looks perfect! Thanks again for all you work. :)

You're welcome and thank you. It's a great style and you made it super easy to patch. :)

Very nice layout! :D

Yay, one of your layouts!!
LOVELY!

WOO! :D

Hi again winterfish!

I'm very happy to tell you that your style has just been committed and will go live during the next code push. Congrats on becoming a Dreamwidth contributor!

Yay! Great news to hear on a Monday. Thank you so much. :D

Flat | Top-Level Comments Only

Five AM / Tabula Rasa

Yay!

Re: Yay!

Re: Yay!

Re: Yay!

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject