Mercurial > snowl
changeset 373:1fdea580d5b1
improve spacing with judicious use of margins; insert a colon between titles and excerpts; fix bug where 'body' URL parameter wasn't being applied on load
author | Myk Melez <myk@mozilla.org> |
---|---|
date | Fri, 07 Nov 2008 16:14:41 -0800 |
parents | 2a9341395f36 |
children | b61d30b9f36f |
files | content/river.css content/river.js |
diffstat | 2 files changed, 40 insertions(+), 22 deletions(-) [+] |
line wrap: on
line diff
--- a/content/river.css Fri Nov 07 15:16:10 2008 -0800 +++ b/content/river.css Fri Nov 07 16:14:41 2008 -0800 @@ -149,6 +149,7 @@ .message { /* Clear the float on the previous message's icon. */ clear: both; + margin-bottom: 1em; } /* The selector has to include #contentBox here so the rule takes precedence @@ -157,6 +158,7 @@ max-width: 100px; max-height: 100px; float: right; + margin-bottom: 1em; } .byline { @@ -167,16 +169,14 @@ .title { font-size: 100%; - margin-bottom: 0.5em; - margin-top: 0; + margin: 0; } -/* Suppress the top margin on the initial content element so we can control - * the amount of margin between the subject and the content with the rule - * above on the title element. */ -.body > *:first-child { - margin-top: 0; -} +/* Specify the margins above and below the message bodies. In order to control + * these more consistently, we remove margins on the content they contain. */ +.body > *:first-child { margin-top: 0; } +.body > *:last-child { margin-bottom: 0; } +.body { margin-top: 0.2em; margin-bottom: 0.2em; } /* Make the title and source links look less like links to differentiate * between the links in the content and these links that are in chrome. */ @@ -189,13 +189,21 @@ color: #555; } +.excerpt { + font-style: italic; +} + /* Show/hide elements based on whether we're displaying full content. */ -#contentBox .body { display: none; } -#contentBox .title { display: inline; } -#contentBox.body .body { display: block; } -#contentBox.body .title { display: block; } -#contentBox.body .excerpt { display: none; } -#contentBox.body .messageIcon { display: none; } +#contentBox .body { display: none; } +#contentBox .title { display: inline; } +#contentBox.showBody .body { display: block; } +#contentBox.showBody .title { display: block; } +#contentBox.showBody .excerpt { display: none; } +#contentBox.showBody .messageIcon { display: none; } + +/* Separate the title and excerpt with a colon when the body is hidden. */ +#contentBox .title:after { content: ": " } +#contentBox.showBody .title:after { content: none } /* Don't draw borders around hyperlinked favicons, but do pad them a bit * between the end of the favicon and the start of the source name. */
--- a/content/river.js Fri Nov 07 15:16:10 2008 -0800 +++ b/content/river.js Fri Nov 07 16:14:41 2008 -0800 @@ -309,8 +309,10 @@ if ("current" in this._params) this._currentButton.checked = true; - if ("body" in this._params) + if ("body" in this._params) { this._bodyButton.checked = true; + this._setBody(true); + } if ("filter" in this._params) document.getElementById("filterTextbox").value = this._params.filter; @@ -388,16 +390,24 @@ this.rebuildView(); }, - onCommandBodyButton: function(aEvent) { + onCommandBodyButton: function() { + this._setBody(this._bodyButton.checked); + this._updateURI(); + }, + + _setBody: function(showBody) { let contentBox = document.getElementById("contentBox"); - if (this._bodyButton.checked) { + if (showBody) { let classes = contentBox.className.split(/\s/); - classes.push("body"); + classes.push("showBody"); contentBox.className = classes.join(" "); } - else - contentBox.className = contentBox.className.split(/\s/).filter(function(v) v != "body").join(" "); - this._updateURI(); + else { + contentBox.className = contentBox.className. + split(/\s/). + filter(function(v) v != "showBody"). + join(" "); + } }, onCommandColumnsButton: function() { @@ -839,10 +849,10 @@ // FIXME: implement support for enclosures. messageBox.appendChild(messageIcon); - messageBox.appendChild(bylineBox); messageBox.appendChild(title); messageBox.appendChild(excerpt); messageBox.appendChild(body); + messageBox.appendChild(bylineBox); this._contentSandbox.messageBox = messageBox;