Fossil Forum

Ardoise tweaks
Login

Ardoise tweaks

Ardoise tweaks

(1) By andygoth on 2020-08-20 12:43:49 [source]

My Ardoise tweaks branch makes a few updates to the CSS of the Ardoise skin. I invite community feedback before integrating to trunk. Here's what I did:

  1. Made tables not be 100%-width, since this hampered readability of tables having few columns.

  2. Reduced the size of secondary headers to more clearly delineate between them.

  3. Got rid of the thick borders around code spans and blocks, also lightened their backgrounds, to make it less jarring when they are integrated with text.

  4. Got rid of the vertical lines appearing between table cells in the timeline, which also has the effect of making the corners rounded rather than square.

  5. Updated the colors of selected, secondary, and current timeline rows. It appears the defaults were being used, which clashed very badly with the "dark mode" colors.

  6. For consistency, removed some trailing semicolons and added spaces after some commas in the CSS.

I have one more thing that's not checked in anywhere but is waiting in the wings if someone wants it. For my own development, I introduced a new "toc" class defining the style of tables of contents useful for long documents. This might be a nice thing to have. In projects that need this feature, I currently have TOC implemented as a script that touches up the *.md files, which are then checked in. Nicer still might be if the TOC were generated by Fossil itself, but this opens the door to wanting customizable document postprocessor plugins. I don't feel we are where we need to be to securely support such a thing, so I'm satisfied for now with the approach I've taken. Sorry that I don't currently have this somewhere that you can review it, but I'll try to publish someday.

(2) By John Rouillard (rouilj) on 2020-08-20 17:03:48 in reply to 1 [link] [source]

A TOC could also be added using js. E.G.

https://www.cssscript.com/generating-a-table-of-contents-with-pure-javascript-toc/

and this could be added to the skin.

(3) By andygoth on 2020-08-20 17:43:11 in reply to 2 [link] [source]

I'll definitely consider it, though my TOC script not only puts one at the top of the file but also makes an external TOC indexing all participating documents. Thus my script would still have a place, even alongside a JavaScript TOC.

(4) By Stephan Beal (stephan) on 2020-08-20 18:16:52 in reply to 1 [link] [source]

i'm glad to see this skin get some love. It's been my default skin for the better part of a year. Please don't merge just yet - i'd like to go through it and pull in a couple of local overrides i use on it:

https://fossil.wanderinghorse.net/r/cwal/file?name=doc/css/skin-overrides.css&ci=tip

In particular, its size for textareas makes no sense (32px tall, iirc).

i'll try to get to that in the next 12 hours or so.

(5) By Stephan Beal (stephan) on 2020-08-20 21:02:01 in reply to 4 [link] [source]

Please don't merge just yet - i'd like to go through it and pull in a couple of local overrides i use on it:

Nevermind - it seems i already reset the 32px-tall textareas. One change i "would like" to see but didn't make for fear of breaking other peoples' uses/expectations of that skin is:

.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  box-sizing: border-box
}

Setting max-width of a page or its main content area is irksome, especially when expressed in pixels. i'd like to see that line removed, but will leave that to your discretion. My local overrides already do that:

.container {
    /* Main page content container, including top menu bar. */
    max-width: unset;
}

(6) By andygoth on 2020-08-20 23:38:46 in reply to 5 [link] [source]

Do you intend to remove width, margin, and box-sizing? What effect does removing those have?

I'm good with removing max-width but don't know what unset means.

(7) By Stephan Beal (stephan) on 2020-08-20 23:47:40 in reply to 6 [link] [source]

Do you intend to remove width, margin, and box-sizing? What effect does removing those have?

No, i'm okay with all that, or have it overwritten locally. i don't really want to change anything which is "personal taste," but the previous 32px height for textareas made certain pages simply unusable (e.g. the skin editor, ironically enough).

I'm good with removing max-width but don't know what unset means.

The max-width on the body is admittedly a personal taste thing: i consider it downright pretentious of designers to limit how much space i can use on a given site. Or maybe i'm just getting too old and GET OFF MY LAWN!

unset, per Mozilla:

The unset CSS keyword resets a property to its inherited value if the property naturally inherits from its parent, and to its initial value if not. In other words, it behaves like the inherit keyword in the first case, when the property is an inherited property, and like the initial keyword in the second case, when the property is a non-inherited property.

https://developer.mozilla.org/en-US/docs/Web/CSS/unset

In this case, it simply replaces "max-width" width whatever max width the browser would otherwise have set for that element.

(8) By andygoth on 2020-08-21 02:34:12 in reply to 7 [link] [source]

Thanks for the responses. Anyway, I committed as per your request, and further feedback is welcome. I admit I haven't actually tried out your suggestions, only checked them in! Ah well, it's a branch.