Help us style our man pages

[Martin Geisler-4]

Hi everybody,

Please take a look at the HTML version of our man pages:

  http://cs.au.dk/~mg/tmp/hg.1.html
  http://cs.au.dk/~mg/tmp/hgrc.5.html
  http://cs.au.dk/~mg/tmp/hgignore.5.html

If you know CSS, then please help us by improving the design!

We will ship Mercurial 1.4 in a week, so it would be great if we could
update the style before that.

--
Martin Geisler

VIFF (Virtual Ideal Functionality Framework) brings easy and efficient
SMPC (Secure Multiparty Computation) to Python. See: http://viff.dk/.


_______________________________________________
Mercurial mailing list
Mercurial@...
http://selenic.com/mailman/listinfo/mercurial

[Daniel Serpell-4]

Hi!

El Sat, Nov 07, 2009 at 11:47:35PM +0100, Martin Geisler escribio:

> Hi everybody,
>
> Please take a look at the HTML version of our man pages:
>
>   http://cs.au.dk/~mg/tmp/hg.1.html
>   http://cs.au.dk/~mg/tmp/hgrc.5.html
>   http://cs.au.dk/~mg/tmp/hgignore.5.html
>
> If you know CSS, then please help us by improving the design!
>
> We will ship Mercurial 1.4 in a week, so it would be great if we could
> update the style before that.
>

I found them well designed, not sure what else do you want. The attached
patch adds:

 * A gray background on the preformated text boxes.
 * Gray background also to the contents box, using fixed position
   so that the contents are always visible when you scroll the
   page.
 * An horizontal line after the page title, to separate more
  from the content.


   Daniel.

---

--- style.css 2009-11-08 06:38:19.000000000 -0300
+++ hg-style.css 2009-11-08 13:35:46.000000000 -0300
@@ -15,10 +15,16 @@
 .document { position: relative; margin: 1.5em 1.8em; padding: 0; line-height: 1.3; }
 
 .document #contents {
-    position: absolute;
-    right: 0;
-    top: 0;
+    right: 0.5em;
+    top: 0.5em;
     width: 26%;
+    background: #f0f0f0;
+    border: 2px solid #d0d0d0;
+    position: fixed;
+}
+
+.document h1.title {
+ border-bottom: 2px dotted black;
 }
 
 .document h1.title, .document h2.subtitle, .document .section { width: 72%; }
@@ -59,3 +65,13 @@
 .document kbd, .document tt, .document pre {
     font-family: "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Lucida Console", "Courier New", monospace;
 }
+
+.literal-block {
+ background: #f0f0f0;
+ border: 2px solid #c0c0c0;
+}
+
+.contents .topic-title {
+ padding: 0.3em 0 0 0.3em;
+}
+

---

_______________________________________________
Mercurial mailing list
Mercurial@...
http://selenic.com/mailman/listinfo/mercurial

[Martin Geisler-4]

Daniel Serpell <dserpell@...> writes:

> Hi!
>
> El Sat, Nov 07, 2009 at 11:47:35PM +0100, Martin Geisler escribio:
>> Hi everybody,
>>
>> Please take a look at the HTML version of our man pages:
>>
>>   http://cs.au.dk/~mg/tmp/hg.1.html
>>   http://cs.au.dk/~mg/tmp/hgrc.5.html
>>   http://cs.au.dk/~mg/tmp/hgignore.5.html
>>
>> If you know CSS, then please help us by improving the design!
>>
>> We will ship Mercurial 1.4 in a week, so it would be great if we
>> could update the style before that.
>>
>
> I found them well designed, not sure what else do you want.

Me neither, I like the new version :-) You must have seen the updated
version: I updated it in-place after getting a new style from Yuya,
sorry. The original version is this:

  http://cs.au.dk/~mg/tmp/hg-old/doc/hgrc.5.html

and the current version is here:

  http://cs.au.dk/~mg/tmp/hg/doc/hgrc.5.html

> The attached patch adds:
>
>  * A gray background on the preformated text boxes.
>  * Gray background also to the contents box, using fixed position
>    so that the contents are always visible when you scroll the
>    page.

As you can see, the old design has lots of gray boxes and I even though
it was me who added them, I no longer like them very much :-) So I don't
think we should add them again.

>  * An horizontal line after the page title, to separate more
>    from the content.

I sort of like this, but perhaps we should make it solid and more
subtle? We don't have any other dashed 2px lines.

Thanks for jumping in with ideas for the design. I think it would be
best if people would put up new ideas as HTML pages we can look at
online -- post URLs to the list and then we'll discuss. We have a week
for playing with this.

--
Martin Geisler

VIFF (Virtual Ideal Functionality Framework) brings easy and efficient
SMPC (Secure Multiparty Computation) to Python. See: http://viff.dk/.


