Colours.css! Was ist wofür?!!

Alles zu Styles, Templates, Icons und Smilies für phpBB 3.0.x, sowie allgemeine Designfragen zur Integration von phpBB in bestehende Websites.
phpBB Styles Demo
Forumsregeln
Bei Style spezifischen Fragen ist der Stylename und die Downloadquelle des Styles erforderlich, besser noch die URL vom betroffenen Forum.
TheLuBu
Mitglied
Beiträge: 47
Registriert: 19.03.2009 23:42
Wohnort: Mönchengladbach
Kontaktdaten:

Colours.css! Was ist wofür?!!

Beitrag von TheLuBu » 31.03.2009 21:04

Hallo liebe Community,

Ich habe mir mal die Mühe gemacht und die Colours.css Datei (prosilver) mit Kommentaren ausgestattet. Bin bis jetzt bei der Hälfte, diese Woche kommt auch noch die andere Hälfte dran. Bei den Farben, welche nicht kommentiert sind, konnte ich nicht wirklich rausfinden, wo irgendetwas geändert wird. Ich hoffe es hilft euch wenigstens etwas!

Code: Alles auswählen

/*  	
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */

html, body {
	color: #000000; 				/*Besucher etc*/
	background-color: #000000;		/*Hintergrund*/
}

h1 {
	color: #000000;					/*Überschrift (Forenname)*/
}

h2 {
	color: #000000;					/*Übersicht (Persönlicher Bereich)*/
}

h3 {
	border-bottom-color: #000000;   /*Überschrift (FAQ)*/
	color: #000000;					/*Überschrift (Wer war da, wer ist online)*/
}

hr {
	border-color: #000000;
	border-top-color: #000000;
}

hr.dashed {
	border-top-color: #000000;
}

/* Search box
--------------------------------------------- */

#search-box {
	color: #000000;					/* Linie unter der Suche */
}

#search-box #keywords {
	background-color: #000000;		/* Hintergrund Suchbox Startseite */
}

#search-box input {
	border-color: #000000;			/* Suchbox Rand */
}

/* Round cornered boxes and backgrounds
---------------------------------------- */
.headerbar {
	background-color: #000000;		/* Hintergrund ganz oben */
	background-image: url("{T_THEME_PATH}/images/bg_header.gif");
	color: #000000;					/* Text ganz oben */
}

.navbar {
	background-color: #000000;		/* Hintergrund zwischen Header und Forum selbst, ganz unten (enthält Text: Foren Übersicht, Team etc) */
}

.forabg {
	background-color: #000000;		/* Rahmen um Überforen */
	background-image: url("{T_THEME_PATH}/images/bg_list.gif");
}

.forumbg {
	background-color: #000000;		/* Rahmen um Subforen */
	background-image: url("{T_THEME_PATH}/images/bg_header.gif");
}

.panel {
	background-color: #000000;  	/* Hintergrund Suche (Suchanfrage -> Übereinstimmung) Mitglieder (Nach ->Suche Button) */
	color: #000000;					/* Text Suche und Mitgliederliste oben */
}

.post:target .content {
	color: #000000;
}

.post:target h3 a {
	color: #000000;
}

