GELÖST: .bg1 + .bg2 Farben ändern: Themen, Beitragsfelder

[semper]

Hi Zusammen

Es geht um die .bg1 und .bg2 Änderungen in der Datei colours.css bei einem eigenen Child-Theme von Prosilver.

Ich habe nach der YT Anleitung von Lehrling die Farb Veränderungen von der Themeübersicht sowie von den Beitragsfeldern (Posts)
und dem direkt daneben gelegenen Profilberreich (wo der Avatar, Username, Rang, Beitragszähler, u.s.w. ist) vorgenommen.
https://www.youtube.com/watch?v=EOkRFM90Og4

Folgende Probleme:

1. Das Beitragsfeld und der direkt daneben gelegende Profilbereich sollten zwei unterschiedliche Farben haben.
Das Beitragsfeld soll immer gelb und Profilbereich immer weiss sein.

2. Die gesammte Themeübersicht sollte weiss sein. Die Farben sollten immer die Gleichen sein; und nicht alternierend, so wie es standardmäßig vorgesehen ist.


Hat jemand eine Idee, wie ich das realsieren kann?


P.S.:
Ich habe von Kirk die Extension "Profil on de Leftside" (welche ich benützen möchte): http://reyno41.bplaced.net/phpbb/viewtopic.php?f=8&t=60
Dort hat es auch einen CSS Ordner, eventuell könnte man über diese Extension den Profilberreich weiss machen, aber wo genau...

[Kirk]

Hallo
Du könntest zwar in dieser css Datei profileleft.css einen background-color definieren, aber dieser würde die online Grafik verdecken.

[semper]

Hallo
Du könntest zwar in dieser css Datei profileleft.css einen background-color definieren, aber dieser würde die online Grafik verdecken.

Das "wer ist online"? Die Funktion habe ich im ACP deaktiviert.

Wo und wie genau definiere ich die BG color?

[Kirk]

Am besten du setzt es bei .postprofile { rein.

[semper]

Ich habe es versuche (siehe php-code unten); aber das Propblem ist, dass es nicht über die ganze Höhe un nicht über die ganze Breite geht.
Bei der breite hat es linke und rechts davon noch ein kleinen Abstand. Bei der Höhe fängt der BG-color genau bei Avatar an und hört bei
den Kontaktdaten auf, bei einem langen Post ist dann der Abstand nach unten entsprechen lang.

Ich habe jetzt das umgekehrte probiert, also anstatt vor .postprofile habe ich es vor .postbody getan, um die Farbe vom Post zu verändern.
Dort zeigt sich aber ein ähnliches Problem, die Farbe endet gleich mit dem Text.

Code: Alles auswählen

/* Profile on Leftsite css
---------------------------------------- */
.postbody {
   padding: 0;
   line-height: 1.48em;
   width: 76%;
   float: right;
   position: relative;
}

.postprofile {
   /* Also see tweaks.css */
   background-color: #99CCCC;
   margin: 5px 0 10px 0;
   min-height: 80px;
   border: 1px solid #ffffff;
   border-width: 0 1px 0 0;
   width: 22%;
   float: left;
   display: inline;
}

.online {
   background-position: 100% 0;
   background-size: 58px;
   background-image: url("./images/icon_user_online.gif");
   background-position: 18.5% 1px;
   background-repeat: no-repeat;
}

@media only screen and (max-width: 1050px), only screen and (max-device-width: 1050px) {
.postprofile {
   margin: 15px 0 0;
   width: 23%;
}
}

@media only screen and (max-width: 850px), only screen and (max-device-width: 850px) {
.online {
    background-image: url("./images/icon_user_online.gif");
    background-position: 19% 1px;
    background-repeat: no-repeat;
    background-size: 42px auto;
}
.postprofile {
    margin: 16px 0 0;
}
}

@media only screen and (max-width: 650px), only screen and (max-device-width: 650px) {
.online {
    background-image: url("./images/icon_user_online.gif");
    background-position: 100% 0;
    background-repeat: no-repeat;
    background-size: 40px;
}
.postprofile dt, .postprofile dd.profile-rank, .search .postprofile dd {
    display: block;
    margin: 0;
}
.post .postprofile {
    border-width: 0 0 1px;
    margin: 0 0 5px;
    min-height: 40px;
    overflow: hidden;
    padding-bottom: 5px;
    width: auto;
}
.postprofile, .postbody, .search .postbody {
    display: block;
    float: none;
    min-height: 0;
    padding: 0;
    width: auto;
}
.has-profile .post-buttons {
    right: 10px;
    top: -41px;
}
} 

[Talk19zehn]

Hi, mein Vorschlag lautet einen Farbverlauf von links nach rechts in den von dir gewünschten Klassen oder IDs anzuwenden. Nur so eine Idee ...

Beispiel:

Code: Alles auswählen

.bg1 {
	background-color: #FCFACE; /* ... browsers */
	background: -moz-linear-gradient(left, #FCFACE 20%, #FAFAFA 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(20%,#FCFACE), color-stop(100%,#FAFAFA)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left, #FCFACE 20%,#FAFAFA 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left, #FCFACE 20%,#FAFAFA 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(left, #FCFACE 20%,#FAFAFA 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FCFACE', endColorstr='#FAFAFA',GradientType=1 ); /* IE6-9 */
	background: linear-gradient(left, #FCFACE 20%,#FAFAFA 100%); /* W3C */
}

, ggf. weniger arbeitsintensiv. Schaue es dir mal an ...

LG

[semper]

Danke Talk19zehn
Das ist eine gute Lösung für mein Problem.