_______________________________________________
Mercurial mailing list
Mercurial@...
http://selenic.com/mailman/listinfo/mercurial

[Nicolas Dumazet]

2009/11/8 Martin Geisler <mg@...>:
>
> We will ship Mercurial 1.4 in a week, so it would be great if we could
> update the style before that.

I was thinking of coloring a bit the Note borders:
http://nicosondage.free.fr/hgrc/hgrc.5.html

Any color could do, really, but I think that for now borders do not
stand out enough.


diff --git a/style.css b/style.css
--- a/style.css
+++ b/style.css
@@ -48,8 +48,8 @@
 .document blockquote, .document pre { margin: 0.2em 0 1em 2em; }

 .document .note {
-    border-top: 1px #ccc solid;
-    border-bottom: 1px #ccc solid;
+    border-top: 1px #fcc200 solid;
+    border-bottom: 1px #fcc200 solid;
     padding: 0.3em 1em;
     margin: 0.2em 1em 1em;
 }



Nicolas Dumazet — NicDumZ

_______________________________________________
Mercurial mailing list
Mercurial@...
http://selenic.com/mailman/listinfo/mercurial

[Yuya Nishihara]

Hi,

Daniel Serpell wrote:
>  * Gray background also to the contents box, using fixed position
>    so that the contents are always visible when you scroll the
>    page.

Fixed position seems really nice, but one thing to consider:
if screen height is smaller than the toc content, we cannot see tail of it.

Do you know a good solution or workaround?

 Yuya
_______________________________________________
Mercurial mailing list
Mercurial@...
http://selenic.com/mailman/listinfo/mercurial

[Yuya Nishihara]

Hi,

Nicolas Dumazet wrote:
> I was thinking of coloring a bit the Note borders:
> http://nicosondage.free.fr/hgrc/hgrc.5.html
>
> Any color could do, really, but I think that for now borders do not
> stand out enough.

I agree that currrent "Note" block is not notable enough.
I designed style.css based on http://mercurial.selenic.com/guide/,
but unfortunately there's no example to copy for "Note". ;)

 Yuya
_______________________________________________
Mercurial mailing list
Mercurial@...
http://selenic.com/mailman/listinfo/mercurial

[Matt Mackall]

On Tue, 2009-11-10 at 00:25 +0900, Yuya Nishihara wrote:
> Hi,
>
> Daniel Serpell wrote:
> >  * Gray background also to the contents box, using fixed position
> >    so that the contents are always visible when you scroll the
> >    page.
>
> Fixed position seems really nice, but one thing to consider:
> if screen height is smaller than the toc content, we cannot see tail of it.

Also, it makes scrolling very CPU-intensive in Firefox.

--
http://selenic.com : development and support for Mercurial and Linux


_______________________________________________
Mercurial mailing list
Mercurial@...
http://selenic.com/mailman/listinfo/mercurial

[Stanimir Stamenkov-3]

Sat, 07 Nov 2009 23:47:35 +0100, /Martin Geisler/:

>    http://cs.au.dk/~mg/tmp/hg.1.html
>    http://cs.au.dk/~mg/tmp/hgrc.5.html
>    http://cs.au.dk/~mg/tmp/hgignore.5.html
>
> If you know CSS, then please help us by improving the design!

These suffer from the same issue as in:

http://bitbucket.org/segv/hg-website/issue/6/if-you-pick-one-color-pick-them-all

Not specifying main background-color makes the links very hard to
read in my browser, and the main content may just become invisible
in others (having a default black background-color).

--
Stanimir
_______________________________________________
Mercurial mailing list
Mercurial@...
http://selenic.com/mailman/listinfo/mercurial

[Yuya Nishihara]

# HG changeset patch
# User Yuya Nishihara <yuya@...>
# Date 1257857290 -32400
# Node ID d28887355d1436580708d3799d1b3329676de0df
# Parent  0d65e191ac4c2a3246fd12543819f3ccdd6a8a73
doc/style: use default font color specified by user

* it's bad to specify only foreground color:
  http://www.w3.org/QA/Tips/color
* some people prefer dark background
* `color: #111' is mostly the same as `color: black',
  which is the default of almost all popular browsers.

so it's preferable to delete `color: #111', rather than adding
`background-color: white'.

diff --git a/doc/style.css b/doc/style.css
--- a/doc/style.css
+++ b/doc/style.css
@@ -12,7 +12,6 @@ body {
     margin: 0;
     padding: 0;
     font-family: sans-serif;
-    color: #111;
 }
 
 .document {
@@ -72,7 +71,7 @@ a:link { color: #00b5f1; }
 a:visited { color: #5c9caf; }
 a:link.toc-backref, a:visited.toc-backref {
     text-decoration: none;
-    color: #111;  /* `inherit' is not supported by IE6 */
+    color: inherit;  /* NOTE: `inherit' is not supported by IE6 */
 }
 
 div.admonition, div.attention, div.caution,
