[3.2] prosilver für Mobilgeräte wird nicht kleiner

Alles zu Styles, Templates, Icons und Smilies für phpBB 3.1/3.2, sowie allgemeine Designfragen zur Integration von phpBB in bestehende Websites.
Forumsregeln
Bei Style spezifischen Fragen ist der Stylename und die Downloadquelle des Styles erforderlich, besser noch die URL vom betroffenen Forum.
Benutzeravatar
sepp71
Mitglied
Beiträge: 823
Registriert: 23.12.2006 00:03

[3.2] prosilver für Mobilgeräte wird nicht kleiner

Beitragvon sepp71 » 12.06.2018 23:14

Hallo zusammen,

nach dem Update meiner Forensoftware auf 3.2 habe ich den Eindruck, dass sich prosilver nicht mehr so gut an mobile Geräte anpasst.
In 3.1. konnte ich die Fensterbreite bis ca. 285 px Breite herunterskalieren und z.B. der Beitragstext hat sich im Zeilenumbruch noch mehrfach angepasst.
In 3.2. erfolgt die Anpassung nur noch bis ca. 682 px (Umschaltung vom Desktop-Layout auf das mobile Layout), aber dann - innerhalb des mobilen Layouts - bleiben die Zeilenumbrüche unverändert, der Text wird also nicht mehr angepasst. In dem 285er-Fenster aus dem ersten Beispiel kann man den Text dann nur noch durch Querscrollen lesen.

Hat jemand eine Idee, woran das liegen könnte und v.a. wie man es wieder hinbekommt?
Meine ersten mobilen Besucher fragen schon...

Ich hatte schon meine Extensions oder Anzeigen im Verdacht, aber auch nach dem Abschalten incl. Cache-Löschung etc. blieb der beschriebene Effekt.

Sepp
phpBB 3.2.2 mit About us, Advertisement Management, Delete my registration, Precise Similar Topics, Privacy protection, Recent Topics, Thanks for posts

Benutzeravatar
Joyce&Luna
Mitglied
Beiträge: 1803
Registriert: 24.11.2013 18:14
Wohnort: NRW
Kontaktdaten:

Re: [3.2] prosilver für Mobilgeräte wird nicht kleiner

Beitragvon Joyce&Luna » 13.06.2018 00:56

Welches Handy macht den noch 285px ?
Standard sind 320px darauf werden alle Style angepasst.
Das ganze ist eine responsive Sache, das man aber anpassen kann.

Mach mal Screenshot was alles so bemängelt wird von deinen Besuchern. Benutzt du nur Prosilver oder auch einen anderen Style?
phpBB-Style-Design.de

Keine Antwort ist die eindeutigste Antwort, die man kriegen kann.
Support zu meinen Styles, bitte die Fragen im Forum stellen und nicht per PN. Danke!

Benutzeravatar
Tastenplayer
Mitglied
Beiträge: 1158
Registriert: 02.07.2010 19:35
Wohnort: Zuchwil/SO - Schweiz
Kontaktdaten:

Re: [3.2] prosilver für Mobilgeräte wird nicht kleiner

Beitragvon Tastenplayer » 13.06.2018 17:37

In 3.2. erfolgt die Anpassung nur noch bis ca. 682 px (Umschaltung vom Desktop-Layout auf das mobile Layout),

Stimmt hatte bei meinen selber erstellten Styles das gleiche Problem - Aber das musst Du eben selber in der responsive.css anpassen.
Ich habe allerding einach in der common.css Zeile 145 min-width gelöscht. Jetzt scheint es überall korrekt angezeigt zu werden.

Code: Alles auswählen

.wrap {
   border: 1px solid transparent;
   border-radius: 8px;
   margin: 0 auto;
   max-width: 1152px;
   min-width: 625px;
   padding: 15px;
}
Im Prosilver 3.2.2 stimmt es allerdings bei mir mit der Auflösung. Hab mir das jetzt nochmals genauer angeschaut. Man muss beim Wrap in der responsive.css, Zeile 185 nur noch ein !important hinsetzen. Und in Deinem Fall 290px durch 285px ersetzen. Dann wird es in jedem Style wieder korrekt angezeigt.

Code: Alles auswählen

   .wrap {
      border: none !important;
      border-radius: 0 !important;
      box-shadow: none !important;
      outline: none !important;
      margin: 0 !important;
      min-width: 290px;
      padding: 0 5px !important;
   }


Welches Handy macht den noch 285px ?
Vielleicht so was!?
http://www.50plus.de/article/der-ueberraschende-boom-der-outdoor-smartphones.html
Mein Portal: https://www.portal.my-tastenworld.ch/ Mein Forum: https://www.forum.my-tastenworld.ch/
The best online translator comes from Köln DE
Be the best version of yourself rather than a bad copy of someone else!