.bg1	{ background-color: #000000; }
.bg2	{ background-color: #000000; }
.bg3	{ background-color: #000000; }

.ucprowbg {
	background-color: #000000;
}

.fieldsbg {
	background-color: #000000;
}

span.corners-top {
	background-image: url("{T_THEME_PATH}/images/corners_left.png");
}

span.corners-top span {
	background-image: url("{T_THEME_PATH}/images/corners_right.png");
}

span.corners-bottom {
	background-image: url("{T_THEME_PATH}/images/corners_left.png");
}

span.corners-bottom span {
	background-image: url("{T_THEME_PATH}/images/corners_right.png");
}

/* Horizontal lists
----------------------------------------*/

ul.navlinks {
	border-bottom-color: #000000;				/* Streifen zwischen Foren Übersicht und Persönlicher BEreich */
}

/* Table styles
----------------------------------------*/
table.table1 thead th {
	color: #000000;
}

table.table1 tbody tr {
	border-color: #000000;
}

table.table1 tbody tr:hover, table.table1 tbody tr.hover {
	background-color: #000000;
	color: #000000;
}

table.table1 td {
	color: #000000;
}

table.table1 tbody td {
	border-top-color: #000000;
}

table.table1 tbody th {
	border-bottom-color: #000000;
	color: #000000;
	background-color: #000000;
}

table.info tbody th {
	color: #000000;
}

/* Misc layout styles
---------------------------------------- */
dl.details dt {
	color: #000000;
}

dl.details dd {
	color: #000000;
}

.sep {
	color: #000000;
}

/* Pagination
---------------------------------------- */

.pagination span strong {
	color: #000000;							/* Aktuell Ausgewählte Seite (1,2,3,4...( */
	background-color: #000000;				/* Aktuell Ausgewählte Seite Hintergrund */
	border-color: #000000;					/* Aktuell Ausgewählte Seite Hintergrund Rand */
}

.pagination span a, .pagination span a:link, .pagination span a:visited, .pagination span a:active {
	color: #000000;							/* Seitenanzahl (außer aktuell gewählter Seite) Oben und unten rechts */
	background-color: #000000;				/* Seitenanzahl Hintergrund(außer aktuell gewählter Seite) Oben und unten rechts */
	border-color: #000000;					/* Seitenanzahl Hintergrund Rand(außer aktuell gewählter Seite) Oben und unten rechts */
}

.pagination span a:hover {
    color: #000000;							/* Seitenanzahl beim MouseOver(außer aktuell gewählter Seite) Oben und unten rechts */
	background-color: #000000;				/* Seitenanzahl Hintergrund beim MouseOver(außer aktuell gewählter Seite) Oben und unten rechts */
	border-color: #000000;					/* Seitenanzahl Hintergrund Rand beim MouseOver (außer aktuell gewählter Seite) Oben und unten rechts */
}

/* Pagination in viewforum for multipage topics */
.row .pagination {
	background-image: url("{T_THEME_PATH}/images/icon_pages.gif");
}

.row .pagination span a, li.pagination span a {
	background-color: #000000;				/* Seitenanzahl Hintergrund(außer aktuell gewählter Seite) Forenübersicht */
}

.row .pagination span a:hover, li.pagination span a:hover {
	background-color: #000000;				/* Seitenanzahl Hintergrund beim MouseOver(außer aktuell gewählter Seite) Forenübersicht */
}

/* Miscellaneous styles
---------------------------------------- */

.copyright {
	color: #000000;							/* Copyright */
}

.error {
	color: #000000;							/* Error Meldungen z.B. falscher Login */
}

.reported {
	background-color: #000000;				
}

li.reported:hover {
	background-color: #000000 !important;
}
.sticky, .announce {
	/* you can add a background for stickies and announcements*/
}

div.rules {
	background-color: #000000;
	color: #000000;
}

p.rules {
	background-color: #000000;
	background-image: none;
}

/*  	
--------------------------------------------------------------
Colours and backgrounds for links.css
-------------------------------------------------------------- */

a:link	{ color: #000000; }
a:visited	{ color: #000000; }
a:hover	{ color: #000000; }
a:active	{ color: #000000; }

/* Links on gradient backgrounds */
#search-box a:link, .navbg a:link, .forumbg .header a:link, .forabg .header a:link, th a:link {
	color: #000000;						/* Linkfarbe in Rahmen */
}

#search-box a:visited, .navbg a:visited, .forumbg .header a:visited, .forabg .header a:visited, th a:visited {
	color: #000000;						/* Linkfarbe im Rahmen nach Besuch */
}

#search-box a:hover, .navbg a:hover, .forumbg .header a:hover, .forabg .header a:hover, th a:hover {
	color: #000000;						/* Linkfarbe im Rahmen beim MouseOver */
}

#search-box a:active, .navbg a:active, .forumbg .header a:active, .forabg .header a:active, th a:active {
	color: #000000;						/* Linkfarbe im Rahmen beim Klicken */
}

/* Links for forum/topic lists */
a.forumtitle {
	color: #000000;
}

/* a.forumtitle:visited { color: #B51113; } */

a.forumtitle:hover {
	color: #000000;
}

a.forumtitle:active {
	color: #000000;
}

a.topictitle {
	color: #000000;						/* Themenüberschrift */
}

/* a.topictitle:visited { color: #000000; } */

a.topictitle:hover {
	color: #000000;						/* Themenüberschrift bei MouseOver*/
}

a.topictitle:active {
	color: #000000;						/* Themenüberschrift beim Klicken */
}

/* Post body links */
.postlink {
	color: #000000;
	border-bottom-color: #000000;
}

.postlink:visited {
	color: #000000;
	border-bottom-color: #000000;
}

.postlink:active {
	color: #000000;
}

.postlink:hover {
	background-color: #000000;
	color: #000000;
}

.signature a, .signature a:visited, .signature a:active, .signature a:hover {
	background-color: #000000;			/* Signaturlinks */
}

/* Profile links */
.postprofile a:link, .postprofile a:active, .postprofile a:visited, .postprofile dt.author a {
	color: #000000;						/* Link zum Profil (Benutzername) unter Avatar, Avatarlink selbst ohne Grafiken */
}

.postprofile a:hover, .postprofile dt.author a:hover {
	color: #000000;						/* Link zum Profil (Benutzername) unter Avatar, Avatarlink selbst ohne Grafiken beim MouseOver*/
}

/* Profile searchresults */	
.search .postprofile a {
	color: #000000;
}

.search .postprofile a:hover {
	color: #000000;
}

/* Back to top of page */
a.top {
	background-image: url("{IMG_ICON_BACK_TOP_SRC}");
}

a.top2 {
	background-image: url("{IMG_ICON_BACK_TOP_SRC}");
}

/* Arrow links  */
a.up		{ background-image: url("{T_THEME_PATH}/images/arrow_up.gif") }
a.down		{ background-image: url("{T_THEME_PATH}/images/arrow_down.gif") }
a.left		{ background-image: url("{T_THEME_PATH}/images/arrow_left.gif") }
a.right		{ background-image: url("{T_THEME_PATH}/images/arrow_right.gif") }

a.up:hover {
	background-color: #000000;
}

a.left:hover {
	color: #000000;
}

a.right:hover {
	color: #000000;
}


/*  	
--------------------------------------------------------------
Colours and backgrounds for content.css
-------------------------------------------------------------- */

ul.forums {
	background-color: #000000;							/* Hintergrund für Subforen in der Übersicht */
	background-image: url("{T_THEME_PATH}/images/gradient.gif");
}

ul.topiclist li {
	color: #000000;										/* Beschreibung für Subforen, Zugriffe, Antworten, Daten (Foren) */
}

ul.topiclist dd {
	border-left-color: #000000;							/* Trennlinien zwischen Themen, Beiträgen, Letzter Beitrag */
}

.rtl ul.topiclist dd {
	border-right-color: #000000;
	border-left-color: #000000;
}

ul.topiclist li.row dt a.subforum.read {
	background-image: url("{IMG_SUBFORUM_READ_SRC}");
}

ul.topiclist li.row dt a.subforum.unread {
	background-image: url("{IMG_SUBFORUM_UNREAD_SRC}");
}

li.row {
	border-top-color:  #000000;							/* Linien zwischen den Foren und Themen */
	border-bottom-color: #000000;						/* Linien zwischen den Foren und Themen */
}

li.row strong {
	color: #000000;										/* Moderator eines Forums, [...] bei Seitenanzahl von Antworten */
}

li.row:hover {
	background-color: #000000;							/* Farbänderung beim MouseOver von Themen und Foren */
}

li.row:hover dd {
	border-left-color: #000000;							/* Trennlinien zwischen Themen, Beiträgen, Letzter Beitrag bei MouseOver*/
}

.rtl li.row:hover dd {
	border-right-color: #000000;
	border-left-color: #000000;
}

li.header dt, li.header dd {
	color: #000000;										/* Überschrift der Spalten (Themen, Beiträge, Antworten, Zugriffe, Letzter Beitrag */
}

/* Forum list column styles */
ul.topiclist dd.searchextra {
	color: #000000;
}

/* Post body styles
----------------------------------------*/
.postbody {
	color: #000000;										/* von, wann und SIgnatur im Beitrag */
}

/* Content container styles
----------------------------------------*/
.content {
	color: #000000;										/* Beitragsinhalt */
}

.content h2, .panel h2 {
	color: #000000;
	border-bottom-color:  #000000;
}

dl.faq dt {
	color: #000000;										/*FAQ kleine Überschriften */
}

.posthilit {
	background-color: #000000;
	color: #000000;
}

/* Post signature */
.signature {
	border-top-color: #000000;							/* Linie zwischen Beitrag und Signatur */
}

/* Post noticies */
.notice {
	border-top-color:  #000000;							/* Linie über "zuletzt geändert von" */
}

/* BB Code styles
----------------------------------------*/
/* Quote block */
blockquote {
	background-color: #000000;										/* Hintergrund eines Zitates */
	background-image: url("{T_THEME_PATH}/images/quote.gif");		/* Hintergrundbild eines Zitates */
	border-color:#000000;											/* Rahmenfarbe eines Zitates */
}

blockquote blockquote {
	/* Nested quotes */
	background-color:#000000;										/* Hintergrund eines Zitates in einem Zitat */
}

blockquote blockquote blockquote {
	/* Nested quotes */
	background-color: #000000;										/* Hintergrund eines Zitates in einem Zitat in einem Zitat */
}

/* Code block */
dl.codebox {
	background-color: #000000;										/* Hintergrund der Codebox */
	border-color: #000000;											/* Rahmen des Codeblockes */
}

dl.codebox dt {
	border-bottom-color:  #000000;
}

dl.codebox code {
	color: #000000;													/* Codebox Textfarbe */
}

.syntaxbg		{ color: #000000; }
.syntaxcomment	{ color: #000000; }
.syntaxdefault	{ color: #000000; }
.syntaxhtml		{ color: #000000; }
.syntaxkeyword	{ color: #000000; }
.syntaxstring	{ color: #000000; }

/* Attachments
----------------------------------------*/
.attachbox {
	background-color: #000000;
	border-color:  #000000;
}

.pm-message .attachbox {
	background-color: #000000;
}

.attachbox dd {
	border-top-color: #000000;
}

.attachbox p {
	color: #000000;
}

.attachbox p.stats {
	color: #000000;
}

.attach-image img {
	border-color: #000000;
}

/* Inline image thumbnails */

dl.file dd {
	color: #000000;
}

dl.thumbnail img {
	border-color: #000000;
	background-color: #000000;
}

dl.thumbnail dd {
	color: #000000;
}

dl.thumbnail dt a:hover {
	background-color: #000000;
}

dl.thumbnail dt a:hover img {
	border-color: #000000;
}

/* Post poll styles
----------------------------------------*/

fieldset.polls dl {
	border-top-color: #000000;
	color: #000000;
}

fieldset.polls dl.voted {
	color: #000000;
}

fieldset.polls dd div {
	color: #000000;
}

.rtl .pollbar1, .rtl .pollbar2, .rtl .pollbar3, .rtl .pollbar4, .rtl .pollbar5 {
	border-right-color: #000000;
}

.pollbar1 {
	background-color: #000000;
	border-bottom-color: #000000;
	border-right-color: #000000;
}

.rtl .pollbar1 {
	border-left-color: #000000;
}

.pollbar2 {
	background-color: #000000;
	border-bottom-color: #000000;
	border-right-color: #000000;
}

.rtl .pollbar2 {
	border-left-color: #000000;
}

.pollbar3 {
	background-color: #000000;
	border-bottom-color: #000000;
	border-right-color: #000000;
}

.rtl .pollbar3 {
	border-left-color: #000000;
}

.pollbar4 {
	background-color: #000000;
	border-bottom-color: #000000;
	border-right-color: #000000;
}

.rtl .pollbar4 {
	border-left-color: #000000;
}

.pollbar5 {
	background-color: #000000;
	border-bottom-color: #000000;
	border-right-color: #000000;
}

.rtl .pollbar5 {
	border-left-color: #000000;
}

/* Poster profile block
----------------------------------------*/
.postprofile {
	color: #000000;								/* Beitragszahl, Registrationsdatum, Wohnort unterm Avatar (Anzahl,  Daten etc.)*/
	border-left-color: #000000;					/* vertikaler Streifen am Rand neben dem Avatar */
}

.rtl .postprofile {
	border-right-color: #000000;
	border-left-color: #000000;
}

.pm .postprofile {
	border-left-color: #000000;					/* vertikaler Streifen am Rand neben dem Avatar */
}

.rtl .pm .postprofile {
	border-right-color: #000000;
	border-left-color: #000000;
}

.postprofile strong {
	color: #000000;								/* Beiträge, Registriert und Wohnort unterm Avatar*/
}

.online {
	background-image: url("{T_IMAGESET_LANG_PATH}/icon_user_online.gif");
}

/*  	
--------------------------------------------------------------
Colours and backgrounds for buttons.css
-------------------------------------------------------------- */

/* Big button images */
.reply-icon span	{ background-image: url("{IMG_BUTTON_TOPIC_REPLY_SRC}"); }
.post-icon span		{ background-image: url("{IMG_BUTTON_TOPIC_NEW_SRC}"); }
.locked-icon span	{ background-image: url("{IMG_BUTTON_TOPIC_LOCKED_SRC}"); }
.pmreply-icon span	{ background-image: url("{IMG_BUTTON_PM_REPLY_SRC}") ;}
.newpm-icon span 	{ background-image: url("{IMG_BUTTON_PM_NEW_SRC}") ;}
.forwardpm-icon span	{ background-image: url("{IMG_BUTTON_PM_FORWARD_SRC}") ;}

a.print {
	background-image: url("{T_THEME_PATH}/images/icon_print.gif");
}

a.sendemail {
	background-image: url("{T_THEME_PATH}/images/icon_sendemail.gif");
}

a.fontsize {
	background-image: url("{T_THEME_PATH}/images/icon_fontsize.gif");
}

/* Icon images
---------------------------------------- */
.sitehome						{ background-image: url("{T_THEME_PATH}/images/icon_home.gif"); }
.icon-faq						{ background-image: url("{T_THEME_PATH}/images/icon_faq.gif"); }
.icon-members					{ background-image: url("{T_THEME_PATH}/images/icon_members.gif"); }
.icon-home						{ background-image: url("{T_THEME_PATH}/images/icon_home.gif"); }
.icon-ucp						{ background-image: url("{T_THEME_PATH}/images/icon_ucp.gif"); }
.icon-register					{ background-image: url("{T_THEME_PATH}/images/icon_register.gif"); }
.icon-logout					{ background-image: url("{T_THEME_PATH}/images/icon_logout.gif"); }
.icon-bookmark					{ background-image: url("{T_THEME_PATH}/images/icon_bookmark.gif"); }
.icon-bump						{ background-image: url("{T_THEME_PATH}/images/icon_bump.gif"); }
.icon-subscribe					{ background-image: url("{T_THEME_PATH}/images/icon_subscribe.gif"); }
.icon-unsubscribe				{ background-image: url("{T_THEME_PATH}/images/icon_unsubscribe.gif"); }
.icon-pages						{ background-image: url("{T_THEME_PATH}/images/icon_pages.gif"); }
.icon-search					{ background-image: url("{T_THEME_PATH}/images/icon_search.gif"); }

/* Profile & navigation icons */
.email-icon, .email-icon a		{ background-image: url("{IMG_ICON_CONTACT_EMAIL_SRC}"); }
.aim-icon, .aim-icon a			{ background-image: url("{IMG_ICON_CONTACT_AIM_SRC}"); }
.yahoo-icon, .yahoo-icon a		{ background-image: url("{IMG_ICON_CONTACT_YAHOO_SRC}"); }
.web-icon, .web-icon a			{ background-image: url("{IMG_ICON_CONTACT_WWW_SRC}"); }
.msnm-icon, .msnm-icon a			{ background-image: url("{IMG_ICON_CONTACT_MSNM_SRC}"); }
.icq-icon, .icq-icon a			{ background-image: url("{IMG_ICON_CONTACT_ICQ_SRC}"); }
.jabber-icon, .jabber-icon a		{ background-image: url("{IMG_ICON_CONTACT_JABBER_SRC}"); }
.pm-icon, .pm-icon a				{ background-image: url("{IMG_ICON_CONTACT_PM_SRC}"); }
.quote-icon, .quote-icon a		{ background-image: url("{IMG_ICON_POST_QUOTE_SRC}"); }

/* Moderator icons */
.report-icon, .report-icon a		{ background-image: url("{IMG_ICON_POST_REPORT_SRC}"); }
.edit-icon, .edit-icon a			{ background-image: url("{IMG_ICON_POST_EDIT_SRC}"); }
.delete-icon, .delete-icon a		{ background-image: url("{IMG_ICON_POST_DELETE_SRC}"); }
.info-icon, .info-icon a			{ background-image: url("{IMG_ICON_POST_INFO_SRC}"); }
.warn-icon, .warn-icon a			{ background-image: url("{IMG_ICON_USER_WARN_SRC}"); } /* Need updated warn icon */

/*  	
--------------------------------------------------------------
Colours and backgrounds for cp.css
-------------------------------------------------------------- */

/* Main CP box
----------------------------------------*/

#cp-main h3, #cp-main hr, #cp-menu hr {
	border-color: #000000;					/* horizontale Linien unter kleinen Überschriften (Persönlicher Bereich unter "Deine Aktivität" und Moderations-Bereich unter "Die letzten 5 Beiträge...", in diesen Bereichen) */
}

#cp-main .panel li.row {
	border-bottom-color: #000000;			/* Im Persönlicher Bereich unter Benutzergruppe, horizontale Linie zwischen den einzelnen Gruppen */
	border-top-color: #000000;				/* Im Persönlicher Bereich unter Benutzergruppe, horizontale Linie zwischen den einzelnen Gruppen */
}

ul.cplist {
	border-top-color: #000000;				/* Im Persönlicher Bereich unter Benutzergruppe, horizontale Linie zwischen den einzelnen Gruppen */
}

#cp-main .panel li.header dd, #cp-main .panel li.header dt {
	color: #000000;							/* Benutzergruppe Überschriften (Gruppen-Leiter und Mitgliedschaften) */
}

#cp-main table.table1 thead th {
	color: #000000;							/* Moderationsbereich (Überschriften in Tabellen (Vorgang, Benutzername etc) */
	border-bottom-color: #000000;			/* Horizontale Linie unter den Überschriften */
}

#cp-main .pm-message {
	border-color: #000000;
	background-color: #000000;
}

/* CP tabbed menu
----------------------------------------*/
#tabs a {
	background-image: url("{T_THEME_PATH}/images/bg_tabs1.gif");
}

#tabs a span {
	background-image: url("{T_THEME_PATH}/images/bg_tabs2.gif");
	color: #000000;							/* Moderations- und Persönlicher Bereich, Linkfarbe für die verschiedenen Bereiche (Profil, Einstellungen, Private Nachrichten, etc)*/
}

#tabs a:hover span {				
	color: #000000;							/* Moderations- und Persönlicher Bereich, Linkfarbe für die verschiedenen Bereiche bei MouseOver (Profil, Einstellungen, Private Nachrichten, etc)*/
}

#tabs .activetab a {
	border-bottom-color: #000000;			/* horizontale Linie unter dem gewählten Bereich, in welchem man gerade ist (gilt für Tabs wie oben) */
}

