[THEME] Log (bez. Bildschirmbreite)

Post Reply
donsenilo
Sr. Bludit
Posts: 38
Joined: Fri Nov 18, 2016 12:18 am

Sun Apr 02, 2017 10:20 pm

Hi

wie kann man dieses Theme so ändern, dass es nicht schon bei einer Bildschirmbreite von 1280px "umschaltet" ?
Soll heissen: Auf meinem Hauptmonitor mit einer Breite von 1920px wird die Seite normal angezeigt (links das Menü, rechts daneben der jeweilige Seiteninhalt). Auf meinem 2ten Monitor mit 1280px verschwindet das Menü.
Ich hätte gerne, dass das Layout auch bei 1280px noch bestehen bleibt. Ist das überhaupt machbar ?
Es gibt etliche Einträge in der main.css wie z.B.:

Code: Select all

@media screen and (max-width: 480px)
jedoch blicke ich bei den jeweils darauffolgenden Angaben nicht wirklich durch.
User avatar
Edi
Site Admin
Posts: 1300
Joined: Sun Aug 09, 2015 5:01 pm
Location: Zurich
Contact:

Mon Apr 03, 2017 1:30 am

Ich glaube, da bestehen ein paar begriffliche Unklarheiten... Normal wird die Website immer angezeigt und es verschwindet nichts. Was passiert ist, dass bei Bildgschirmen mit einer Breite von 1280 Pixel und weniger ein Teil der Seitenleiste unter den Hauptteil "geschoben" wird, um die Website auf Tablets und Smartphones vernünftig anzuzeigen.

Dieser "Breakpoint" kann anders gesetzt werden. Verantwortlich dafür ist die Definition in der Datei main.css (Zeile 3181):

Code: Select all

		@media screen and (max-width: 1280px) {

			#wrapper {
				display: block;
			}

		}
Hier wird, was vorher als Flexboxen nebeneinander gesetzt ist, mit der Anweisung "display: block" untereinander gesetzt.

Mit dem Plugin Custom CSS könnte das mit einem Eintrag wie beispielsweise dem folgenden "aufgefangen" werden:

Code: Select all

@media screen and (min-width: 1024px) {

   #wrapper {
      display: flex;
   }

}
Es müsste dann auch noch die Breite für die Seitenleiste angepasst werden.

Das Theme Log scheint relativ gross konzipiert zu sein. Allerdings entspricht es den derzeit meist verwendeten Bildschirmgrössen:

Screen Resolution Statistics
Planet Bludit, Tipps, Snippets und nützliche Links. - Newsletter, Informationen zu Bludit (auf Deutsch).
donsenilo
Sr. Bludit
Posts: 38
Joined: Fri Nov 18, 2016 12:18 am

Thu Apr 06, 2017 12:10 am

ich habe etwas herumgebastelt, aber das Ergebnis ist nicht besonders befriedigend.
In die Custom.css habe ich folgendes eingetragen:

Code: Select all

@media screen and (min-width: 1024px) {

   #wrapper {
      display: flex;
   }
#sidebar {
				border-top: solid 1px rgba(160, 160, 160, 0.3);
				margin-right: 3em;
				min-width: 0;
				padding: 0.6em;
				width: 22em;
			}

}
Leider kann ich nicht herausfinden, wie das Intro wegzubekommen ist.
User avatar
Edi
Site Admin
Posts: 1300
Joined: Sun Aug 09, 2015 5:01 pm
Location: Zurich
Contact:

Thu Apr 06, 2017 12:47 am

donsenilo wrote:Leider kann ich nicht herausfinden, wie das Intro wegzubekommen ist.
Du meinst den Titel der Website? Der Intro-Teil wird durch ein JavaScript gesteuert. Je nachdem wird er in den Bereich der Seitenleiste oder den des Hauptinhalts gesetzt.

Es handelt sich um das Skript main.js im Verzeichnis /bl-themes/log/assets/js.

Das Theme ist tricky... Ich würde entweder ein eigenes Theme coden oder ein einfacheres Theme anpassen. Oder es lassen, wie es ist. ;-)
Planet Bludit, Tipps, Snippets und nützliche Links. - Newsletter, Informationen zu Bludit (auf Deutsch).
Post Reply