The wikis are now using the new authentication system.
If you did not migrate your account yet, visit https://idp-portal-info.suse.com/

Hilfe:Design

Wechseln zu: Navigation, Suche
Dieser Artikel dokumentiert das Design der openSUSE-Wikis im Bento-Theme (von en: theme, ca. Motiv, Thema für graphisches Design im Softwarebereich) und sollte als Styleguide (Gestaltungsrichtlinie) benutzt werden.

Vorlagen gibt es hier und der gesamte Quellcode ist auf gitorious verfügbar.

Farbschema

Hauptfarben

Beschreibung (Name) Hex RGB Farbbeispiel Beispiel für Anwendung der Farbe
Dunkelgrau
(Dark Grey)
#444444 68 68 68 Schriftzeichen
Mittelgrau
(Medium Grey)
#666666 102 102 102 Hintergrund der Navigation
Hellgrau 1
(Light Grey 1)
#999999 153 153 153 Schrift in einem Eingabefeld, das nicht auswählt wurde
Hellgrau 2
(Light Grey 2)
#DDDDDD 221 221 221 Kopf- und Fußzeile eines Kastens
(Box Header and Footer)
Hintergrundgrau
(BG Grey)
#F6F6F6 246 246 246 Hintergrund im Hauptteil
(Body Background)
Blau 1
(Blue 1)
#006699 0 102 153 Verknüpfungen im Inhalt
(Content Links)
Blau 2
(Blue 2)
#3399CC 51 153 204 Verknüpfungen beim Darüberstreichen mit dem Mauszeiger
(Content Links hover)
Grün 1
(Green 1)
#669900 102 153 0 Verknüpfungen außerhalb des Inhalts
(Text-Links outside of content)
Hellgelb
(Light Yellow)
#FBF9EE 251 249 238 Hintergrund eines Kastens für Benachrichtigungen
(Notification Box Background)
Gelb
(Yellow)
#FCEFA1 252 239 161 Grenzlinie eines Kastens für Benachrichtigungen
(Notification Box Border)
Hellrot
(Light Red)
#FEF1EC 254 241 236 Hintergrund eines Kastens für Fehlermeldungen
(Error Notification Box Background)
Rot
(Red)
#CC0000 204 0 0 Grenzlinie und Schriftzeichen eines Kastens für Fehlermeldungen
(Error Notification Box Border and Font-Color)

Die entsprechenden Farbpaletten stehen auf colourlovers.com zur Verfügung:

Palette Grau: Bento-Theme Grey
Palette Farbig: Bento-Theme Colors
Palette für Sofortbenachrichtigungen: Bento-Theme Flash

Farben für Schatten, Grenzlinien usw. (UI-Style)

Beschreibung (Name) Hex RGB Farbbeispiel Beispiel für Anwendung der Farbe
Sehr dunkels Grau
(Dark Grey)
#111111 17 17 17 Untere Grenzlinie eines Kastens
(Box Bottom Border)
Mittelgrau 2
(Medium Grey 2)
#4E4E4E 78 78 78 Haupttrennlinie in Navigation
(Main Navigation Separator)
Grau für dunkle Schatten
(Dark Shadow Grey)
#222222 34 34 34 Schattenwurf Kasten
(Box Dropshadow)
Grau für helle Schatten
(Light Shadow Grey)
#CCCCCC 204 204 204 Schattenwurf Kasten
(Box Dropshadow)

Auch hierfür steht die entsprechende Farbpalette auf colourlovers.com zur Verfügung:

Palette: Bento-Theme UI-Sytle


Auswahl der Icons (Standard)

Die Standardicons (Standardpiktogramme) für das Bento-Theme sind:

Auf die Icons aus dem Tango Icon Theme hat man sich nach dieser Diskussion auf der Mailing-Liste opensuse-artwork geeinigt.


Siehe auch