neue Fenster haben keine Rundungen : X-Silver Style

[niwes]

Sodele ,da mein erstes Problem nun halbwegs gelöst ist, wollte ich nun noch den Rest etwas anpassen!

Ich nehme jetzt mal zB. die Mod mChat als Beispiel
ich habe bei meinem Style X-Silver (http://demo.phpbb3styles.net/X_Silver)
bei keiner Mod Rundungen an den Fenstern (Verzierungen) auf der Hauptseite
auch hier zu sehen
[ externes Bild ]

Auf meiner Seite ist der Style Switcher oben rechts zu finden >>>> :Style X-Silver auswählen!
http://board.primewriter.de/index.php

weis jemand einen Ansatz damit ich die Mods vom style her anpassen kann

[Lehrling]

Hallo, dieser Style weicht etwas ab von der Norm , sprich die Standardklassen greifen nur bedingt.
Ich habe hier eine Tüftelvorlage erstellt, an der du weiterbasteln musst, um zum Ziel zu gelangen:

Code: Alles auswählen

{$SKIN_CAT_HEADER_OPEN}
		 Chat
	{$SKIN_CAT_HEADER_CLOSE}
	<div class="sub-left"><div class="sub-right">
		<h3 style="margin-bottom: -1px; text-align: left;">
			<strong>Text 1</strong>
	</h3>
	</div></div>
	<div class="v-left"><div class="v-right"><div class="stat-info">
		<ul>
	<li class="header">
				<dl class="icon">
					<dt>Text 2</dt>
				</dl>
			</li>
		</ul></div></div></div>
		<div class="c-f-l"><div class="c-f-r"><div class="c-f-c"></div></div></div>

Im Ordner template liegt eine Datei namens skin_config.html. Die enthält auch wichtige Angaben zum Style.
Viel Erfolg

[niwes]

ok danke erst mal dafür
(habe zwar die Mod gewechselt aber das Prinzip bleibt ja das gleiche)

ich habe mich einmal heran getastet und näher wie hier zu sehen ist komme ich einfach nicht her ran
[ externes Bild ]

das aussehen beinhaltet diesen Code:

Code: Alles auswählen

    {$SKIN_CAT_HEADER_OPEN}
           {L_DYK_TITLE}
       {$SKIN_CAT_HEADER_CLOSE}
       <div class="sub-left"><div class="sub-right">

       </div></div>

			<div>
					<ul class="topiclist forums">
						<li class="row">
							<dl>
								<dt style="width: 99%; text-align: center; margin: 10px 0px 10px 0px;">{DID_YOU_KNOW}</dt>
							</dl>
						</li>
					</ul>
					<span class="corners-bottom"><span></span></span>
			</div>

			<div class="v-left"><div class="v-right"><div class="stat-info">
		</div></div></div>
			<div class="c-f-l"><div class="c-f-r"><div class="c-f-c"></div></div></div>

es sieht so aus als würde trotzdem die Mod leicht versetzt darüber schweben...
ich finde den Fehler allerdings nicht

[Lehrling]

folgenden Vorschlag kann man eigentlich nicht wirklich als gelungen ansehen. Totale Flickschusterei, aber immerhin ragt der Container nicht mehr raus.
Ich habe im Stylesheet content.css nach

Code: Alles auswählen

ul.topiclist {
	display: block;
	list-style-type: none;
	margin: 0;
	background: url("{T_THEME_PATH}/images/catsub_mid.png") repeat-x top left;
}

diesen Abschnitt eingebaut

Code: Alles auswählen

ul.topiclistmod {
	display: block;
	list-style-type: none;
	margin-top: -5px;
	margin-bottom: -15px;
	margin-left: 8px;
	margin-right: 8px;
	background: url("./styles/X_Silver/theme/images/catsub_mid.png") repeat-x top left;
}

und dann im Code der html-Seite dieses <ul class="topiclist forums"> in <ul class="topiclistmod forums"> umgeändert.
Es ist immer noch nicht ganz stimmig, denn an den Rändern fehlen Grafiken. Probier's einfach mal aus.

[niwes]

folgenden Vorschlag kann man eigentlich nicht wirklich als gelungen ansehen. Totale Flickschusterei, aber immerhin ragt der Container nicht mehr raus.
Ich habe im Stylesheet content.css nach

Code: Alles auswählen

ul.topiclist {
	display: block;
	list-style-type: none;
	margin: 0;
	background: url("{T_THEME_PATH}/images/catsub_mid.png") repeat-x top left;
}

diesen Abschnitt eingebaut

Code: Alles auswählen

ul.topiclistmod {
	display: block;
	list-style-type: none;
	margin-top: -5px;
	margin-bottom: -15px;
	margin-left: 8px;
	margin-right: 8px;
	background: url("./styles/X_Silver/theme/images/catsub_mid.png") repeat-x top left;
}

und dann im Code der html-Seite dieses <ul class="topiclist forums"> in <ul class="topiclistmod forums"> umgeändert.
Es ist immer noch nicht ganz stimmig, denn an den Rändern fehlen Grafiken. Probier's einfach mal aus.

Ok danke erst mal dafür , ich weis was du meinst aber soweit ist das ok fehlt ja nur ein wenig "Schatten"
zu der kleinen Spalte darüber , irgendeine Idee wie man die eventuell noch minimieren kann?

[Melmac]

Hi,

nur mal so laut gedacht: wenn, dann passe ich doch die Files des jeweiligen MODs individuell an die bestehenden Strukturen des Styles an, also wird sich das jeweilige Vorgehen auch unterschieden können.
Beim von Dir anfangs angesprochenen mChat MOD reicht es z.B., dessen eigene HTML- und CSS-Files zu adaptieren (erster grober Ansatz):

[ externes Bild ]

[ externes Bild ]

[ externes Bild ]

Bei der späteren Alternative (bzw. bei anderen MODs) mag das ganz anders aussehen.
Von daher wäre es, imho, vielleicht zielgerichteter, sich die jeweiligen MODs einzeln anzusehen und "vorzunehmen": um welche geht es Dir?

[niwes]

Hi,

nur mal so laut gedacht: wenn, dann passe ich doch die Files des jeweiligen MODs individuell an die bestehenden Strukturen des Styles an, also wird sich das jeweilige Vorgehen auch unterschieden können.
Beim von Dir anfangs angesprochenen mChat MOD reicht es z.B., dessen eigene HTML- und CSS-Files zu adaptieren (erster grober Ansatz):

[ externes Bild ]

[ externes Bild ]

[ externes Bild ]

Bei der späteren Alternative (bzw. bei anderen MODs) mag das ganz anders aussehen.
Von daher wäre es, imho, vielleicht zielgerichteter, sich die jeweiligen MODs einzeln anzusehen und "vorzunehmen": um welche geht es Dir?

Hallo danke für die Antwort und die Bilder find ich klasse
jedoch sind es so einige Mods um die es geht Prio haben aber die erst mal auf dem Index

>>> also auf dem Index sind es die Mod´s "Welcome on index" "Latest Post MOD" "mChat" "Top Stats" ( "Paypal-Spende MOD" noch nicht in die OverallH eingefügt)
>>> und Indirekt geht es noch um die Seiten der Mod´s "phpBB Gallery" "Download Mod für phpBB 3" "NEWS Mod" "Links Mod" "Thanks for posts"

habe mich schon an dem einen oder anderen Versucht , da war aber immer die Versionen vom Lehrling immer besser vom aussehen her ^^

[Melmac]

Kannst Du zu den MODs vielleicht noch Downloadlinks einstellen - bin mr nicht bei allen sicher, ob ich da auch die richtigen im Hinterkopf habe.

[niwes]

Kannst Du zu den MODs vielleicht noch Downloadlinks einstellen - bin mr nicht bei allen sicher, ob ich da auch die richtigen im Hinterkopf habe.

Klar wobei für den Links Mod ich im Moment keinen link finde ... der Originale bietet den Download nicht mehr an

• Welcome on index - https://www.phpbb.com/customise/db/mod/ ... n_index_2/
  Latest Post MOD - http://www.ongray-design.de/forum/viewt ... f=62&t=554
  mChat - https://www.phpbb.com/customise/db/mod/ ... w_version/
  Top Stats - https://www.phpbb.com/customise/db/mod/top_stats/
  Paypal-Spende MOD - https://www.phpbb.com/customise/db/mod/ ... ation_mod/
  
  phpBB Gallery - http://www.flying-bits.org/download.php?mod_id=6
  Download Mod für phpBB 3 - https://phpbb3.oxpus.net/app.php/dl_ext ... il&df_id=1
  NEWS Mod - http://www.flying-bits.org/download.php?mod_id=3
  Thanks for posts - https://www.phpbb.com/customise/db/mod/ ... for_posts/
  
  Links Mod - http://www.phpbb3bbcodes.com/viewtopic.php?f=59&t=2319 <<<<< Scheint nicht mehr zu funktionieren ,
  ich hätte aber noch die PhpBB Links Mod 1.0.3 Version hier

Hatte noch ganz Vergessen das der Personal Notes Mod / Ranks Page und Forum Goal noch dazu kommt
(weis allerdings nicht ob die die, Styles vom XSilver brauchen ... OK Ranks Page Ja eben noch getestet!)

• Personal Notes - https://phpbb3.oxpus.net/app.php/dl_ext ... il&df_id=2
  Forum Goal - http://www.phpbb3bbcodes.com/testsite/d ... t.php?id=7
  Ranks Page - http://www.phpbb3bbcodes.com/viewtopic.php?f=59&t=1294

[Melmac]

Vorschlag: Ich nehme mal den "Welcome on Index" MOD als ein "Muster" für all die MODs, die in einem eigenen "Block" auf z.B. der Indexseite angezeigt werden.

In der index_body.html änderst Du den dort eingefügten Code dieses MODs wie folgt:

suche

Code: Alles auswählen

<div class="forabg">
         <div class="inner"><span class="corners-top"><span></span></span>
         <ul class="topiclist">
            <li class="header">
               <dl class="icon">
                  <dt>{L_WELCOME_TO_MOD} {SITENAME}</dt>
                                              </dl>
            </li>
         </ul>

Dieser Teil steuert den oberen Rand samt der Titelzeile.

ersetze durch

Code: Alles auswählen

<div class="forabg">
    {$SKIN_CAT_HEADER_OPEN}
        <a>{L_WELCOME_TO_MOD} {SITENAME}</a>
    {$SKIN_CAT_HEADER_CLOSE}
    <div class="v-left">
        <div class="v-right"> 

Jetzt sind die Seiten des Blocks sowie der Kopfbereich im Design von X-Silver.

v-left und v-right sind im CSS des Styles mit einem der jeweiligen Seite entsprechenden Padding von 30px definiert - wenn Dir dies zu breit ist, dann kannst Du dies inline überschreiben; z.B. für 15px:

Code: Alles auswählen

	<div class="v-left" style="padding-left: 15px;">
		<div class="v-right" style="padding-right: 15px;">

Bleibt noch der untere Abschluss:
suche

Code: Alles auswählen

<span class="corners-bottom"><span></span></span></div></div> 

ersetze durch

Code: Alles auswählen

    <span class="corners-bottom" style="height: 0;"><span></span></span></div>
</div>
<div class="c-f-l"><div class="c-f-r"><div class="c-f-c"></div></div></div> 

Die erste Zeile gehört zum übernommenen Muster dazu, würde aber "unfrisiert" zu dem unschönen Spalt führen, den Du schon beklagt hast.
Der einfachste Weg ist wohl, ihr die Höhendefinition inline durch das gegenüber dem Original ergänzte style="height: 0;" wieder zu "entziehen".

Die letzte Zeile definiert den eigentlichen untere Rand.

Alles andere zwischen diesen beiden angepassten Codeblöcken bleibt beim Original des MODs.

Aussehen würde dies dann so:
[ externes Bild ]