CMSimple_XH–Forum

Posted: **Sun Nov 05, 2017 4:15 pm**

Bei meiner täglichen 24h-Arbeit mit und für CMS_XH ist nebenbei etwas "abgefallen".
Es besteht hauptsächlich aus Inspirationen aus dem Netz - aber nichts vollständig "geklautes".
Es ging dabei um passende Farb-Kombinationen und Flexbox-Layout. (Ich hatte irgendwo gelesen, dass man kein vollständiges Layout mit Flexbox machen sollte - also probiert.)

sehr, sehr, sehr simpel
etwas "old style" aber flexibel
Layout mit Flexbox
Keine Skripte
reines CSS
FA_XH ist nicht erforderlich
möglicherweise nicht komplett ausgearbeitet
wahrscheinlich nur mit XH 1.7.x nutzbar (?)

Da es mir beim Betrachten gar nicht sooo schlecht gefiel, habe ich mir gedacht, dass es vielleicht jemand weiterverwerten oder nachnutzen möchte.

Zur freien Verfügung.
Macht damit, was ihr wollt ...
(Eine Demo ist wohl kaum nötig.)

Download

fhs-old-style-but-flexy.png

Posted: **Sun Nov 05, 2017 8:07 pm**

Sehr schön.
Bisher habe ich um Flexbox immer einen großen Bogen gemacht, weil der Browser-Support nicht gut war, scheint aber jetzt besser zu sein.

frase wrote:möglicherweise nicht komplett ausgearbeitet

Drei Anregungen / Ergänzungen (für Nutzer):
1) Um im Backend die Überschrift h1 auch so darzustellen wie im Frontend sollte

Code: Select all

h1:first-child {
    ...
}

/* geändert werden zu */
h1:first-of-type {
    ...
}

2) template.htm

Code: Select all

<!--<?php echo li($hc,1);?></nav>--> <!-- try this line, if you want all levels are open - or delete this line -->

<!-- müsste man komplett auskommentieren -->
<!--<?php //echo li($hc,1);?></nav>--> <!-- try this line, if you want all levels are open - or delete this line -->

3) template.htm mit Language-Menü ergänzen.

Posted: **Mon Nov 06, 2017 7:19 am**

zu 1)

Code: Select all

h1:first-of-type {

... ist an dieser Stelle natürlich viel, viel besser!
Da hatte ich wohl wieder mal Wortfindungsstörungen

zu 2)
Richtig. Ich würde sogar empfehlen, diese Zeile komplett zu löschen, sobald man sich für eine Art Menü entschieden hat. Bei weniger Menüpunkten ist die "offene" Variante wahrscheinlich besser.
Hier sieht man, dass es eine Arbeitsstudie ist. Ich hatte damit experimentiert und dann gedacht "Ach, lass es stehen. Vielleicht nutzt es jemandem."

zu 3)
Langmenu sollte problemlos in den "site-header" passen.

Danke, Ludwig.

Flexbox:
Ich schrieb ja, dass es aus "Inspirationen aus dem Netz" besteht.
Glaub mir, ich habe Flexbox immer noch nicht vollständig verstanden. Ist nicht intuitiv anwendbar. Man muss tierisch aufpassen, was man tut.
Ist es aber gelungen, dann ist es wirkich schön simpel. (BTW: IE11 macht hier alles richtig)

In Zukunft werden wir allerdings mehr mit CSS-Grid arbeiten müssen/können/dürfen.
Das ist etwas übersichtlicher. Browser-Support fehlt noch etwas.

Posted: **Sun Nov 19, 2017 11:59 pm**

Danke für die Anregung! Ich habe zwar keine Zeit mir das Template wirklich einmal anzuschauen, habe aber kürzlich bei Imagescroller_XH eine "Flexbox" eingesetzt, und das scheint weitere Modernisierungen zu ermöglichen.

Ich freue mich also schon auf Ausführungen zum Grid-Layout.

Posted: **Sat Nov 25, 2017 11:25 am**

Es gibt ja einige Mini-CSS-Grids, nicht solche Boliden wie Bootstrap oder auch Foundation.

Ob sich da eines eignen würde es anzupassen auf die Bedürfnisse von XH?

Gruß
rothom

Posted: **Sat Nov 25, 2017 11:35 am**

rothom wrote:Es gibt ja einige Mini-CSS-Grids, nicht solche Boliden wie Bootstrap oder auch Foundation.

Richtig.
Doch es ging nicht um CSS-Grids (mit "col ..." wie schon in fhs-simple verwendet), sondern um "display: grid;", was eine relativ neue CSS-Eigenschaft ist.

"fhs-old-style-but-flexy" verwendet "flexbox".

Posted: **Sat Nov 25, 2017 11:37 am**

Damn, da habe ich den Kontext falsch verstanden, somit ein weiteres obsoletes Posting von mir

CMSimple_XH–Forum

[Template] fhs-old-style-but-flexy

[Template] fhs-old-style-but-flexy

Re: [Template] fhs-old-style-but-flexy

Re: [Template] fhs-old-style-but-flexy

Re: [Template] fhs-old-style-but-flexy

Re: [Template] fhs-old-style-but-flexy

Re: [Template] fhs-old-style-but-flexy

Re: [Template] fhs-old-style-but-flexy