Seite 1 von 1

[3.2] Anpasssungswünsche für den style revolution

Verfasst: 25.11.2017 05:46
von chris1278
Es handelt sich den Style "Revolution" aus der Style-Datenbank von phpbb.com

Hier zum Style auf Phpbb.com

Ich hätte die optik gerne etwas angepasst duch grafiken wie ich schon vorbereitet habe.

Siehe hier [ externes Bild ] und Hier: [ externes Bild ]

Wenn mir da jemand weiterhelfen könnte wäre ich sehr dankbar.

mfg

Re: [3.2] Anpasssungswünsche für den style revolution

Verfasst: 25.11.2017 08:36
von chris1278
So zwei sachen habe ich schon gefunden.

Um als Hintergrund ein Bild einzufügen:

In der coulours.css

suche folgendes:

Code: Alles auswählen

html, body {
	color: #5f6476;
	background-color: #2b2b2b;
}
ersetze mit:

Code: Alles auswählen

html, body {
	color: #5f6476;
	background-image: url("./images/background.gif");
}
Wobei hier der Pfad nur als Beispiel dient der Dateiname kann auch anders heissen je nachdem welches Bild man laden will.

Und für die Breite zu ändern:


In der common.css

finde:
.wrap {
border-radius: 10px;
border-style: solid;
border-width: 5px;
margin: 0 auto;
max-width: 800px;
padding: 5px 14px 5px 12px;
}

Passe dort den Wert "max-width: 800px;" an. anstelle 800 z.B. 1000 dann verbreitert es das Forum.

So fehlt nur noch der Rest

Re: [3.2] Anpasssungswünsche für den style revolution

Verfasst: 25.11.2017 08:37
von Lehrling
Finde in dem colours.css folgende Stellen und ändere sie entsprechend um:

Code: Alles auswählen

ul.forums {
	background-color: #EEF5F9; /* Old browsers */ /* FF3.6+ */
	background-image: -webkit-linear-gradient(top, #D2E0EB 0%, #EEF5F9 100%);
	background-image: linear-gradient(to bottom, #D2E0EB 0%,#EEF5F9 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#D2E0EB', endColorstr='#EEF5F9',GradientType=0 ); /* IE6-9 */
}

Code: Alles auswählen

li.row:hover {
	background-color: #F6F4D0;
}

Re: [3.2] Anpasssungswünsche für den style revolution

Verfasst: 25.11.2017 15:21
von chris1278
Hallo Lehrling.

Das hier:

Code: Alles auswählen

li.row:hover {
   background-color: #F6F4D0;
}
Hab ich gefunden funktioniert auch. Effekt ist das dies die Farbangabe ist wenn man da mit der maus drauf fährt. Wo ist die farbe bevor man mit der maus drüber fährt.


Wie mus ich diesen code hier ersetzen:

Code: Alles auswählen

ul.forums {
   background-color: #EEF5F9; /* Old browsers */ /* FF3.6+ */
   background-image: -webkit-linear-gradient(top, #D2E0EB 0%, #EEF5F9 100%);
   background-image: linear-gradient(to bottom, #D2E0EB 0%,#EEF5F9 100%); /* W3C */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#D2E0EB', endColorstr='#EEF5F9',GradientType=0 ); /* IE6-9 */
}
Mein Ziel ist es eine Gif Grafik über den Forum anzubringen die etwa 60-70% der breite des bildschirms entspricht.

Also währen da angaben von:

Ausrichtung: ?
Höhe ?
Breite?
Ausdehnung auf Bildschirm links und rechts
Pfadangabe zur Datei denke ich müsste dann so aussehen: "background-image: url("./images/logo_header.gif");

Danke auf jeden fall für deine bzw. eure Hilfe.

Re: [3.2] Anpasssungswünsche für den style revolution

Verfasst: 25.11.2017 16:15
von Lehrling
Schau mal, ob dir dieses Video weiter hilft:
https://www.youtube.com/watch?v=cAXVO3A ... s&index=38

Re: [3.2] Anpasssungswünsche für den style revolution

Verfasst: 25.11.2017 17:06
von chris1278
OK. Da sind einige Videos ich denke da komme ich schon mal ein ganz Stück mit weiter. Wenn noch was ist melod ich mich wieder.

Re: [3.2] Anpasssungswünsche für den style revolution

Verfasst: 26.11.2017 03:45
von chris1278
Danke Lehrling für die Videos. Dadurch hab ich einiges begriffen.

Aber ich finde immer noch nicht die eine Stelle wo das hier geeändert wird.

[ externes Bild ]

Die Farbeinstellung wo sich dort die Farbe ändert wenn man mit der Maus drüber fährt (hover effekt) hab ich gefunden.

Re: [3.2] Anpasssungswünsche für den style revolution

Verfasst: 26.11.2017 04:34
von vfrblue
Hallo,
öffne die colours.css und suche

Code: Alles auswählen

ul.forums {
    background-color: #EEF5F9;
    background-image: -webkit-linear-gradient(top, #D2E0EB 0%, #EEF5F9 100%);
    background-image: linear-gradient(to bottom, #D2E0EB 0%,#EEF5F9 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#D2E0EB', endColorstr='#EEF5F9',GradientType=0 );
}
Müsste ungefähr Zeile 316 sein. Hier kannst du dann die Farbe anpassen.
Wenn du den Farb-Effekt beibehalten möchtest, musst du beim background-image den Farbverlauf ändern. Möchtest du eine "statische" Farbe, dann background-color anpassen und 1x background-image ändern in

Code: Alles auswählen

background-image: none;
Den 2. "background"-Wert und den "filter" kannst du löschen.

Re: [3.2] Anpasssungswünsche für den style revolution

Verfasst: 26.11.2017 05:34
von chris1278
ok. danke das hat weiter geholfen. Hab einfach bei den Farbverläufen alle vier werte Gleich gesetzt.


PS: Ich finde diese Videos echt hilfreich. Da lernt so einer wie ich ja doch noch etwas.