Deutsche Buttons - Layout?

[roland mayer]

Ich bin mal dem letzten Hinweis gefolgt, und habe im input.css folgendes eingefügt:

Code: Alles auswählen

.button, a.button, a.button:visited {
	background-color: #DBE8EF;
	...
	padding-right: 5px;
	padding-left: 5px;

und natürlich auch bei den anderen. Der Effekt ist, dass nun dass 5 Pixel zusätzlich eingefügt werden. Im Deutschen lindert das den Schmerz mit der engen Begrenzung. Im Englischen kommen auch 5 Pixel dazu und der Button wird um 10 Pixel breiter. Fällt nicht so wirklich auf, nur verwundert bleibe ich halt trotzdem.

Wenn ich mir den Source-Code anschaue, dann steht dort:

Code: Alles auswählen

<div class="hover-buttons-left">
	  <div class="button-topic-new" title="Neues Thema erstellen"><a href="./posting.php?mode=post&f=5"><span></span>Neues Thema erstellen</a></div>
	</div>
    </td>
    
    <td nowrap="nowrap">
    <form method="get" id="forum-search" action="./search.php">
	  <input class="post" type="text" name="keywords" id="search_keywords" size="20" value="Forum durchsuchen…" onclick="if (this.value == 'Forum durchsuchen…') this.value = '';" onblur="if (this.value == '') this.value = 'Forum durchsuchen…';" />
	  <input class="button" type="submit" value="Suche" /> <=======?==?=======<====?==?===<==?====<==?==
	  <input type="hidden" value="5" name="fid[]" />
      <input type="hidden" name="fid[0]" value="5" />

	</form>
    </td>

und nachdem die Klasse Button im oben beschriebenen im

Code: Alles auswählen

 input.css 

definiert ist, bin ich halt mehr als verwundert, das durch die alleinige Verwendung der deutschen Sprache der HTML-Aufbau anders wird - bzw. das Erscheinungsbild

Wie gesagt, einen Workaround habe ich gefunden. Falls noch jemanden was einfällt, wie ich das Thema sonst noch lösen kann ==> Vorschläge willkommen.

[Crizzo]

Hm? Was verwundert dich denn da jetzt?

Wie padding funktioniert, sollte ja klar sein: http://www.thestyleworks.de/basics/boxmodel.shtml

[Talk19zehn]

Hi, stelle uns doch deine komplette imageset zur Verfügung und auch die Button und Icons ggf. via .zip-archiv, die du im Einsatz hast.

Link zum Forum?

Von Fall zu Fall:
Für meinen Fall, ich bleibe bei der zunächst durchgespielten Lösung: in meinem Test griff die Hardcodierung und deren Änderung.

Grüße

[roland mayer]

Hm? Was verwundert dich denn da jetzt?

Schlicht und ergreifend, wenn ich den englischen Text hernehme, dann gibt's mehr padding als beim deutschen. Und soweit ich es verstehe ist der einzige Unterschied in den Imageset, und der hat aber mit der ganz konkreten Thematik nix zu tun (soweit ich es bisher verstehe).

Hi, stelle uns doch deine komplette imageset zur Verfügung und auch die Button und Icons ggf. via .zip-archiv, die du im Einsatz hast.

Link zum Forum?

Also, Link zum kompletten Imageset, so wie ich es bisher habe, siehe Link. Forum, tja, wie gesagt noch nicht online, sollte erst im Laufe der Woche kommen - hoffentlich.

Noch ein paar Anmerkungen zum Style:

1) Theoretisch sollte er f. 3.0.11 passen
2) Die deutschen Buttons sind noch nicht fertig. Da fehlt mir noch ein paar Anpassungen, kommen aber noch.
3) Bei den Buttons, habe ich eine andere Schriftart genommen, als ursprünglich dabei war (weil ich nicht weiß welche der ursprüngliche Font war). Fällt am stärksten auf, bei der 'Erweiterten Suche'. Da bin ich mir im unklaren, ob ich die anderen anpassen soll, oder halt mit dem Unterschied leben soll/kann (Stichwort: Fällt eh keinem auf.)
4) Bei der obigen Problematik mit dem Padding habe ich es so gesetzt, dass der Abstand auf 5px steht, sprich fällt nicht so stark auf.

