[CF4.12] Flatman Style

Vielen Dank fürs bereitstellen Chris.

Ich werde mir das Theme die Tage mal anschauen und ggf. auch noch etwas machen und dann hier für die Community bereit stellen.

Hi Sascha,

freut mich, dass Dir der Style gefällt und Du ihn verwenden kannst! Ich wünsche viel Spaß damit!

Mit CSS kopieren überschreibst Du natürlich auch die gesamte Struktur und Button Layouts, das würde ich daher nicht empfehlen da gibt es auch mitunter Pfadfehler. Besser wäre es, wenn Du die Farbcodes der LESS Datei anpasst und Dir dann eine neue CSS Compilierst. Du findest alle Farbcodes bei jedem CF4 Style in den Less-Configdateien und kannst von den Variablen natürlich auch Farbcodes von einem Style in den anderen übernehmen. Alle Farbcodes sind in diesen beiden Dateien sozusagen an einer zentralen Stelle.

Beim Flatman Style wären das die Dateien less/config.less sowie less/flatmanUI.less
Beim CBlack heißen die less/config.less und entsprechend less/cblackUI.less

Die Variablennamen sind soweit identisch also kannst Du zumindest die FarbWerte ohne Probleme von einem Style in den anderen übernehmen. Bitte nicht die gesamte Configdatei, da stehen nämlich noch stylespezifische Größenwerte und Dateipfade drin!

Danach compilierst Du dir aus den neuen less Dateien eine css. Wie das geht findest Du hier: less-dateien-kompilieren-t17706.html bzw. mit Videotutorial hier: less-dateien-kompilieren-t17748.html

Lade vor dem Compilieren übrigens nicht nur den templates/ Ordner herunter sondern auch den shared/ Ordner, da liegt auch noch Zeugs drin was er dann braucht.



Zu Deinem Skalierproblem:
Du hast Dein Banner einmal als Hintergrundgrafik und einmal als Bannergrafik drin und die überlagern sich. Ich würde das entsprechend anpassen entweder-oder: Da Du Text auf dem Banner hast würde ich nur auf die Grafik setzen und diese dann einfach zentrieren, ansonsten müsstest Dir mehrere Banner machen und die je nach Responsive Variante zünden.

Alternativ: Hauptbanner als Hintergrundgrafik die sich schieben kann und Deinen Seitennamen als Transparentes PNG drüber. Das Hintergrundbild eben so, dass es nicht so schlimm ist wenn mal Bildbereiche abgeschnitten werden je nach Monitorgröße.

Im Originallayout wird daher als Hintergrundgrafik nur der Farbverlauf benutzt der etwas größer ist als die größte Breite der Seite, damit er bei jeder Variante etwas "Platz" hat - das Hintergrundbild wird dann einfach skaliert bzw. "cover" sodass halt immer ein Teil davon oder möglichst viel angezeigt wird. Bei Deiner Änderung überlagern sich aktuell aber sozusagen 2x die Bilder.

Da dies aber jetzt mit dem eigentlichen Layout-Download nichts zu tun hat und in Richtung Programmier- bzw. CSS/HTML-hilfe geht kannst Du dazu bei weiteren Problemen oder Fragen aber gerne ein Support Ticket in einem der Supportforen öffnen, das hat mit dem Flatman Style direkt nichts zu tun, das entsteht durch Deine Anpassung.

Aktuell bekommst Du die überlappende Hintergrundgrafik über den Bereich in der Haupt-LESS Datei (Hintergrundbild) bzw. Deiner CSS heraus:

Der Bereich startet mit:


Darin hast du noch das doppelte Bild:


Wenn Du diese eine Zeile damit ersetzt hast Du keine Doppelgrafik mehr und nur noch Dein klickbares Headerbanner:



Viele Grüße,
Chris

Hi Sascha,

super freut mich, dass ich Dir weiterhelfen konnte!

Mit dem Banner siehst Du das genau richtig, dieser Ansatz sollte gut funktionieren. Es ist ja grundlegend ein normales Image und standardmäßig sprengen die Bilder im CF4 nie die umliegenden Container - also mit anderen Worten: Wenn der Header kleiner wird, wird auch das Banner kleiner. Falls das nicht klappt, kannst Du dem Banner Image noch ein style="max-width:100%;" mitgeben.


Viele Grüße,
Chris