[3.2] Style Anpassung Prosilver

Alles zu Styles, Templates, Icons und Smilies für phpBB 3.3, sowie allgemeine Designfragen zur Integration von phpBB in bestehende Websites.
Forumsregeln
Bei Style spezifischen Fragen ist der Stylename und die Downloadquelle des Styles erforderlich sowie die URL vom betroffenen Forum.
maerk72
Mitglied
Beiträge: 26
Registriert: 13.07.2017 20:03
Wohnort: Aargau (Schweiz)

[3.2] Style Anpassung Prosilver

Beitrag von maerk72 »

Hallo zusammen

habe ein paar Fragen:

wie und wo kann ich

1. einen Rahmen um die Titelleiste (wo das Logo drin ist) erstellen? Die Höhe der Leiste würde ich auch noch gerne halbieren.
2. einen Rahmen um die Navbar erstellen? @edit: ERLEDIGT
/theme/colours.css:

Code: Alles auswählen

.navbar {
  background-color: #F0F0F0;
  border: 1px solid #000000;
3. die Farbe des "Zwischenbalken" in der Navbar ändern
4. den Abstand unterhalb der Navbar inkl. "aktuelle Zeit" und "Dein letzter Besuch: ..." entfernen resp. maximal verkleinern

Freundliche Grüsse vom Süden
Benutzeravatar
Melmac
Ehemaliges Teammitglied
Beiträge: 3623
Registriert: 15.10.2012 03:27

Re: [3.2] Style Anpassung Prosilver

Beitrag von Melmac »

Hi,

1) => /styles/prosilver/theme/common.css, ab ~ Zeile 188

Code: Alles auswählen

.headerbar {
	margin-bottom: 4px;
	padding: 5px;
	border-radius: 7px;
}
Dort dann eine neue Eigenschaft border: hinzufügen.

3) => /styles/prosilver/theme/colours.css, ~ Zeile 158

Code: Alles auswählen

ul.navlinks {
	border-top-color: #FFFFFF;
}
4) => /styles/prosilver/theme/common.css, ~ Zeile 58
suche

Code: Alles auswählen

p {
	line-height: 1.3em;
	font-size: 1.1em;
	margin-bottom: 1.5em;
}
Da dies die allgemeine Formatierung für alle p-Elemente ist, muss das noch etwas eingegrenzt werden, um nur für dieses eine Element zu gelten, daher:
füge danach in einer neuen Zeile ein

Code: Alles auswählen

.page-body > p {
	margin-bottom: 0;
}
Statt 0 kannst Du auch jeden anderen Wert eingeben, der für Dich passender erscheint.
Handle nur nach derjenigen Maxime, durch die du zugleich wollen kannst, dass sie ein allgemeines Gesetz werde.
(Immanuel Kant)
maerk72
Mitglied
Beiträge: 26
Registriert: 13.07.2017 20:03
Wohnort: Aargau (Schweiz)

Re: [3.2] Style Anpassung Prosilver

Beitrag von maerk72 »

Danke, Melmac
werde es heute Abend versuchen :wink:

wie sieht es mit der Frage 2b aus?
Das Logo habe ich bereits erfolgreich entfernt, jetzt möchte ich gerne den "Header" in der Höhne um ca. die Hälfte verkleinern.

und bei 4:
muss ich da nicht noch irgendwo den Text "aktuelle Zeit" und "Dein letzter Besuch: ..." entfernen resp. deaktivieren?
Benutzeravatar
Melmac
Ehemaliges Teammitglied
Beiträge: 3623
Registriert: 15.10.2012 03:27

Re: [3.2] Style Anpassung Prosilver

Beitrag von Melmac »

Diese beiden Dinge gingen aus Deinem editierten Beitrag so nicht mehr hervor ... :wink:

1b)
Die Höhe der Headerbar richtet sich nach dem Platzbedarf der in ihr enthaltenen Elemente. Du kannst ihr zwar über die von Dir bereits gefundene Klasse trotzdem eine feste Höhe zuweisen, dies führt dann aber zu Darstellungproblemen, solange nicht auch diese anderen Elemente (Logo, Site Description, Search Box) entsprechend angepasst oder entfernt/ausgeblendet werden.
Vielleicht beschreibst Du einfach mal, wie Du die Headerbar samt "Inhalt" gestalten willst.

4)
ersetze den in meinem Post als einzufügen genannten Code

Code: Alles auswählen

.page-body > p {
   margin-bottom: 0;
}
durch

Code: Alles auswählen

.page-body > p {
   display: none;
}
----------------------------------------------

Tante Edith:

Modifizierst Du eigentlich die prosilver-Files direkt oder arbeitest Du mit einem auf prosilver basierenden Child-Style?
Handle nur nach derjenigen Maxime, durch die du zugleich wollen kannst, dass sie ein allgemeines Gesetz werde.
(Immanuel Kant)
maerk72
Mitglied
Beiträge: 26
Registriert: 13.07.2017 20:03
Wohnort: Aargau (Schweiz)

Re: [3.2] Style Anpassung Prosilver

Beitrag von maerk72 »

Guten Abend

Danke ... #2+3 hat alles geklappt

Betr. 1b Headerbar, möchte eigentlich nur noch die Search-Box drin haben. Die Grösse und Position möchte ich gerne beibehalten
Betr. 4 ist immer noch "Foren als gelesen markieren" aufgeführt, dies möchte ich auch noch gerne weg haben :D ; Sorry

... und noch betr. "Tante Edith":
arbeite mit einem prosilver basierenden "Child-Style"
erstellt nach Youtube Tutorial von "Lehrlings Tutorials" Link