roland

[Talk19zehn]

Hi roland,

was ich nicht verstehe ist der Umstand, dass dein Antwort-Button = button-topic-reply und der Gesperrt-Button = button-topic-locked je nur 92px in der Breite haben. Also nicht 100px wie zuvor im Thread erwähnt. Beim Navigieren zwischen den Forumsbereichen ergibt sich eine Art "visuelle Verschiebung" ---> rein optischer Natur.

Ich habe nun die Hardcodierung auf 120px gestellt und keine weiteren Änderungen vorgenommen.

viewtopic:

Code: Alles auswählen

  	<div class="hover-buttons-left" style="width: 120px;">
	<!-- IF not S_IS_BOT and S_DISPLAY_REPLY_INFO -->
		<div class="<!-- IF S_IS_LOCKED -->button-topic-locked<!-- ELSE -->button-topic-reply<!-- ENDIF -->"><a href="{U_POST_REPLY_TOPIC}" title="<!-- IF S_IS_LOCKED -->{L_TOPIC_LOCKED}<!-- ELSE -->{L_POST_REPLY}<!-- ENDIF -->"><span></span><!-- IF S_IS_LOCKED -->{L_TOPIC_LOCKED_SHORT}<!-- ELSE -->{L_POST_REPLY}<!-- ENDIF --></a></div>
	<!-- ENDIF -->
	</div>

viewforum:

Code: Alles auswählen

	<div class="hover-buttons-left" style="width: 120px;">
	  <div class="<!-- IF S_IS_LOCKED -->button-topic-locked<!-- ELSE -->button-topic-new<!-- ENDIF -->" title="<!-- IF S_IS_LOCKED -->{L_FORUM_LOCKED}<!-- ELSE -->{L_POST_TOPIC}<!-- ENDIF -->"><a href="{U_POST_NEW_TOPIC}"><span></span><!-- IF S_IS_LOCKED -->{L_FORUM_LOCKED}<!-- ELSE -->{L_POST_TOPIC}<!-- ENDIF --></a></div>
	</div>

Soweit ist dann in meinem Falle der jeweilige Teil in Ordnung. Oder besser gesagt, mir fiel visuell dann keine Fehlanzeige an den Stellen auf. Ich beschränkte mich quasi nicht auf das Maß der Button.
Ich habe für diesen Test allerdings die Button von subsilver2 benutzt.

Des Weiteren fiel mir auf, dass im Original teilweise das Maß für die Breite einiger Icons nicht stimmig ist. Beispiel:
Es wurden 20px anstatt 56px angegeben.

Code: Alles auswählen

.hover-buttons-left div.button-report {
    height: 20px;
    padding: 2px;
    width: 56px;
}

Gleiches gilt u.a. für .hover-buttons-right div.button-info und für .hover-buttons-left div.button-delete, .hover-buttons-right div.button-delete. Schau doch bitte, ob du diese Fehlerchen noch für andere Icons hast. Je nach Konstellation und Benutzung können Icon angezeigt werden oder wegfallen ( Jabber / MSN etc. .... ).

LG


Edit:
BTW: Wenn du dich für ein *) "Glas-Design" interessierst, wäre evtl. auch AERO-BLUE etwas für dich. Der Vorteil, den ich sehe, es basiert zukunftsorientiert auf Prosilver.

*) Und wenn nicht, schau doch mal bei Würzi rein, falls noch nicht geschehen:
http://www.spieleresidenz.de/styles/index.php?style=109
http://www.spieleresidenz.de/styles/index.php?style=114


Nochmalige Grüße

[roland mayer]

Hallo,

danke f.d. kurzen Review.

Bzgl. Button-Breite: Ich habe nur

Code: Alles auswählen

button-topic-new.gif

