phpBB.de

phpBB.de - Die deutsche phpBB-Community
https://www.phpbb.de/community/

3.2.0 Pages - Backround wie in ul.forums

https://www.phpbb.de/community/viewtopic.php?t=239845

Seite 2 von 2

Re: 3.2.0 Pages - Backround wie in ul.forums

Verfasst: 23.06.2017 19:51
von Tastenplayer
Ja hat funktioniert mit dem Entfernen des div das zu viel war :oops: In allen Styles korrekte Anzeige.

Betreffend diesem Vorschlag von Dir viewtopic.php?p=1369948#p1369948

Es geht nicht, denn es werden beide Farben aufgeführt - die vom Copyright(habe allerdings das jetzt wieder in rules abgeändert). sowie die Farbe aus der pages_mytaste.css.
Wenn ich dann im Firefox den Haken bei den Farben von div.rules entferne wird erst die Farbe der pages_mytaste.css angezeigt.

Könnte immerhin diese hellere Farbe mal in div rules einfügen!

Re: 3.2.0 Pages - Backround wie in ul.forums

Verfasst: 23.06.2017 20:26
von Kirk
Dann generiere doch deine eigene Klasse und passe die css für deine Styles an.

Re: 3.2.0 Pages - Backround wie in ul.forums

Verfasst: 23.06.2017 22:43
von Tastenplayer
Kirk hat geschrieben:Dann generiere doch deine eigene Klasse und passe die css für deine Styles an.
Was glaubst Du, was ich die ganze Zeit versuchte und versuche :D
Müsste ja irgendwie gehen zBsp. eine Seite mit rotem Hintergrund die dann in allen Styles rot angezeigt wird. Hab schon ein paar graue Haare mehr.

Egal habe jetzt neues Farbbild für div.rules gesetzt - jetzt ist es ganz okay.

Re: 3.2.0 Pages - Backround wie in ul.forums

Verfasst: 24.06.2017 09:22
von Kirk
Wenn du diesen Beitrag als Beispiel nimmst und das hier
<div class="copyright mytaste"> so umänderst <div class="mytaste">, die Farben in der css anpasst bekommst du einen roten Hintergrund.

Edit:
Probier mal folgendes:
Ersetze den gesammten Code deiner pages_mytaste.html damit:

Code: Alles auswählen

<!-- INCLUDECSS @phpbb_pages/pages_controller.css -->
<!-- INCLUDECSS @phpbb_pages/pages_mytaste.css -->
<!-- INCLUDE overall_header.html -->

	<div class="forabg">
		<div class="inner">
		<ul class="topiclist">
			<li class="header">
				<dl class="row-item">
					<dt><div class="list-inner">{PAGE_TITLE}</div></dt>
					<dd></dd>
				</dl>
			</li>
		</ul>
			<ul class="topiclist forums">
				<li class="mytaste">
					<div class="content pages-content">{PAGE_CONTENT}</div>
				</li>
			</ul>
		</div>
	</div>

<!-- INCLUDE overall_footer.html -->
pages_mytaste.css

Code: Alles auswählen

.mytaste {
	padding-top: 15px;
}
Wenn du möchtest kannst du ja noch ein background-color hinzufügen.

Re: 3.2.0 Pages - Backround wie in ul.forums

Verfasst: 24.06.2017 13:44
von Tastenplayer
Vielen Dank Kirk für Deine Hilfe - versuch ich morgen mal!

Hier ein extrem Beispiel der Farbgebung :grin: [ externes Bild ]
Entstanden mit diesem Bild [ externes Bild ]
Aus diesem Generator http://www.colorzilla.com/gradient-editor/

Re: 3.2.0 Pages - Backround wie in ul.forums

Verfasst: 23.07.2017 15:16
von Tastenplayer
Kirk hat geschrieben:Wenn du diesen Beitrag als Beispiel nimmst und das hier
<div class="copyright mytaste"> so umänderst <div class="mytaste">, die Farben in der css anpasst bekommst du einen roten Hintergrund.

Edit:
Probier mal folgendes:
Ersetze den gesammten Code deiner pages_mytaste.html damit:

Code: Alles auswählen

{% INCLUDECSS '@phpbb_pages/pages_controller.css' %}
{% include 'overall_header.html' %}

<div class="forabg">
      <div class="inner">
      <ul class="topiclist">
         <li class="header">
            <dl class="row-item">
               <dt><div class="list-inner">{PAGE_TITLE}</div></dt>
               <dd></dd>
            </dl>
         </li>
      </ul>
         <ul class="topiclist forums">
            <li class="mytaste">
               <div class="content pages-content">{PAGE_CONTENT}</div>
            </li>
         </ul>
      </div>
   </div>

{% include 'overall_footer.html' %}
pages_mytaste.css

Code: Alles auswählen

.mytaste {
	padding-top: 15px;
}
Wenn du möchtest kannst du ja noch ein background-color hinzufügen.
pages angepasst an phpbb 3.2.1 sowie pages 2.0.1