_______________________________________________
Mercurial mailing list
Mercurial@...
http://selenic.com/mailman/listinfo/mercurial

[Hans Meine-4]

On Monday 09 November 2009 18:08:26 Matt Mackall wrote:

> On Tue, 2009-11-10 at 00:25 +0900, Yuya Nishihara wrote:
> > Hi,
> >
> > Daniel Serpell wrote:
> > >  * Gray background also to the contents box, using fixed position
> > >    so that the contents are always visible when you scroll the
> > >    page.
> >
> > Fixed position seems really nice, but one thing to consider:
> > if screen height is smaller than the toc content, we cannot see tail of
> > it.
>
> Also, it makes scrolling very CPU-intensive in Firefox.

Even more so in Konqueror, in particular in not-very-recent versions.  I hate
fixed boxes for that reason..

I like the current styling though, it's nice and clean.

Maybe add a small negative left-margin for the headings to stand out a little?

HTH,
  Hans
_______________________________________________
Mercurial mailing list
Mercurial@...
http://selenic.com/mailman/listinfo/mercurial

[Martin Geisler-4]

Yuya Nishihara <yuya@...> writes:

> # HG changeset patch
> # User Yuya Nishihara <yuya@...>
> # Date 1257857290 -32400
> # Node ID d28887355d1436580708d3799d1b3329676de0df
> # Parent  0d65e191ac4c2a3246fd12543819f3ccdd6a8a73
> doc/style: use default font color specified by user
>
> * it's bad to specify only foreground color:
>   http://www.w3.org/QA/Tips/color
> * some people prefer dark background
> * `color: #111' is mostly the same as `color: black',
>   which is the default of almost all popular browsers.
>
> so it's preferable to delete `color: #111', rather than adding
> `background-color: white'.

We would only have to add it to the body element, right?

> diff --git a/doc/style.css b/doc/style.css
> --- a/doc/style.css
> +++ b/doc/style.css
> @@ -12,7 +12,6 @@ body {
>      margin: 0;
>      padding: 0;
>      font-family: sans-serif;
> -    color: #111;
>  }
>  
>  .document {
> @@ -72,7 +71,7 @@ a:link { color: #00b5f1; }
>  a:visited { color: #5c9caf; }
>  a:link.toc-backref, a:visited.toc-backref {
>      text-decoration: none;
> -    color: #111;  /* `inherit' is not supported by IE6 */
> +    color: inherit;  /* NOTE: `inherit' is not supported by IE6 */
>  }

You've updated the comment, is that because IE6 is no longer important?

--
Martin Geisler

VIFF (Virtual Ideal Functionality Framework) brings easy and efficient
SMPC (Secure Multiparty Computation) to Python. See: http://viff.dk/.


_______________________________________________
Mercurial mailing list
Mercurial@...
http://selenic.com/mailman/listinfo/mercurial

[Martin Geisler-4]

Yuya Nishihara <yuya@...> writes:

> # HG changeset patch
> # User Yuya Nishihara <yuya@...>
> # Date 1257857290 -32400
> # Node ID d28887355d1436580708d3799d1b3329676de0df
> # Parent  0d65e191ac4c2a3246fd12543819f3ccdd6a8a73
> doc/style: use default font color specified by user

Pushed as 42ced358cbba, thanks for the explanations!

--
Martin Geisler

VIFF (Virtual Ideal Functionality Framework) brings easy and efficient
SMPC (Secure Multiparty Computation) to Python. See: http://viff.dk/.


_______________________________________________
Mercurial mailing list
Mercurial@...
http://selenic.com/mailman/listinfo/mercurial

[Martin Geisler-4]

Nicolas Dumazet <nicdumz@...> writes:

> 2009/11/8 Martin Geisler <mg@...>:
>>
>> We will ship Mercurial 1.4 in a week, so it would be great if we could
>> update the style before that.
>
> I was thinking of coloring a bit the Note borders:
> http://nicosondage.free.fr/hgrc/hgrc.5.html
>
> Any color could do, really, but I think that for now borders do not
> stand out enough.

Thanks, I like the orange. I've changed your "patch" a bit and pushed it
as 916cf1e7b39f.

--
Martin Geisler

VIFF (Virtual Ideal Functionality Framework) brings easy and efficient
SMPC (Secure Multiparty Computation) to Python. See: http://viff.dk/.


_______________________________________________
Mercurial mailing list
Mercurial@...
http://selenic.com/mailman/listinfo/mercurial