Theming mit LESS

Theming ist eine verbreitete Anforderung in Webanwendungen. Oft geht es nur darum die Farben auszutauschen und dafür gibt es in LESS eine sehr schöne Möglichkeit mittels Variablen. HTML Zunächst wird das aktive Theme im <body> Tag hinterlegt: <body class=“theme-modern“> oder <body class=“theme-classic“> all.less In der Hauptprojektdatei, die ich gerne all.less nenne, werden alle Themes eingebunden: […]

Mehr lesen »

gfx.less

gfx.less ist ein kleines Tool und kombiniert zwei tolle Sachen: in CSS eingebettete Bilder und LESS Variablen. Für alle, die Performance tunen möchten, aber bitte automatisch! Grundlagen Bilddateien können im Base64-Format direkt ins CSS eingebettet werden: .someClass { background: url(‚data:image/jpg;base64,/9j/4AAQSkZJRgABAQEBLAEsAAD/…lP2z//Z‘); } Das ist eine gängige Performance-Optimierung, da für dieses Bild nun kein separater HTTP-Request nötig […]

Mehr lesen »

Endlich Clean CSS

Eigentlich bin ich viele Jahre gut mit meinen CSS Kenntnissen ausgekommen, aber jetzt habe ich festgestellt, dass man doch nie auslernt und es doch besser geht. Das sind die Zutaten: Namenskonvention LESS Modularisierung Bundling Namenskonvention Bei CSS gibt es einfach zu viele Namenskonventionen: die aus der .NET Ecke schwören auf „Camel-Casing“ und die aus der […]

Mehr lesen »