Gibt es eine Möglichkeit, das Board Lokal auf dem PC zu installieren resp. zu testen?
Bei meinem Hoster geht es teilweise 5-8 Minuten bis die Daten auf dem Server aktualisiert werden ... da wird man ja Gaga :o :-? 8)
Benutzeravatar
Melmac
Ehemaliges Teammitglied
Beiträge: 3623
Registriert: 15.10.2012 03:27

Re: [3.2] Style Anpassung Prosilver

Beitrag von Melmac »

maerk72 hat geschrieben:Betr. 4 ist immer noch "Foren als gelesen markieren" aufgeführt, dies möchte ich auch noch gerne weg haben :D
:D

Wieder in der common.css:
suche

Code: Alles auswählen

.action-bar {
	font-size: 11px;
	margin: 4px 0;
}
danach in neuer Zeile einfügen

Code: Alles auswählen

.action-bar a.rightside {
	display: none;
}
Teste bitte aber durch, ob davon eventuell auch andere Elemente der Actionbar auf anderen Seiten betroffen sein könnten. Auf den ersten Blick habe ich zwar nichts gefunden, aber ... :wink:

Nur mal eine Frage: so ganz ohne Funktion ist dies, was jetzt ausgeblendet wurde, ja aber auch nicht. Soll diese Option jetzt wirklich komplett entfallen oder platzierst Du sie noch um?

maerk72 hat geschrieben:Gibt es eine Möglichkeit, das Board Lokal auf dem PC zu installieren resp. zu testen?
Klar geht das :wink:

Du brauchst hierfür nur einen lokal laufenden Webserver, z.B. XAMPP, den Du auf Deinem Rechner installierst (bitte auf die Version von XAMPP achten, da die angebotenen sich in der verwendeten PHP-Version unterscheiden).
Dort kannst Du dann phpBB entweder manuell (wie bei Deinem Hoster) installieren ...
... oder Du installierst dort zuerst phpBB QuickInstall: einmal eingerichtet und mit phpBB "gefüttert" stehen Dir Testboards in beliebiger Zahl und Ausstattung quasi "auf Knopfdruck" zur Verfügung.
Handle nur nach derjenigen Maxime, durch die du zugleich wollen kannst, dass sie ein allgemeines Gesetz werde.
(Immanuel Kant)
maerk72
Mitglied
Beiträge: 26
Registriert: 13.07.2017 20:03
Wohnort: Aargau (Schweiz)

Re: [3.2] Style Anpassung Prosilver

Beitrag von maerk72 »

nochmals, vielen Dank
Du hast mich gerettet, vor allem auch wegen der lokalen Version :grin:

wie kann ich das Problem wegen der "Headbar" noch lösen?
Da möchte ich eigentlich nur noch die Search-Box drin haben. Die Grösse und Position möchte ich gerne beibehalten.

Ich habe vor, das Forum komplett abzuspecken wo es nur geht.
Je weniger man anklicken kann umso besser :wink:
Das komplette Design möchte ich auf Black/White ändern.

Das Forum wird später quasi "Zweckentfremdet" eingesetzt, nur als Online-Informationsquelle für Mitarbeiter Verkauf, Werkstatt und Lager.
Benutzeravatar
Melmac
Ehemaliges Teammitglied
Beiträge: 3623
Registriert: 15.10.2012 03:27

Re: [3.2] Style Anpassung Prosilver

Beitrag von Melmac »

Du könntest, analog zu dem, was wir bei den anderen Punkten bereits gemacht haben, diejenigen Elemente, die Du nicht mehr in der Headerbar haben möchtest, ebenfalls via CSS "ausblenden" (besser: nicht mehr anzeigen lassen).

Logo und Boradname bzw. -beschreibung sitzen beide im Container site-description
in der common.css suche nach (~ Zeile 177)

Code: Alles auswählen

.site-description {
	float: left;
	width: 65%;
}
und ersetze dies durch

Code: Alles auswählen

.site-description {
	display: none;
	float: left;
	width: 65%;
}
Der komplette DIV site-description samt "Inhalt" wird dann nicht mehr angezeigt und ihr Platz freigegeben.

Die Headerbar "schrumpft" dadurch dann aber in der Höhe auf das Minimum, das die Search-Box benötigt. Um dies eventuell wieder zu korrigieren (immer noch in der common.css):
suche (ein paar Zeilen unter dem Code von oben)

Code: Alles auswählen

.headerbar {
	margin-bottom: 4px;
	padding: 5px;
	border-radius: 7px;
}
und füge dort eine neue Eigenschaft height: hinzu, der Du dann den gewünschten Wert in "px" zuweist.
Z.B.: height: 120px;
Handle nur nach derjenigen Maxime, durch die du zugleich wollen kannst, dass sie ein allgemeines Gesetz werde.
(Immanuel Kant)
maerk72
Mitglied
Beiträge: 26
Registriert: 13.07.2017 20:03
Wohnort: Aargau (Schweiz)

Re: [3.2] Style Anpassung Prosilver

Beitrag von maerk72 »

O.K., teste es wenn das verflixte XAMPP läuft
wie finde ich heraus welche Version ich benötige?
-> Habe es gefunden: 5.6.30

Sorry, bin jetzt total weg vom Thema ... (oder, eigentlich doch nicht :D)
Benutzeravatar
Melmac
Ehemaliges Teammitglied
Beiträge: 3623
Registriert: 15.10.2012 03:27

Re: [3.2] Style Anpassung Prosilver

Beitrag von Melmac »

Nö, ist immer noch on topic :wink:
Handle nur nach derjenigen Maxime, durch die du zugleich wollen kannst, dass sie ein allgemeines Gesetz werde.
(Immanuel Kant)
Antworten

Zurück zu „Styles, Templates und Grafiken“