#tabs .activetab a span {
	color: #000000;							/* Moderations- und Persönlicher Bereich, Linkfarbe für die verschiedenen Bereiche wenn man im Bereich ist (Profil, Einstellungen, Private Nachrichten, etc)*/
}

#tabs .activetab a:hover span {				/* Moderations- und Persönlicher Bereich, Linkfarbe für die verschiedenen Bereiche bei MouseOver (Profil, Einstellungen, Private Nachrichten, etc)*/
	color: #000000;
}

/* Mini tabbed menu used in MCP
----------------------------------------*/
#minitabs li {
	background-color: #000000;
}

#minitabs li.activetab {
	background-color: #000000;
}

#minitabs li.activetab a, #minitabs li.activetab a:hover {
	color: #000000;
}

/* UCP navigation menu
----------------------------------------*/

/* Link styles for the sub-section links */
#navigation a {
	color: #000000;							/* Persönlicher Bereich und Moderationsbereich, Sublinks (stehen links unter den TabLinks) */
	background-color: #000000;				/* Hintergrund für die Sublinks */
	background-image: url("{T_THEME_PATH}/images/bg_menu.gif");
}

#navigation a:hover {
	background-color: #000000;				/* Hintergrund für die Sublinks beim MouseOver*/
	color: #000000;							/* Persönlicher Bereich und Moderationsbereich, Sublinks (stehen links unter den TabLinks) beim MouseOver*/
}

#navigation #active-subsection a {
	color: #000000;							/* Farbe des Gewählten Sublinks */
	background-color: #000000;				/* Hintergrund des gewählten Sublinks */
	background-image: none;
}

#navigation #active-subsection a:hover {
	color: #000000;							/* Farbe des Gewählten Sublinks beim MouseOver */ 
}

/* Preferences pane layout
----------------------------------------*/
#cp-main h2 {
	color: #000000;							/* Farbe der Überschriften im Persönlichen Bereich und Moderationsbereich */
}

#cp-main .panel {
	background-color: #000000;				/* Hintergrundfarbe im persönlichen Bereich/Moderationsbereich */
}

#cp-main .pm {
	background-color: #000000;				/* Hintergrundfarbe von PN´s */
}

#cp-main span.corners-top, #cp-menu span.corners-top {
	background-image: url("{T_THEME_PATH}/images/corners_left2.gif");
}

#cp-main span.corners-top span, #cp-menu span.corners-top span {
	background-image: url("{T_THEME_PATH}/images/corners_right2.gif");
}

#cp-main span.corners-bottom, #cp-menu span.corners-bottom {
	background-image: url("{T_THEME_PATH}/images/corners_left2.gif");
}