von 92 auf 100 geändert. Jetzt habe ich nochmals nachgeschaut, und tatsächlich, die von Dir erwähnten Buttons sind tatsächlich auf 92px. Ich habe nochmals im Thread nachgelesen, wie denn die von Dir erwähnten Buttons zustande gekommen sind. Ich glaube, das ist einiges an Verwirrung mitgekommen, weil unterschiedliche Beispiele, Referenzen und sonstiges vermischt sind. Egal, keine Suche nach Schuldigen oder sonstigen Verdächtigen - danke f.d. Hinweis.

Bzgl. Breite vom Button: Ja, eine Möglichkeit ist sicherlich diese fest vorzugeben. Erfreulicherweise funkt das Ganze auch OHNE Angabe (von Gründen)

Bzgl. Maße einiger Icons: Hm', äh', da kann ich nicht ganz folgen. In den von mir gepackten Datei finde ich nur zwei Dateien mit Inhalt 20px. Einmal in body.css für Breadcrumbs (keine Ahnung wozu die gut ist), und einmal in posting_body.html (und dort auch nicht den Bezug, den Du gemeint hast). Äh', in welcher Datei hast Du diese Einstellungen gesehen?

Bzgl. anderer Styles: Interessanterweise habe ich mir auch schon GitHubberz überlegt, weil der hat mich auch sehr angesprochen. Das mit Aero-Blue finde ich auch nett, jedoch ... Also zuerst einmal möchte den Style fertigstellen mit den deutschen Buttons. Und dann? Hm', keine Ahnung, vielleicht verwendet ihn ja wer

Danke f.d. Rückmeldungen



LeO

[Talk19zehn]

Hello, bzgl der Icon --> es ist die Viewtopic. Unterhalb des Beitrages sind sie, die Originale für 3.0.11 ( 1.0.3 ) zahlreich verkürzt. Das liegt am Original-Theme (s.o.).

LG


Edit:
[ externes Bild ]

[roland mayer]

Hallo,

ich habe nun mein Forum auch online gebracht.

http://forum.athayoga.at/

Benutzer: Test
PWD: test123

mit dem neuen Style übersetzt. Ein paar Fragen habe ich trotzdem noch:

- Im englischen Style gibt es den Buttons 'Search'. Äh', wo wird der denn verwendet? Ich vermute irgendwo bei den Benutzern, nur habe ich den nicht gefunden.
- Im englischen gibt es die Icons für MSN, JABBER, etc.etc. Auch diese habe ich in der Oberfläche letztlich nicht gefunden. Gibt es dazu einen Grund?

Und last but not least denke ich mir, macht es vielleicht Sinn die Übersetzung zur Verfügung zu stellen. Nur, äh, wie mache ich das am einfachsten/effiktivsten?

roland

P.S.: Irgendwie habe ich mit der OpenID-Installation einige Scripts zerschossen. Der Uninstall hat leider nicht so gefunkt, wie ich dachte. Ich schätze, da muss ich noch händisch nachbessern

[Talk19zehn]

Hello, der Link funktioniert nicht.

Search-Button: erinnerlich oben rechts sichtbar
Suche ggf. nicht aktiviert?

Jabber / MSN etc. :
Im Profil ( pers. Bereich ) selbst ohne Angaben?


Grüße

[roland mayer]

Hallo,

ich habe gestern Nacht noch versucht umzubauen und bin letztlich bei der Neuinstallation gelandet Zugang sollte jetzt funken. Dachte nicht, dass es noch andere Nachtschwärmer gibt

Bzgl. Suche: Den Button, den Du meinst ist der Erweiterte-Suche-Button. Im Iconset gibt's aber noch einen *regulären* Such-Button auch noch.

Bzgl. den anderen Icons: Da steht nur der Text. Bin somit aber unschlüssig, ob dort die Icons reingehören oder ob das angedacht war, oder, oder, oder... Für mich machen die wenig Sinn, weil ich nicht weiß, wo diese angezeigt werden (weder in de noch in en)...