In meiner Variante oben sieht es nicht schlecht aus. Dein Vorschlag unten wäre super - jedoch die css scheint bei mir nicht zu greifen. umgenannt in keyboard - jedoch Beschreibung kommt zu weit rauf und Schrift rechts bis in den Boarder.
[ externes Bild ]
Jetzt wo ich den Code von Kirk an die neue pages Version angepasst habe - habe ich erst gesehen, dass ich

Code: Alles auswählen

{% INCLUDECSS '@phpbb_pages/pages_keyboard.css' %}
überhaupt nicht einfügte in die Datei :oops: Logisch kann so die css nicht greifen.

Fehler behoben, pages_keyboard.css angepasst:

Code: Alles auswählen

{% INCLUDECSS '@phpbb_pages/pages_controller.css' %}
{% INCLUDECSS '@phpbb_pages/pages_keyboard.css' %}
{% include 'overall_header.html' %}

Code: Alles auswählen

.keyboard{
   padding-top: 13px;   
}

.pages-content {
    font-size: 1.3em;
	line-height: 1.3em;
	margin-left: 12px;
	margin-right: 11px;
	padding-top: 10px;
	padding-bottom: 9px;
}

li.header {
    padding-left: 7px;  
	font-size: 13px;
}
Schon sieht die Kirk-Variante super aus [ externes Bild ]

Rot ist bis jetzt bei mir nie eine Seite geworden - vermutlich hatte ich da auch versäumt die css. einzubauen.
Ist endlich on die pages_red
[ externes Bild ]

die pages_red.html

Code: Alles auswählen

{# Use the space below to include external CSS and JS files
# Here are some example usages:
#
# local files relative to this template file (when stored inside phpBB's style directories):
# {% INCLUDEJS 'script.js' %}
# {% INCLUDECSS 'style.css' %}
#
# local files stored inside the Pages extension:
# {% INCLUDEJS '@phpbb_pages/script.js' %}
# {% INCLUDECSS '@phpbb_pages/style.cs's %}
#
# hosted on external sites:
# {% INCLUDEJS 'http://code.jquery.com/jquery-migrate-1.2.1.min.js' %}
# {% INCLUDECSS 'https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css' %}
#
#}

{% INCLUDECSS '@phpbb_pages/pages_controller.css' %}
{% INCLUDECSS '@phpbb_pages/pages_red.css' %}
{% include 'overall_header.html' %}

<div class="content pages-content">

	{{ PAGE_CONTENT }}

</div>

{% EVENT phpbb_pages_after_page_content %}

{% include 'overall_footer.html' %}
Die pages_red.css

Code: Alles auswählen

.red{
   padding-top: 13px;     
}

.pages-content {
    font-size: 1.3em;
    line-height: 1.3em;
    margin-left: 1px;
    background-color: #C60000;
    color: #f1f1f1;
    border: 5px solid #000000;
	border-radius: 8px;
    margin-bottom: 8px;
    padding-left: 5px;
    padding-right: 5px;
}
Und schon wieder Einiges dazugelernt bei phpbb.de 8) Vielen Dank Kirk für Deine Mühe!

Re: 3.2.1 Pages - Background wie in ul.forums

Verfasst: 25.07.2017 20:06
von Tastenplayer
Heute auch noch herausgefunden wie ich 4 einfache Kolonnen in pages erstellen kann.
Klar die Gestaltungsmöglichkeiten sind begrenzt, denn es muss in jeder Kolonne ungefähr gleich viel Inhalt sein. Ansonsten wird es dann in den nächsten Kolonnen verschoben.
Ja und schon hat man, dank Kirks Hilfe wieder einen Smarten Radio im Forum und nicht eine ganze Seite, wie meine erste Variante mit der konvertierten pdf zu html(An die Möglichkeit mit Pages hatte ich doch überhaupt nicht gedacht :oops: ). Das ist wirklich eine super Sache - die vielseitigste Ext.
(Ob es in 3.2.0 so auch funktionieren würde weiss ich nicht - Titel ist ja nun mal 3.2.0 Pages. In 3.2.1 scheint es zu klappen.

[ externes Bild ]
Allerdings, wenn man den Titel mittig möchte muss man schon etwas spielen. Genauso mit dem Inhalt. Egal was man in die Kolonnen einfügen möchte.

Code: Alles auswählen

.keyboard{
   padding-top: 11px;    
}

.pages-content {
    font-size: 1.3em;
	font-weight: bolder;
	font-family: "Arial Black", sans-serif;
	line-height: 1em !important;	
	padding-top: 10px;
	padding-bottom: 10px;	
	width: 100%;	
	column-count: 4;
	column-rule-color: #333333;
	column-rule-width: 5px;
	column-rule-style: solid;		
}

li.header {
    padding-left: 7px;  
	padding-bottom: 2px;
	font-size: 13px;
	text-align: right;
	padding-right: 45px;
		
}
Man kann natürlich auch noch Umbrüche für die Kolonnen festlegen - soweit bin ich noch nicht gekommen.
Siehe hier: http://t3n.de/news/css3-texte-einfach-m ... ig-334072/
Alle Zeiten sind UTC+02:00
Seite 2 von 2

Powered by phpBB® Forum Software © phpBB Limited

Deutsche Übersetzung durch phpBB.de