#cp-main span.corners-bottom span, #cp-menu span.corners-bottom span {
	background-image: url("{T_THEME_PATH}/images/corners_right2.gif");
}

/* Topicreview */
#cp-main .panel #topicreview span.corners-top, #cp-menu .panel #topicreview span.corners-top {
	background-image: url("{T_THEME_PATH}/images/corners_left.gif");
}

#cp-main .panel #topicreview span.corners-top span, #cp-menu .panel #topicreview span.corners-top span {
	background-image: url("{T_THEME_PATH}/images/corners_right.gif");
}

#cp-main .panel #topicreview span.corners-bottom, #cp-menu .panel #topicreview span.corners-bottom {
	background-image: url("{T_THEME_PATH}/images/corners_left.gif");
}

#cp-main .panel #topicreview span.corners-bottom span, #cp-menu .panel #topicreview span.corners-bottom span {
	background-image: url("{T_THEME_PATH}/images/corners_right.gif");
}

/* Friends list */
.cp-mini {
	background-color: #000000;
}

dl.mini dt {
	color: #000000;
}

/* PM Styles
----------------------------------------*/
/* PM Message history */
.current {
	color: #000000 !important;   			/*PM Nachricht History, wenn auf eine PN geantwortet wird, wird der Text der vorhergegangenen PN in dieser Farbe angezeigt */
}

/* PM marking colours */
.pmlist li.pm_message_reported_colour, .pm_message_reported_colour {
	border-left-color: #000000;				/* Wenn eine PN gemeldet wird, hat sie Links diese Farbe */
	border-right-color: #000000;			/* Wenn eine PN gemeldet wird, hat sie Rechts diese Farbe */
}

.pmlist li.pm_marked_colour, .pm_marked_colour {
	border-color: #000000;					/* Wenn eine PN markiert wird, hat sie eine Umrandung in dieser Farbe */
}

.pmlist li.pm_replied_colour, .pm_replied_colour {
	border-color: #000000;					/* Wenn auf eine PN geantwortet wird, hat sie eine Umrandung in dieser Farbe */
}

.pmlist li.pm_friend_colour, .pm_friend_colour {
	border-color: #000000;					/* Wenn auf eine PN eines Freundes ankommt, hat sie eine Umrandung in dieser Farbe */
}

pmlist li.pm_foe_colour, .pm_foe_colour {
	border-color: #000000;
}

/* Avatar gallery */
#gallery label {
	background-color: #000000;
	border-color: #000000;
}

#gallery label:hover {
	background-color: #000000;
}

/*  	
--------------------------------------------------------------
Colours and backgrounds for forms.css
-------------------------------------------------------------- */

/* General form styles
----------------------------------------*/
select {
	border-color: #000000;				/* Rand der Auswahlboxen in Subforen und Beiträgen, z.B. Gehe zu: */
	background-color: #000000;			/* Hintergrundfarbe in den Auswahlboxen in Subforen und Beiträgen, z.B. Gehe zu: */
}

label {
	color: #000000;						/* Beschreibung vor den Auswahlboxen */
}

option.disabled-option {
	color: #000000;
}

/* Definition list layout for forms
---------------------------------------- */
dd label {
	color: #000000;						/* "Entweder-oder" Optionen Antworten im Persönlichen Bereich (Ja/Nein) */
}

/* Hover effects */
fieldset dl:hover dt label {					/* Farbe des "Entweder-Oder" Textes (z.B. Benachrichtige mich über neue Nachrichten:) beim MouseOver */
	color: #000000;
}

fieldset.fields2 dl:hover dt label {			/* Farbe des "Entweder-Oder" Textes (z.B. Benachrichtige mich über neue Nachrichten:) beim MouseOver */
	color: #000000;
}

/* Quick-login on index page */
fieldset.quick-login input.inputbox {
	background-color: #000000;			/* Hintergrund derAnmeldebox auf der Index Seite */
}

/* Posting page styles
----------------------------------------*/

#message-box textarea {
	color: #000000;						/* Schriftfarbe beim Post erstellen */
}

/* Input field styles
---------------------------------------- */
.inputbox {
	background-color: #000000;			/* "Forum/Thema durchsuchen"-Box Hintergrundfarbe */
	border-color: #000000;				/* "Forum/Thema durchsuchen"-Box Umrandungsfarbe */
	color: #000000;						/* "Forum/Thema durchsuchen"-Box Textfarbe */
}

.inputbox:hover {
	border-color: #000000;				/* "Forum und Thema durchsuchen"-Box Umrandungsfarbe bei MouseOver */
}

.inputbox:focus {
	border-color: #000000;				/* "Forum/Thema durchsuchen"-Box Umrandungsfarbe wenn die Box gewählt wird*/
	color: #000000;						/* "Forum/Thema durchsuchen"-Box Textfarbe, wenn die Box gewählt wird */
}

/* Form button styles
---------------------------------------- */

a.button1, input.button1, input.button3, a.button2, input.button2 {
	color: #000000;						/* Farbe des Suche und Los Buttons */
	background-color: #000000;			/* Hintergrundfarbe des Suche und Los Buttons, nicht sichtbar wenn Hintergrund Bild Gewählt ist */
	background-image: url("{T_THEME_PATH}/images/bg_button.gif");
}

a.button1, input.button1 {
	border-color: #000000;				/* Umrandung des Suche Buttons unter der "Erweiterte Suche" */
}

input.button3 {
	background-image: none;
}

/* Alternative button */
a.button2, input.button2, input.button3 {
	border-color: #000000;				/* Umrandungsfarbe des Suche und Los Buttons */
}

/* <a> button in the style of the form buttons */
a.button1, a.button1:link, a.button1:visited, a.button1:active, a.button2, a.button2:link, a.button2:visited, a.button2:active {
	color: #000000;
}

/* Hover states */
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, input.button3:hover {
	border-color: #000000;
	color: #000000;
}

input.search {
	background-image: url("{T_THEME_PATH}/images/icon_textbox_search.gif");
}

input.disabled {
	color: #000000;
}
Sollte jemand wissen, wofür die anderen farben sind, bitte schreibt es mir. Ich hoffe ihr kommt mit meinen spärlichen Kommentaren klar :D. Sollte etwas unklar sein, schreibt hier im Post, ich versuche so schnell wei nur möglich zu antworten :)

TheLuBu

---------EDIT---------

Komplette Kommentierung der colours.css Datei eingefügt.
Zuletzt geändert von TheLuBu am 01.04.2009 12:27, insgesamt 2-mal geändert.

JFooty
Ehemaliges Teammitglied
Beiträge: 1868
Registriert: 02.10.2007 11:46

Re: Colours.css! Was ist wofür?

Beitrag von JFooty » 31.03.2009 21:37

Hallo TheLuBu!

Da hier schon oft danach gefragt wurde, finde ich es Klasse, dass du dir diese Mühe gemacht hast. :)
Wenn ich wieder etwas mehr Zeit habe, werde ich dich unterstützen und die fehlenden Kommentierungen ergänzen.
Falls noch mehr Leute mit helfen wollen, wäre das natürlich noch besser.
Kein Support per PN!

TheLuBu
Mitglied
Beiträge: 47
Registriert: 19.03.2009 23:42
Wohnort: Mönchengladbach
Kontaktdaten:

Re: Colours.css! Was ist wofür?

Beitrag von TheLuBu » 01.04.2009 12:27

Ich glaube das schlimmste an der Sache war, das man jede der 233 Farben in der colours.css einzeln ändern und hochladen musste, dann das Theme aktualisieren und zum "Schluss" noch das Forum und alle seine Links durchsuchen musste, bis man alles gefunden hatte ^^

TheLuBu

emily

Re: Colours.css! Was ist wofür?!!

Beitrag von emily » 03.04.2009 11:51

Klasse gemacht, und hat mir sehr weitergeholfen, vielen Dank!

Dennoch hab ich etwas was ich nicht finde, vielleicht kann mir ja jemand helfen. Es geht um die Übersichtsseite, der ganz normale Hintergrund von der Kategorie und dem Mouseover "Dein erstes Forum - Beschreibung deines ersten Forums. " Ich finde die Stelle nicht wo ich die Farbe ändern kann. Wenn ich in die Kategorie gehe, dort hat alles geklappt, also das ich die Beiträge farblich ändere.

Vielleicht weiss auch zufällig noch jemand in welcher css Datei ich das Suche Feld oben bearbeiten kann (möchte es an einer anderen Stelle und Grösse haben).

Danke schön!

LG, Nadine

TheLuBu
Mitglied
Beiträge: 47
Registriert: 19.03.2009 23:42
Wohnort: Mönchengladbach
Kontaktdaten:

Re: Colours.css! Was ist wofür?!!

