Freitag, 14 Januar 2011 21:40

CSS Tutorial

Ab Version 0.9.6.2 ist das Layout mittels CSS vom Inhalt getrennt.

Das bedeutet, dass über die Datei "includes/clm_content.css" sich das gesamte Layout steuern lässt.

Dieses Tutorial soll zeigen, wie das Layout aufgebaut ist und wie man es individuell gestalten kann.

 

 


 

1. #clm

 

Jede Seite beginnt erst einmal damit, d.h. möchte man Anpassungen für alle Tabellen auf allen CLM-Seiten erreichen, macht man es über: #clm table { }

 

2. #clm #(?view=)

 

Für individuelle Anpassungen schaut man sich erst einmal die URL an:

Speziell für oben wäre der Aufbau: #clm #rangliste { }

 

Weitere Möglichkeiten sind:

 

#aktuelle_runde
#check
#dwz_liga
#dwz
#info
#mannschaft
#meldeliste

#meldung

#paarungsliste
#rangliste
#runde
#spieler
#statistik
#turnier_info

#turnier_invitation

#turnier_rangliste
#turnier_paarungsliste
#turnier_runde
#turnier_teilnehmer
#verein
#vereinsdaten

 


 

3. .componentheading

 

Für gewöhnlich steht die Überschrift als erstes da.

Allgemeine Anpassungen: #clm .componentheading

Individuelle: #clm #(view) .componentheading

 

Beispiel links:

 

#statistik .componentheading

 

 

 

 

 

 


 

4. h4

 

Auf manchen Seiten erscheinen noch weitere Überschriften.

Allgemeine Anpassungen: #clm h4

Individuelle: #clm #(view) h4

 

Beispiel links:

 

#statistik h4

 

 

 

 

 

 


 

5. #desc

 

Auf manchen Seiten befindet sich ein eingeschobener Inhalt mit Hinweisen. Die Überschrift spricht man über "h4" oder "b" an, den Inhalt allgemein über #desc

Allgemeine Anpassungen: #clm #desc

Individuelle: #clm #(view) #desc

 

Beispiel links:

 

#statistik #desc

 

 

 

 


 

6. table

 

Die Tabelle besitzt noch eigene Klassennamen, die über die views hinausgehen (zB die Klasse für Runde):

 

.dwz

.dwz_liga

.runde

.mannschaft

.meldung

.paarungsliste

.rangliste

.spielerverlauf

.spielerdwzneu

.spielplan

.turnier_rangliste

.turnier_teilnehmer

.statistik

Allgemeine Anpassungen: #clm table

Individuelle: #clm #(view) table

oder: #clm table.(Klassenname)

 

Beispiel links: #statistik table oder table.statistik

 


 

7. th

 

Tabellenüberschriften

Allgemeine Anpassungen: #clm table th

Individuelle: #clm #(view) table th

oder: #clm table.(Klassenname) th

 

 


 

8. tr und td

 

Der Zeileninhalt besteht aus geraden und ungeraden Zeilen tr: .zeile1 und .zeile2

Zeilen bestehen aus Zellen td. Die Zellen kann man als Einstellungen für die Spalten ansehen (mit Ausnahme der Überschriften)

 

Einige Tabellen enthalten eine Unterüberschrift. Diese wird mittels .anfang bestimmt.

 

 

Bei Summen gibt es am Ende einer Tabelle eine zusätzliche Zeile .ende

 

 

 


 

9. #wrong

 

Fehlermeldung

Publiziert in CSS
Freitag, 14 Januar 2011 22:46

Wie kann ich das Layout ändern?

 

Antwort

 

Das Layout vom CLM lässt sich mittels einer eigenen CSS individuell anpassen.

 

Die Datei befindet sich in "components/com_clm/includes/clm_content.css".

 

Unter "Das Frontend" links finden Sie ein eigenes CSS Tutorial, das einen ersten Überblick gibt.

Publiziert in F.A.Q
Sonntag, 28 Dezember 2008 10:41

Das Frontend

 

Das Frontend ist der öffentlich zugängliche Bereich der Webseite den jedermann betreten kann.

Für registrierte Benutzer, also Benutzer die von ihrem Staffelleiter einen Account bekommen haben, ist zusätzlich möglich Ergebnisse und Meldelisten abzugeben, sowie die Vereinsdaten zu ändern. Entsprechende Anleitungen zu den Bereichen finden Sie in diesem Menüpunkt.

Direkt nach Abgabe der Daten sind diese auf der Internetseite verfügbar. Da die Daten noch nicht überprüft wurden haben wir dem CLM eine Möglichkeit mitgegeben geprüfte Daten als solche zu kennzeichnen : Wenn Sie links in der Überschrift der Paarungsliste bzw. Rundenübersicht einen kleinen grünen Haken sehen wurden die Daten der jeweiligen Runde vom Staffelleiter geprüft. Vorher gelten sie nur unter Vorbehalt der Richtigkeit.

Ein blaues Info Symbol im linken Kopfbereich der Paarungsliste deutet einen Hinweis des Spielleiters an. In der entsprechenden Rundenübersicht ist der Hinweis dann zu lesen.

Die nachstehenden Grafiken soll dies verdeutlichen :





Publiziert in Allgemein
Cookies erleichtern die Bereitstellung unserer Dienste. Mit der Nutzung unserer Dienste erklären Sie sich damit einverstanden, dass wir Cookies verwenden.
Ok