Benutzeravatar
Joyce&Luna
Mitglied
Beiträge: 1803
Registriert: 24.11.2013 18:14
Wohnort: NRW
Kontaktdaten:

Re: [3.2] prosilver für Mobilgeräte wird nicht kleiner

Beitragvon Joyce&Luna » 13.06.2018 19:15

An Prosilver würde ich schon mal gar nichts verändern, wenn dann rate ich zu einen Child Style.
So hat er jede seine Veränderungen an Prosilver im Überblick.
viewtopic.php?f=153&t=239682
phpBB-Style-Design.de

Keine Antwort ist die eindeutigste Antwort, die man kriegen kann.
Support zu meinen Styles, bitte die Fragen im Forum stellen und nicht per PN. Danke!

Benutzeravatar
Tastenplayer
Mitglied
Beiträge: 1158
Registriert: 02.07.2010 19:35
Wohnort: Zuchwil/SO - Schweiz
Kontaktdaten:

Re: [3.2] prosilver für Mobilgeräte wird nicht kleiner

Beitragvon Tastenplayer » 13.06.2018 21:13

Joyce&Luna hat geschrieben:An Prosilver würde ich schon mal gar nichts verändern, wenn dann rate ich zu einen Child Style.
So hat er jede seine Veränderungen an Prosilver im Überblick.
Um lediglich hinter

Code: Alles auswählen

min-width: 290px;
ein

Code: Alles auswählen

!important
zu setzten um dann aus

Code: Alles auswählen

min-width: 290px;
ein

Code: Alles auswählen

min-width: 285px !important;
zu machen, muss ich doch keinen Childstyle erstellen! Ich darf halt nur nicht vergessen, dass ich dies in jeder neuen Prosilver-Version wieder machen muss. Falls im eigenen Style die responsive.css eingefügt ist, mach ich das logo da. Oder der eigene Style besteht bereits in einer style.css(Child Style) dann diese Änderung natürlich auch dort einfügen.
Mein Portal: https://www.portal.my-tastenworld.ch/ Mein Forum: https://www.forum.my-tastenworld.ch/
The best online translator comes from Köln DE
Be the best version of yourself rather than a bad copy of someone else!

Benutzeravatar
Melmac
Supporter
Supporter
Beiträge: 2918
Registriert: 15.10.2012 03:27

Re: [3.2] prosilver für Mobilgeräte wird nicht kleiner

Beitragvon Melmac » 13.06.2018 22:06

sepp71 hat geschrieben:In 3.2. erfolgt die Anpassung nur noch bis ca. 682 px (Umschaltung vom Desktop-Layout auf das mobile Layout), aber dann - innerhalb des mobilen Layouts - bleiben die Zeilenumbrüche unverändert, der Text wird also nicht mehr angepasst.

Das kann ich irgendwie nicht reproduzieren: der Zeilenumbruch passt sich auch unterhalb einer horizontalen Auflösung von 680px weiterhin an ... ohne solche "Aussetzer".
Erst bei Auflösungen kleiner 290px gibts ein kleines Problem: rechts entfällt der Abstand zwischen Text und Fensterrand.
Ob dies in der Praxis wirklich ein Problem ist, darüber ließe sich streiten :wink:

---------------

Tastenplayer hat geschrieben:Man muss beim Wrap in der responsive.css, Zeile 185 nur noch ein !important hinsetzen

!important sollte man wirklich nur dann verwenden, wenn es gar keine andere Möglichkeit mehr gibt, das Problem via CSS zu lösen (und dann auch bitte nur bei den Eigenschaften, bei denen es auch erforderlich ist) - es ist schließlich nicht frei von möglichen "Nebenwirkungen", wenn es im falschen Kontext und/oder ohne zwingende Notwendigkeit gesetzt wird ...

Tastenplayer hat geschrieben:muss ich doch keinen Childstyle erstellen!

Müssen tut man gar nichts, auch wenn das Erstellen eines Childstyles bei Änderungen am Original des Styles die auf Dauer unproblematischere und sauberere Lösung wäre.
Spätestens dann, wenn in Zukunft vielleicht noch weitere Anpassungen hinzukommen sollten, wird man nicht umhinkommen, genau dies zu machen - warum also nicht gleich?

Immerhin gibt es ja auch noch einen Kompromiss zwischen "Anpassen der Originaldateien" und "Erstellen eines vollwertigen Tochterstyles": wenn sich die Änderungen ausschließlich auf das CSS des Styles beschränken, kann man auch mit einem zusätzlichen (= eigenen) Stylesheet arbeiten ... :wink:

Hierzu im /theme-Verzeichnis von prosilver einfach eine neue Datei custom.css anlegen und diese dann am Ender der stylesheet.css mit

Code: Alles auswählen

@import url("custom.css?v=3.2");

importieren.

In dieser dann folgenden Code einfügen:

Code: Alles auswählen

@media (max-width: 700px) {
  .wrap {
    min-width: 270px;
  }
}

Damit sollte dann dieses Problem behoben sein - ganz ohne einen vollwertigen Tchterstyle zu erstellen und, vor allem, ohne unnötige !important zu verwenden.

Falls es jetzt dennoch weiterhin zu dem angesprochenen Darstellungsproblem kommt, dann wäre vielleicht zu prüfen, ob eine Extension installiert ist, die zusätzliche Formatierungen für diesen Bereich hinzufügt, die dann dazwischenfunken.
Handle nur nach derjenigen Maxime, durch die du zugleich wollen kannst, dass sie ein allgemeines Gesetz werde.
(Immanuel Kant)

Benutzeravatar
Joyce&Luna
Mitglied
Beiträge: 1803
Registriert: 24.11.2013 18:14
Wohnort: NRW
Kontaktdaten:

Re: [3.2] prosilver für Mobilgeräte wird nicht kleiner

Beitragvon Joyce&Luna » 13.06.2018 22:15

Mit dem custom ist natürlich auch eine gute Lösung.
Daran hatte ich jetzt nicht gedacht.

Sollte aber Sepp weitere Veränderungen am Style vornehmen wollen, da würde ich ihm aber dazu raten einen Tochter Style zu machen.
phpBB-Style-Design.de

Keine Antwort ist die eindeutigste Antwort, die man kriegen kann.
Support zu meinen Styles, bitte die Fragen im Forum stellen und nicht per PN. Danke!

Talk19zehn
Ehemaliger
Beiträge: 4562
Registriert: 08.06.2009 12:03

Re: [3.2] prosilver für Mobilgeräte wird nicht kleiner

Beitragvon Talk19zehn » 14.06.2018 10:55

Moin, moin, - wäre es möglich die Klasse "post" mit einem padding zu versehen? Das klappt in meinem Falle in den ersten Tests: Standard prosilver (phpBB-3.2.2))


Code: Alles auswählen

@media (max-width: 700px) {
   .wrap {
      min-width: 270px;
   }
   .post {
   padding: 18px;
   }
}


Jene Änderung könnte man sich m.E. ggf. in Folge sparen: Bin mir nicht sicher, ob sie sich durchsetzt.
.wrap {
min-width: 270px;
}



Der Viewport -> Mobile portrait (320x480) <div class="postbody"> .... und <div class="content"> ändert sich unter Berücksichtigung von padding auf ca. 284x365px und Nachteile kann ich im Schnelltest keine erkennen.

Viele Grüße

Benutzeravatar
Joyce&Luna
Mitglied
Beiträge: 1803
Registriert: 24.11.2013 18:14
Wohnort: NRW
Kontaktdaten:

Re: [3.2] prosilver für Mobilgeräte wird nicht kleiner

Beitragvon Joyce&Luna » 14.06.2018 12:07

Wenn man schon am Prosilver selbst herum bastelt, würde auch reichen, in der responsiv.css Zeile 137 das min-width: 290px; auf min-width: auto; stellen.
phpBB-Style-Design.de

Keine Antwort ist die eindeutigste Antwort, die man kriegen kann.
Support zu meinen Styles, bitte die Fragen im Forum stellen und nicht per PN. Danke!

Talk19zehn
Ehemaliger
Beiträge: 4562
Registriert: 08.06.2009 12:03

Re: [3.2] prosilver für Mobilgeräte wird nicht kleiner

Beitragvon Talk19zehn » 14.06.2018 12:39

Hm, - - sehe ich anders, denn die responsive.css deklariert in Zeile 450 postbody bereits width: auto;:

Code: Alles auswählen

.postprofile, .postbody, .search .postbody {
      display: block;
      width: auto;
      float: none;
      padding: 0;
      min-height: 0;
   }


und mein Ansatz basiert auf der Standardklasse "post" in dem einleitenden Container <div id="xx" class="post has-profile bg2 online"> und dem Vorschlag von Melmac. Insofern ...
Wahrscheinlich führen einige Wege zum Erfolg. Jedenfalls habe ich die fehlenden 5 Pixel oder sind es doch einige mehr im phpBB-Standard nicht finden können, um das Querscrollen grundsätzlich unterbinden zu können.

Okay, ich gebe dann ab.

Grüße

Verschoben von Support-Forum nach Styles, Templates und Grafiken am 14.06.2018 13:14 durch Dr.Death


Zurück zu „Styles, Templates und Grafiken“