Beitrag von TheLuBu » 03.04.2009 12:01

Wenn ich dich richtig verstehe, korriegiere mich bitte wenn ich falsch liege, meinst du die verschiedenen Subforen. Sind die bei dir blau (falls du prosilver benutzt)? Wenn ja, schau mal im Images Ordner nach, der blaue MouseOver Balken ist eine langgezogene Grafik. Entweder kannst du die Grafik ändern oder in der colours.css aus dem Imagepfad einen Farbwert machen.

Schicke mir ansonsten mal dein Forum per PN und kontaktiere mich am besten über ICQ, dann kannst du das besser erklren glaube ich :)

MfG TheLuBu

emily

Re: Colours.css! Was ist wofür?!!

Beitrag von emily » 03.04.2009 14:55

Danke, auf die Idee mit dem Pfad hätte ich auch kommen können *lach* Manchmal sieht man den Wald vor lauter Bäumen nicht!

Hat geklappt!

TheLuBu
Mitglied
Beiträge: 47
Registriert: 19.03.2009 23:42
Wohnort: Mönchengladbach
Kontaktdaten:

Re: Colours.css! Was ist wofür?!!

Beitrag von TheLuBu » 07.04.2009 19:10

Noch ein paar Farben gefunden und Kommentare hinzugefügt

Code: Alles auswählen

/*  	
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */

html, body {
	color: #000000;					/*Besucher etc*/
	background-color: #F8E9C2;		/*Hintergrund*/
	background-image: url("{T_THEME_PATH}/images/background.jpg");
}

h1 {
	color: #000000;					/*Überschrift (Forenname)*/
}

h2 {
	color: #000000;					/*Überschrift (Persönlicher Bereich)*/
}

h3 {
	border-bottom-color: #000000;	/*Überschrift (FAQ)*/
	color: #000000;					/*Überschrift (Wer ist online)*/
}

hr {
	border-color: #F8E9C2;
	border-top-color: #000000;
}

hr.dashed {
	border-top-color: #000000;
}

/* Search box
--------------------------------------------- */

#search-box {
	color: #91694A;					/* Linie unter der Suche */
}

#search-box #keywords {
	background-color: #F8E9C2;			/* Hintergrund Suchbox Startseite */
}

#search-box input {
	border-color: #DED0AB;			/* Suchbox Rand */
}

/* Round cornered boxes and backgrounds
---------------------------------------- */
.headerbar {
	background-color: #F8E9C2;
	background-image: url("{T_THEME_PATH}/images/bg_header.gif");
	color: #DEB887;					/* Text ganz oben */
}

.navbar {
	background-color: #DEB887;		/* Hintergrund zwischen Header und Forum selbst, ganz unten (enthält Text: Foren Übersicht, Team etc) */
}

.forabg {
	background-color: #5D3D03;    /* Farbe des linken und rechten Balken in der Forenübersicht */
	background-image: url("{T_THEME_PATH}/images/bg_list.gif");
}

.forumbg {
	background-color: #7A611F;    /* Farbe des linken und rechten Balken in der Subforenübersicht */
	background-image: url("{T_THEME_PATH}/images/bg_header.gif");
}

.panel {
	background-color: #DEB887;		/* Hintergrund Suche (Suchanfrage -> Übereinstimmung) Mitglieder (Nach ->Suche Button) */
	color: #B51113;					/* Text Suche und Mitgliederliste oben */
}

.post:target .content {
	color: #000000;
}

.post:target h3 a {
	color: #000000;
}

