On 12/6/25 9:08 AM, Patrice Dumas wrote:
On Wed, Dec 03, 2025 at 08:23:43PM +0000, Gavin Smith wrote:
On Tue, Dec 02, 2025 at 01:19:11PM +0100, Patrice Dumas wrote:
I think that we should keep a "true" space here for text browsers
instead of padding-right.
Even in graphical browsers, it should look basically okay when all CSS rules
are disabled.
In my small amount of testing with the CSS rules posted by Per and
Raymond, a literal space in the HTML source would display as a space
in the flexbox element when all the CSS rules were removed. Otherwise,
the CSS rules would predominate. So it looks like it will work.
As far as I can tell all the needed classes are now there.
Thanks for implementing this!
I'm trying to get CSS updated to match what I had earlier. Needs some
tweaking on my part, but I do have a couple of observations.
First, the comma after the link is not inside any span, so when I set up
CSS to use a flex-box and the nav-buttons are wrapped to columns, the
comma is on a line by itself.
Second, after the Up button, there's a nav-button consisting of
whitespace before the [Content] button. This shows up as an extra line
when wrapped, so there's too much whitespace.
These issues could most probably be due to me not implementing CSS
correctly with the new scheme.
Anyway, here's an image of what I see:
The current CSS I'm using to get this. Could be catastrophically wrong.
|.nav-panel { background-color: var(--nav-panel-background-color);
padding: 3px 10px; display: flex; flex-direction: column; align-items:
center; width: 100%; max-width: 100%; flex-wrap: wrap; } .nav-button {
display: flex; /* Makes the key and value sit side-by-side */
/*min-width: 200px;*/ /* Ensures minimum space for readability */
flex-grow: 0; /* Prevents entries from expanding to fill extra space */
flex-basis: auto; /* Allows width to be set by content */
background-color: #f3f4f6; padding: 0.5rem; } .nav-label { font-weight:
600; color: #1f2937; flex-shrink: 0; /* Prevents the key/label from
shrinking */ margin-right: 0.25rem; /* Minimal space between KEY and
VALUE */ } .nav-link { flex: 1; /* Allows the value to take up all
remaining space in the entry */ color: #4b5563; word-wrap: break-word;
/* Ensures long content wraps */ overflow-wrap: break-word; } |
Gavin, it is not clear to me what the defaut CSS should be, could you
please set it?
​
