Page 1 of 2

Where is the <ul> in toc() defined?

Posted: Wed Nov 14, 2018 11:35 am
by Tata
I want to try writing an online e-book based on CMSimple_XH. It would be very practical if the navigation items would be numbered as in a classic book. E.g.:
  1. Introduction
    1. Chapter 1
      1. Chapter 1.1
        1. Article 1.1.1
        2. Article 1.1.2
        3. Article 1.1.3
      2. Chapter 1.2
      3. Chapter 1.3
    2. Chapter 2
    3. Chapter 3
This would require the toc() function generate as an <OL> instead <UL>, howerver. Where is the <UL> defined? It would then be nice to have the option of toc generated as UL or OL in the configuration.
I tried to play with the li.php. But nothing was found.

Re: Where is the <ul> in toc() defined?

Posted: Wed Nov 14, 2018 12:12 pm
by frase

Re: Where is the <ul> in toc() defined?

Posted: Wed Nov 14, 2018 1:05 pm
by Tata
Genau!

Code: Select all

/*navigation */
.navigation ul { counter-reset: item }
.navigation > ul li { display: block }
.navigation li:before { content: counters(item, ".") " "; counter-increment: item }
Nichts is nötig am core zu ändern.
Danke.

Re: Where is the <ul> in toc() defined?

Posted: Wed Nov 14, 2018 1:12 pm
by cmb
Tata wrote:
Wed Nov 14, 2018 11:35 am
This would require the toc() function generate as an <OL> instead <UL>, howerver. Where is the <UL> defined? It would then be nice to have the option of toc generated as UL or OL in the configuration.
I tried to play with the li.php. But nothing was found.
Search for “<ul” and “</ul” in this file. For the main menu only renderULStartTags and renderEndTags would have to be modified (or overridden).
frase wrote:
Wed Nov 14, 2018 12:12 pm
Maybe CSS-counter() helps here.
Elegant, but only functional if CSS is available.

Re: Where is the <ul> in toc() defined?

Posted: Wed Nov 14, 2018 1:32 pm
by Tata
Klar.
DEMO
Da habe ich im stylesheet.css nichts anders als:

Code: Select all

/*navigation */
.navigation ul { counter-reset: item }
.navigation > ul li { display: block }
.navigation li:before { content: counters(item, ".") " "; counter-increment: item }

Re: Where is the <ul> in toc() defined?

Posted: Wed Nov 14, 2018 2:52 pm
by cmb
Tata wrote:
Wed Nov 14, 2018 1:32 pm
DEMO
screenshot.png
:)

Re: Where is the <ul> in toc() defined?

Posted: Wed Nov 14, 2018 3:15 pm
by Tata
Anything wrong? It seems to work as I have expected. Isn't it?

Re: Where is the <ul> in toc() defined?

Posted: Wed Nov 14, 2018 3:54 pm
by frase
cmb wrote:
Wed Nov 14, 2018 1:12 pm
... but only functional if CSS is available.
Mein lieber Christoph!
Das ist ganz schön gemein, was du da mit Tata machst! ;-)
Ohne CSS können wir CMS_XH komplett zumachen.

(Ich überlege sowieso, das Internet zu kaufen und es dann zu schließen.)

Re: Where is the <ul> in toc() defined?

Posted: Wed Nov 14, 2018 5:07 pm
by cmb
Tata wrote:
Wed Nov 14, 2018 3:15 pm
Anything wrong? It seems to work as I have expected. Isn't it?
It works fine in my Chrome, and likely for almost all other users. :)
frase wrote:
Wed Nov 14, 2018 3:54 pm
Das ist ganz schön gemein, was du da mit Tata machst! ;-)
Ohne CSS können wir CMS_XH komplett zumachen.
Das sehe ich nicht so (abgesehen vom Backend). Ist ja auch nicht so, dass ich davon ausgehe, dass noch eine nennenswerte Anzahl von Usern mit Textbrowsern unterwegs sind, aber sich eine Website mit einem solchen Browser hin und wieder mal anzuschauen, halte ich durchaus für sinnvoll. Denn was niemand garantieren kann, ist dass das gewünschte CSS auch beim Nutzer unverändert wirkt (z.B. wegen mancher Addons). Und inwieweit Screenreader CSS berücksichtigen, weiß ich nicht, und ich denke, ich brauche es auch nicht zu wissen, denn wenn eine Website mit einem Textbrowser nutzbar ist, dann wohl auch mit einem Screenreader. Zusätzlicher Bonus des Textbrowsers (zumindest von Lynx) ist, dass auch ein paar relevante Head-Links angezeigt werden, auf die man sonst eher nicht achtet.

Hier mal der Anfang von https://cmsimple-xh.org:
lynx-cmsimple-xh.org.png
Macht alles in allem einen ganz ordentlichen Eindruck, aber zwei Dinge fallen auf: das „Deutsch Deutsch“ und das „BUTTON“. Ersteres kommt daher, dass die Flagge in der Sprachauswahl ein <img alt="Deutsch"> ist und nebendran gleich nochmal „Deutsch“ steht. Da hier die Flagge also offensichtlich nur „Zierrat“ ist, könnte man sie eigentlich dem CSS überlassen. Das „BUTTON” kommt durch die Verwendung von FA, und da der <button> ein aria-label=Search hat, ist das wohl auch okay.

Re: Where is the <ul> in toc() defined?

Posted: Wed Nov 14, 2018 5:09 pm
by olape
cmb wrote:
Wed Nov 14, 2018 2:52 pm
Tata wrote:
Wed Nov 14, 2018 1:32 pm
DEMO
screenshot.png
:)
Der ist gut. :mrgreen:

Aber mal ernsthaft, ich denke, es geht hier auch mehr um Screenreader, die das höchstwahrscheinlich ähnlich sehen.