.bg1	{ background-color: #FDFACA; }
.bg2	{ background-color: #FFF5CD;  }
.bg3	{ background-color: #DED0AB; }

.ucprowbg {
	background-color: #DCDEE2;
}

.fieldsbg {
	background-color: #E7E8EA;
}

span.corners-top {
	background-image: url("{T_THEME_PATH}/images/corners_left.png");
}

span.corners-top span {
	background-image: url("{T_THEME_PATH}/images/corners_right.png");
}

span.corners-bottom {
	background-image: url("{T_THEME_PATH}/images/corners_left.png");
}

span.corners-bottom span {
	background-image: url("{T_THEME_PATH}/images/corners_right.png");
}

/* Horizontal lists
----------------------------------------*/

ul.navlinks {
	border-bottom-color: #91694A;						/* Streifen zwischen Foren Übersicht und Persönlicher Bereich */
}

/* Table styles
----------------------------------------*/
table.table1 thead th {
	color: #F8E9C2;
}

table.table1 tbody tr {
	border-color: #000000;
}

table.table1 tbody tr:hover, table.table1 tbody tr.hover {
	background-color: #DEB887;                  /*Tabelle (Mitgliederliste und Team) beim Mouseover */
	color: #000;
}

table.table1 td {
	color: #000000;                             /* Inhalt der Tabelle bei Mitgliederliste (Beiträge, Wohnort, Registriert, Letzte Antort */
}

table.table1 tbody td {
	border-top-color: #000000;
}

table.table1 tbody th {
	border-bottom-color: #000000;
	color: #333333;
	background-color: #F8E9C2;
}

table.info tbody th {
	color: #000000;
}

/* Misc layout styles
---------------------------------------- */
dl.details dt {
	color: #000000;
}

dl.details dd {
	color: #536482;
}

.sep {
	color: #1198D9;
}

/* Pagination
---------------------------------------- */

.pagination span strong {
	color: #F7E9C4;							/* Aktuell Ausgewählte Seite (1,2,3,4...( */
	background-color: #B51113;				/* Aktuell Ausgewählte Seite Hintergrund */
	border-color: #B51113;					/* Aktuell Ausgewählte Seite Hintergrund Rand */
}

.pagination span a, .pagination span a:link, .pagination span a:visited, .pagination span a:active {
	color: #F7E9C4;							/* Seitenanzahl (außer aktuell gewählter Seite) Oben und unten rechts */
	background-color: #000000;				/* Seitenanzahl Hintergrund(außer aktuell gewählter Seite) Oben und unten rechts */
	border-color: #B51113;					/* Seitenanzahl Hintergrund Rand(außer aktuell gewählter Seite) Oben und unten rechts */
}

.pagination span a:hover {
	color: #F7E9C4;							/* Seitenanzahl Hintergrund Rand beim MouseOver (außer aktuell gewählter Seite) Oben und unten rechts */
	background-color: #000000;				/* Seitenanzahl Hintergrund beim MouseOver(außer aktuell gewählter Seite) Oben und unten rechts */
	border-color: #B51113;					/* Seitenanzahl beim MouseOver(außer aktuell gewählter Seite) Oben und unten rechts */
}

/* Pagination in viewforum for multipage topics */
.row .pagination {
	background-image: url("{T_THEME_PATH}/images/icon_pages.gif");
}

.row .pagination span a, li.pagination span a {
	background-color: #B51113;				/* Seitenanzahl Hintergrund(außer aktuell gewählter Seite) Forenübersicht */
}

.row .pagination span a:hover, li.pagination span a:hover {
	background-color: #DD6900;				/* Seitenanzahl Hintergrund beim MouseOver(außer aktuell gewählter Seite) Forenübersicht */
}

/* Miscellaneous styles
---------------------------------------- */

.copyright {
	color: #F8E9C2;							/* Copyright */
}

.error {
	color: #BC2A4D;							/* Error Meldungen z.B. falscher Login */
}

.reported {
	background-color: #F7ECEF;
}

li.reported:hover {
	background-color: #ECD5D8 !important;
}
.sticky, .announce {
	/* you can add a background for stickies and announcements*/
}

div.rules {
	background-color: #ECD5D8;
	color: #BC2A4D;
}

p.rules {
	background-color: #ECD5D8;
	background-image: none;
}

/*  	
--------------------------------------------------------------
Colours and backgrounds for links.css
-------------------------------------------------------------- */

a:link	{ color: #B51113; }
a:visited	{ color: #B51113; }
a:hover	{ color: #D31141; }
a:active	{ color: #DD6900; }

/* Links on gradient backgrounds */
#search-box a:link, .navbg a:link, .forumbg .header a:link, .forabg .header a:link, th a:link {
	color: #B51113;									/* Linkfarbe in Rahmen */
}

#search-box a:visited, .navbg a:visited, .forumbg .header a:visited, .forabg .header a:visited, th a:visited {
	color: #B51113;/* Linkfarbe im Rahmen nach Besuch */
}

#search-box a:hover, .navbg a:hover, .forumbg .header a:hover, .forabg .header a:hover, th a:hover {
	color: #D31141;/* Linkfarbe im Rahmen beim MouseOver */
}

#search-box a:active, .navbg a:active, .forumbg .header a:active, .forabg .header a:active, th a:active {
	color: #DD6900;/* Linkfarbe im Rahmen beim Klicken */
}

/* Links for forum/topic lists */
a.forumtitle {
	color: #B51113;
}

/* a.forumtitle:visited { color: #B51113; } */

a.forumtitle:hover {
	color: #BC2A4D;
}

a.forumtitle:active {
	color: #B51113;
}

a.topictitle {
	color: #B51113;/* Themenüberschrift */
}

/* a.topictitle:visited { color: #DD6900; } */

a.topictitle:hover {
	color: #BC2A4D;/* Themenüberschrift bei MouseOver*/
}

a.topictitle:active {
	color: #B51113;/* Themenüberschrift beim Klicken */
}

/* Post body links */
.postlink {
	color: #DD6900;
	border-bottom-color: #DD6900;
}

.postlink:visited {
	color: #5D8FBD;
	border-bottom-color: #666666;
}

.postlink:active {
	color: #DD6900;
}

.postlink:hover {
	background-color: #D0E4F6;
	color: #0D4473;
}

.signature a, .signature a:visited, .signature a:active, .signature a:hover {
	background-color: transparent;		/* Signaturlinks */
}

/* Profile links */
.postprofile a:link, .postprofile a:active, .postprofile a:visited, .postprofile dt.author a {
	color: #B51113;/* Link zum Profil (Benutzername) unter Avatar, Avatarlink selbst ohne Grafiken */
}

.postprofile a:hover, .postprofile dt.author a:hover {
	color: #D31141;/* Link zum Profil (Benutzername) unter Avatar, Avatarlink selbst ohne Grafiken beim MouseOver*/
}

/* Profile searchresults */	
.search .postprofile a {
	color: #B51113;
}

.search .postprofile a:hover {
	color: #D31141;
}

/* Back to top of page */
a.top {
	background-image: url("{IMG_ICON_BACK_TOP_SRC}");
}

a.top2 {
	background-image: url("{IMG_ICON_BACK_TOP_SRC}");
}

/* Arrow links  */
a.up		{ background-image: url("{T_THEME_PATH}/images/arrow_up.gif") }
a.down		{ background-image: url("{T_THEME_PATH}/images/arrow_down.gif") }
a.left		{ background-image: url("{T_THEME_PATH}/images/arrow_left.gif") }
a.right		{ background-image: url("{T_THEME_PATH}/images/arrow_right.gif") }

a.up:hover {
	background-color: transparent;
}

a.left:hover {
	color: #DD6900;
}

a.right:hover {
	color: #DD6900;
}


/*  	
--------------------------------------------------------------
Colours and backgrounds for content.css
-------------------------------------------------------------- */

ul.forums {
	background-image: url("{T_THEME_PATH}/images/gradient.gif");
}

ul.topiclist li {
	color: #000000;/* Beschreibung für Subforen, Zugriffe, Antworten, Daten (Foren) */
}

ul.topiclist dd {
	border-left-color: #91694A;/* Trennlinien zwischen Themen, Beiträgen, Letzter Beitrag */
}

.rtl ul.topiclist dd {
	border-right-color: #fff;
	border-left-color: transparent;
}

ul.topiclist li.row dt a.subforum.read {
	background-image: url("{IMG_SUBFORUM_READ_SRC}");
}

ul.topiclist li.row dt a.subforum.unread {
	background-image: url("{IMG_SUBFORUM_UNREAD_SRC}");
}

li.row {
	border-top-color:  #91694A;/* Linien zwischen den Foren und Themen */
	border-bottom-color: #91694A;/* Linien zwischen den Foren und Themen */
}

li.row strong {
	color: #000000;/* Moderator eines Forums, [...] bei Seitenanzahl von Antworten */
}

li.row:hover {
	background-color: #F6F4D0;/* Farbänderung beim MouseOver von Themen und Foren */
}

li.row:hover dd {
	border-left-color: #91694A;/* Trennlinien zwischen Themen, Beiträgen, Letzter Beitrag bei MouseOver*/
}

.rtl li.row:hover dd {
	border-right-color: #000000;
	border-left-color: transparent;
}

li.header dt, li.header dd {
	color: #F9F9F9;/* Überschrift der Spalten (Themen, Beiträge, Antworten, Zugriffe, Letzter Beitrag */
}

/* Forum list column styles */
ul.topiclist dd.searchextra {
	color: #333333;
}

/* Post body styles
----------------------------------------*/
.postbody {
	color: #333333;						/* von, wann und Signatur im Beitrag */
}

/* Content container styles
----------------------------------------*/
.content {
	color: #333333;/* Beitragsinhalt */
}

.content h2, .panel h2 {
	color: #000000;
	border-bottom-color:  #000000;
}

dl.faq dt {
	color: #333333;	/*FAQ kleine Überschriften */
}

.posthilit {
	background-color: #F3BFCC;
	color: #BC2A4D;
}

/* Post signature */
.signature {
	border-top-color: #91694A;/* Linie zwischen Beitrag und Signatur */
}

/* Post noticies */
.notice {
	border-top-color:  #91694A;/* Linie über "zuletzt geändert von" */
}

/* BB Code styles
----------------------------------------*/
/* Quote block */
blockquote {
	background-color: #EBEADD;/* Hintergrund eines Zitates */
	background-image: url("{T_THEME_PATH}/images/quote.gif");/* Hintergrundbild eines Zitates */
	border-color:#DBDBCE;/* Rahmenfarbe eines Zitates */
}

blockquote blockquote {
	/* Nested quotes */
	background-color:#EFEED9;/* Hintergrund eines Zitates in einem Zitat */
}

blockquote blockquote blockquote {
	/* Nested quotes */
	background-color: #EBEADD;/* Hintergrund eines Zitates in einem Zitat in einem Zitat */
}

/* Code block */
dl.codebox {
	background-color: #F8E9C2;/* Hintergrund der Codebox */
	border-color: #C9D2D8;/* Rahmen des Codeblockes */
}

dl.codebox dt {
	border-bottom-color:  #000000;
}

dl.codebox code {
	color: #2E8B57;/* Codebox Textfarbe */
}

.syntaxbg		{ color: #F8E9C2; }
.syntaxcomment	{ color: #FF8000; }
.syntaxdefault	{ color: #0000BB; }
.syntaxhtml		{ color: #000000; }
.syntaxkeyword	{ color: #007700; }
.syntaxstring	{ color: #DD0000; }

/* Attachments
----------------------------------------*/
.attachbox {
	background-color: #F8E9C2;
	border-color:  #C9D2D8;
}

.pm-message .attachbox {
	background-color: #F2F3F3;
}

.attachbox dd {
	border-top-color: #C9D2D8;
}

.attachbox p {
	color: #666666;
}

.attachbox p.stats {
	color: #666666;
}

.attach-image img {
	border-color: #999999;
}

/* Inline image thumbnails */

dl.file dd {
	color: #666666;
}

dl.thumbnail img {
	border-color: #666666;
	background-color: #F8E9C2;
}

dl.thumbnail dd {
	color: #666666;
}

dl.thumbnail dt a:hover {
	background-color: #EEEEEE;
}

dl.thumbnail dt a:hover img {
	border-color: #DD6900;
}

/* Post poll styles
----------------------------------------*/

fieldset.polls dl {
	border-top-color: #DCDEE2;
	color: #666666;
}

fieldset.polls dl.voted {
	color: #000000;
}

fieldset.polls dd div {
	color: #F8E9C2;
}

.rtl .pollbar1, .rtl .pollbar2, .rtl .pollbar3, .rtl .pollbar4, .rtl .pollbar5 {
	border-right-color: transparent;
}

.pollbar1 {
	background-color: #AA2346;
	border-bottom-color: #74162C;
	border-right-color: #74162C;
}

.rtl .pollbar1 {
	border-left-color: #74162C;
}

.pollbar2 {
	background-color: #BE1E4A;
	border-bottom-color: #8C1C38;
	border-right-color: #8C1C38;
}

.rtl .pollbar2 {
	border-left-color: #8C1C38;
}

.pollbar3 {
	background-color: #D11A4E;
	border-bottom-color: #AA2346;
	border-right-color: #AA2346;
}

.rtl .pollbar3 {
	border-left-color: #AA2346;
}

.pollbar4 {
	background-color: #E41653;
	border-bottom-color: #BE1E4A;
	border-right-color: #BE1E4A;
}

.rtl .pollbar4 {
	border-left-color: #BE1E4A;
}

.pollbar5 {
	background-color: #F81157;
	border-bottom-color: #D11A4E;
	border-right-color: #D11A4E;
}

.rtl .pollbar5 {
	border-left-color: #D11A4E;
}

/* Poster profile block
----------------------------------------*/
.postprofile {
	color: ##DEB887;/* Beitragszahl, Registrationsdatum, Wohnort unterm Avatar (Anzahl,  Daten etc.)*/
	border-left-color: #91694A;/* vertikaler Streifen am Rand neben dem Avatar */
}

.rtl .postprofile {
	border-right-color: #F8E9C2;
	border-left-color: transparent;
}

.pm .postprofile {
	border-left-color: #91694A;/* vertikaler Streifen am Rand neben dem Avatar */
}

.rtl .pm .postprofile {
	border-right-color: #DDDDDD;
	border-left-color: transparent;
}

.postprofile strong {
	color: #000000;/* Beiträge, Registriert und Wohnort unterm Avatar*/
}

.online {
	background-image: url("{T_IMAGESET_LANG_PATH}/icon_user_online.gif");
}

/*  	
--------------------------------------------------------------
Colours and backgrounds for buttons.css
-------------------------------------------------------------- */

/* Big button images */
.reply-icon span	{ background-image: url("{IMG_BUTTON_TOPIC_REPLY_SRC}"); }
.post-icon span		{ background-image: url("{IMG_BUTTON_TOPIC_NEW_SRC}"); }
.locked-icon span	{ background-image: url("{IMG_BUTTON_TOPIC_LOCKED_SRC}"); }
.pmreply-icon span	{ background-image: url("{IMG_BUTTON_PM_REPLY_SRC}") ;}
.newpm-icon span 	{ background-image: url("{IMG_BUTTON_PM_NEW_SRC}") ;}
.forwardpm-icon span	{ background-image: url("{IMG_BUTTON_PM_FORWARD_SRC}") ;}

a.print {
	background-image: url("{T_THEME_PATH}/images/icon_print.gif");
}

a.sendemail {
	background-image: url("{T_THEME_PATH}/images/icon_sendemail.gif");
}

a.fontsize {
	background-image: url("{T_THEME_PATH}/images/icon_fontsize.gif");
}

/* Icon images
---------------------------------------- */
.sitehome						{ background-image: url("{T_THEME_PATH}/images/icon_home.gif"); }
.icon-faq						{ background-image: url("{T_THEME_PATH}/images/icon_faq.gif"); }
.icon-members					{ background-image: url("{T_THEME_PATH}/images/icon_members.gif"); }
.icon-home						{ background-image: url("{T_THEME_PATH}/images/icon_home.gif"); }
.icon-ucp						{ background-image: url("{T_THEME_PATH}/images/icon_ucp.gif"); }
.icon-register					{ background-image: url("{T_THEME_PATH}/images/icon_register.gif"); }
.icon-logout					{ background-image: url("{T_THEME_PATH}/images/icon_logout.gif"); }
.icon-bookmark					{ background-image: url("{T_THEME_PATH}/images/icon_bookmark.gif"); }
.icon-bump						{ background-image: url("{T_THEME_PATH}/images/icon_bump.gif"); }
.icon-subscribe					{ background-image: url("{T_THEME_PATH}/images/icon_subscribe.gif"); }
.icon-unsubscribe				{ background-image: url("{T_THEME_PATH}/images/icon_unsubscribe.gif"); }
.icon-pages						{ background-image: url("{T_THEME_PATH}/images/icon_pages.gif"); }
.icon-search					{ background-image: url("{T_THEME_PATH}/images/icon_search.gif"); }

/* Profile & navigation icons */
.email-icon, .email-icon a		{ background-image: url("{IMG_ICON_CONTACT_EMAIL_SRC}"); }
.aim-icon, .aim-icon a			{ background-image: url("{IMG_ICON_CONTACT_AIM_SRC}"); }
.yahoo-icon, .yahoo-icon a		{ background-image: url("{IMG_ICON_CONTACT_YAHOO_SRC}"); }
.web-icon, .web-icon a			{ background-image: url("{IMG_ICON_CONTACT_WWW_SRC}"); }
.msnm-icon, .msnm-icon a			{ background-image: url("{IMG_ICON_CONTACT_MSNM_SRC}"); }
.icq-icon, .icq-icon a			{ background-image: url("{IMG_ICON_CONTACT_ICQ_SRC}"); }
.jabber-icon, .jabber-icon a		{ background-image: url("{IMG_ICON_CONTACT_JABBER_SRC}"); }
.pm-icon, .pm-icon a				{ background-image: url("{IMG_ICON_CONTACT_PM_SRC}"); }
.quote-icon, .quote-icon a		{ background-image: url("{IMG_ICON_POST_QUOTE_SRC}"); }

/* Moderator icons */
.report-icon, .report-icon a		{ background-image: url("{IMG_ICON_POST_REPORT_SRC}"); }
.edit-icon, .edit-icon a			{ background-image: url("{IMG_ICON_POST_EDIT_SRC}"); }
.delete-icon, .delete-icon a		{ background-image: url("{IMG_ICON_POST_DELETE_SRC}"); }
.info-icon, .info-icon a			{ background-image: url("{IMG_ICON_POST_INFO_SRC}"); }
.warn-icon, .warn-icon a			{ background-image: url("{IMG_ICON_USER_WARN_SRC}"); } /* Need updated warn icon */

/*  	
--------------------------------------------------------------
Colours and backgrounds for cp.css
-------------------------------------------------------------- */

/* Main CP box
----------------------------------------*/

#cp-main h3, #cp-main hr, #cp-menu hr {
	border-color: #91694A;/* horizontale Linien unter kleinen Überschriften (Persönlicher Bereich unter "Deine Aktivität" und Moderations-Bereich unter "Die letzten 5 Beiträge...", in diesen Bereichen) */
}

#cp-main .panel li.row {
	border-bottom-color: #91694A;/* Im Persönlicher Bereich unter Benutzergruppe, horizontale Linie zwischen den einzelnen Gruppen */
	border-top-color: #91694A;/* Im Persönlicher Bereich unter Benutzergruppe, horizontale Linie zwischen den einzelnen Gruppen */
}

ul.cplist {
	border-top-color: #91694A;/* Im Persönlicher Bereich unter Benutzergruppe, horizontale Linie zwischen den einzelnen Gruppen */
}

#cp-main .panel li.header dd, #cp-main .panel li.header dt {
	color: #000000;/* Benutzergruppe Überschriften (Gruppen-Leiter und Mitgliedschaften) */
}

#cp-main table.table1 thead th {
	color: #333333;/* Moderationsbereich (Überschriften in Tabellen (Vorgang, Benutzername etc) */
	border-bottom-color: #91694A;/* Horizontale Linie unter den Überschriften */
}

#cp-main .pm-message {
	border-color: #DBDEE2;
	background-color: #F8E9C2;
}

/* CP tabbed menu
----------------------------------------*/
#tabs a {
	background-image: url("{T_THEME_PATH}/images/bg_tabs1.gif");
}

#tabs a span {
	background-image: url("{T_THEME_PATH}/images/bg_tabs2.gif");
	color: #FF3333;/* Moderations- und Persönlicher Bereich, Linkfarbe für die verschiedenen Bereiche (Profil, Einstellungen, Private Nachrichten, etc)*/
}

#tabs a:hover span {
	color: #BC2A4D;/* Moderations- und Persönlicher Bereich, Linkfarbe für die verschiedenen Bereiche bei MouseOver (Profil, Einstellungen, Private Nachrichten, etc)*/
}

#tabs .activetab a {
	border-bottom-color: #91694A;/* horizontale Linie unter dem gewählten Bereich, in welchem man gerade ist (gilt für Tabs wie oben) */
}

#tabs .activetab a span {
	color: #333333;/* Moderations- und Persönlicher Bereich, Linkfarbe für die verschiedenen Bereiche wenn man im Bereich ist (Profil, Einstellungen, Private Nachrichten, etc)*/
}

#tabs .activetab a:hover span {/* Moderations- und Persönlicher Bereich, Linkfarbe für die verschiedenen Bereiche bei MouseOver (Profil, Einstellungen, Private Nachrichten, etc)*/
	color: #000000;
}

/* Mini tabbed menu used in MCP
----------------------------------------*/
#minitabs li {
	background-color: #FFF5CD;
}

#minitabs li.activetab {
	background-color: #DEB887;     /* Inaktiver Tab Forenübersicht */
}

#minitabs li.activetab a, #minitabs li.activetab a:hover {
	color: #333333;
}

/* UCP navigation menu
----------------------------------------*/

/* Link styles for the sub-section links */
#navigation a {
	color: #333;/* Persöhnlicher Bereich und Moderationsbereich, Sublinks (stehen links unter den TabLinks) */
	background-color: #F8E9C2;/* Hintergrund für die Sublinks */
	background-image: url("{T_THEME_PATH}/images/bg_menu.gif");
}

#navigation a:hover {
	background-color: #DEB887;/* Hintergrund für die Sublinks beim MouseOver*/
	color: #BC2A4D;/* Persönlicher Bereich und Moderationsbereich, Sublinks (stehen links unter den TabLinks) beim MouseOver*/
}

#navigation #active-subsection a {
	color: #D31141;/* Farbe des Gewählten Sublinks */
	background-color: #F7E9C4;/* Hintergrund des gewählten Sublinks */
	background-image: none;
}

#navigation #active-subsection a:hover {
	color: #D31141;/* Farbe des Gewählten Sublinks beim MouseOver */ 
}

/* Preferences pane layout
----------------------------------------*/
#cp-main h2 {
	color: #000000;/* Farbe der Überschriften im Persönlichen Bereich und Moderationsbereich */
}

#cp-main .panel {
	background-color: #F8E9C2;/* Hintergrundfarbe im persönlichen Bereich/Moderationsbereich */
}

#cp-main .pm {
	background-color: #F8E9C2;/* Hintergrundfarbe von PN´s */
}

#cp-main span.corners-top, #cp-menu span.corners-top {
	background-image: url("{T_THEME_PATH}/images/corners_left2.gif");
}

#cp-main span.corners-top span, #cp-menu span.corners-top span {
	background-image: url("{T_THEME_PATH}/images/corners_right2.gif");
}

#cp-main span.corners-bottom, #cp-menu span.corners-bottom {
	background-image: url("{T_THEME_PATH}/images/corners_left2.gif");
}

#cp-main span.corners-bottom span, #cp-menu span.corners-bottom span {
	background-image: url("{T_THEME_PATH}/images/corners_right2.gif");
}

/* Topicreview */
#cp-main .panel #topicreview span.corners-top, #cp-menu .panel #topicreview span.corners-top {
	background-image: url("{T_THEME_PATH}/images/corners_left.gif");
}

#cp-main .panel #topicreview span.corners-top span, #cp-menu .panel #topicreview span.corners-top span {
	background-image: url("{T_THEME_PATH}/images/corners_right.gif");
}

#cp-main .panel #topicreview span.corners-bottom, #cp-menu .panel #topicreview span.corners-bottom {
	background-image: url("{T_THEME_PATH}/images/corners_left.gif");
}

#cp-main .panel #topicreview span.corners-bottom span, #cp-menu .panel #topicreview span.corners-bottom span {
	background-image: url("{T_THEME_PATH}/images/corners_right.gif");
}

/* Friends list */
.cp-mini {
	background-color: #eef5f9;
	background-image: url("{T_THEME_PATH}/images/background.jpg");
}

dl.mini dt {
	color: #425067;
}

/* PM Styles
----------------------------------------*/
/* PM Message history */
.current {
	color: #999999 !important;/*PM Nachricht History, wenn auf eine PN geantwortet wird, wird der Text der vorhergegangenen PN in dieser Farbe angezeigt */
}

/* PM marking colours */
.pmlist li.pm_message_reported_colour, .pm_message_reported_colour {
	border-left-color: #BC2A4D;/* Wenn eine PN gemeldet wird, hat sie Links diese Farbe */
	border-right-color: #BC2A4D;/* Wenn eine PN gemeldet wird, hat sie Rechts diese Farbe */
}

.pmlist li.pm_marked_colour, .pm_marked_colour {
	border-color: #FF6600;/* Wenn eine PN markiert wird, hat sie eine Umrandung in dieser Farbe */
}

.pmlist li.pm_replied_colour, .pm_replied_colour {
	border-color: #990000;/* Wenn auf eine PN geantwortet wird, hat sie eine Umrandung in dieser Farbe */
}

.pmlist li.pm_friend_colour, .pm_friend_colour {
	border-color: #FF0000;/* Wenn auf eine PN eines Freundes ankommt, hat sie eine Umrandung in dieser Farbe */
}

pmlist li.pm_foe_colour, .pm_foe_colour {
	border-color: #000000;
}

/* Avatar gallery */
#gallery label {
	background-color: #F8E9C2;
	border-color: #CCC;
}

#gallery label:hover {
	background-color: #EEE;
}

/*  	
--------------------------------------------------------------
Colours and backgrounds for forms.css
-------------------------------------------------------------- */

/* General form styles
----------------------------------------*/
select {
	border-color: #91694A;/* Rand der Auswahlboxen in Subforen und Beiträgen, z.B. Gehe zu: */
	background-color: #F7E9C4;/* Hintergrundfarbe in den Auswahlboxen in Subforen und Beiträgen, z.B. Gehe zu: */
}

label {
	color: #000000;/* Beschreibung vor den Auswahlboxen */
}

option.disabled-option {
	color: graytext;
}

/* Definition list layout for forms
---------------------------------------- */
dd label {
	color: #333;/* "Entweder-oder" Optionen Antworten im Persönlichen Bereich (Ja/Nein) */
}

/* Hover effects */
fieldset dl:hover dt label {/* Farbe des "Entweder-Oder" Textes (z.B. Benachrichtige mich über neue Nachrichten:) beim MouseOver */
	color: #000000;
}

fieldset.fields2 dl:hover dt label {/* Farbe des "Entweder-Oder" Textes (z.B. Benachrichtige mich über neue Nachrichten:) beim MouseOver */
	color: inherit;
}

/* Quick-login on index page */
fieldset.quick-login input.inputbox {
	background-color: #F7E9C4;/* Hintergrund derAnmeldebox auf der Index Seite */
}

/* Posting page styles
----------------------------------------*/

#message-box textarea {
	color: #000000;/* Schriftfarbe beim Post erstellen */
}

/* Input field styles
---------------------------------------- */
.inputbox {
	background-color: #F8E9C2;/* "Forum/Thema durchsuchen"-Box Hintergrundfarbe */
	border-color: #961138;/* "Forum/Thema durchsuchen"-Box Umrandungsfarbe */
	color: #000000;/* "Forum/Thema durchsuchen"-Box Textfarbe */
}

.inputbox:hover {
	border-color: #FF0000;/* "Forum und Thema durchsuchen"-Box Umrandungsfarbe bei MouseOver */
}

.inputbox:focus {
	border-color: #F7E9C4;/* "Forum/Thema durchsuchen"-Box Umrandungsfarbe wenn die Box gewählt wird*/
	color: #000000;/* "Forum/Thema durchsuchen"-Box Textfarbe, wenn die Box gewählt wird */
}

/* Form button styles
---------------------------------------- */

a.button1, input.button1, input.button3, a.button2, input.button2 {
	color: #000000;/* Farbe des Suche und Los Buttons */
	background-color: #FAFAFA;/* Hintergrundfarbe des Suche und Los Buttons, nicht sichtbar wenn Hintergrund Bild Gewählt ist */
	background-image: url("{T_THEME_PATH}/images/bg_button.gif");
}

a.button1, input.button1 {
	border-color: #B51113;/* Umrandung des Suche Buttons unter der "Erweiterte Suche" */
}

input.button3 {
	background-image: none;
}

/* Alternative button */
a.button2, input.button2, input.button3 {
	border-color: #B51113;/* Umrandungsfarbe des Suche und Los Buttons */
}

/* <a> button in the style of the form buttons */
a.button1, a.button1:link, a.button1:visited, a.button1:active, a.button2, a.button2:link, a.button2:visited, a.button2:active {
	color: #000000;
}

/* Hover states */
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, input.button3:hover {
	border-color: #BC2A4D;
	color: #BC2A4D;
}

input.search {
	background-image: url("{T_THEME_PATH}/images/icon_textbox_search.gif");
}

input.disabled {
	color: #666666;
}
MfG TheLuBu

systematic
Mitglied
Beiträge: 18
Registriert: 12.05.2008 14:52

Re: Colours.css! Was ist wofür?!!

Beitrag von systematic » 14.06.2009 13:14

Hi,

finde das auch klasse, wenn man noch weitere ergänzungen hat, per PN an dich ?
Wie schaut es eigentlich mit der gesamten, ich nenns mal "theme" aus ? gibts da auch
irgendwo was ? mich würden da noch die einzelnen Abstände und Borders etc. interessieren.
da ist mir auch vieles noch unklar,...

Greetz und lob an dich für die mühen ;-)


Spiderweb
Mitglied
Beiträge: 10
Registriert: 12.12.2007 02:33

Re: Colours.css! Was ist wofür?!!

Beitrag von Spiderweb » 02.08.2009 14:11

Code: Alles auswählen

/* Misc layout styles
---------------------------------------- */
dl.details dt {
	color: #ffffff;  /*Benuterprofil + Persönlicher Bereich: Schriftfarben "Benutzername, Gruppen, Email, PN, Registriert seit, letzte Anmeldung" */
}

dl.details dd {
	color: #ffffff;   /*Benuterprofil + Persönlicher Bereich: Schriftfarbe der Daten zu 'Benutzername, Registriert seit, letzte Anmeldung' */

Antworten

Zurück zu „[3.0.x] Styles, Templates und Grafiken“