[3.2] [3.2.1] Modern

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
Tastenplayer
Mitglied
Beiträge: 743
Registriert: 02.07.2010 19:35
Wohnort: Zuchwil/SO - Schweiz
Kontaktdaten:

Re: [3.2] [3.2.1] [DEV] Modern

Beitragvon Tastenplayer » 16.10.2017 18:26

Talk19zehn hat geschrieben:Entschuldige und noch ein Hallöchen, so habe ich mich wohl verlaufen, denn deine Grafiken zeigen zahlreiche Links in der Navbar, die mit Prosilver -Standard- nichts zu tun haben.
:)

Also man kann auch extrem kleinlich sein. Nächstes Mal dann eben ein Bild aus dem EN Testboard! Style muss ja eben auch im normalen TB getestet werden(betreffend Ext. Konflikten von denen es bereits etliche gab. Es ist lediglich noch die Ext. pages aktiv in diesem TB, was halt in der Nav header sowie footer in Form von Icons noch zu sehen ist. Stylechaner Ext. ist jedoch in jedem TB installiert. Geht nicht ohne.)
Startseite: https://www.my-tastenworld.ch
Mein Portal: https://www.portal.my-tastenworld.ch/Mein Forum: https://www.forum.my-tastenworld.ch/

Be the best version of yourself rather than a bad copy of someone else!

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

Re: [3.2] [3.2.1] [DEV] Modern

Beitragvon Talk19zehn » 16.10.2017 18:39

Hi,
Tastenplayer hat geschrieben:
Talk19zehn hat geschrieben:Entschuldige und noch ein Hallöchen, so habe ich mich wohl verlaufen, denn deine Grafiken zeigen zahlreiche Links in der Navbar, die mit Prosilver -Standard- nichts zu tun haben.
:)

Also man kann auch extrem kleinlich sein. Nächstes Mal dann eben ein Bild aus dem EN Testboard! Style muss ja eben auch im normalen TB getestet werden(betreffend Ext. Konflikten von denen es bereits etliche gab. Es ist lediglich noch die Ext. pages aktiv in diesem TB, was halt in der Nav header sowie footer in Form von Icons noch zu sehen ist. Stylechaner Ext. ist jedoch in jedem TB installiert. Geht nicht ohne.)



Bedenke bitte auch, dass man dir in der Form der Repräsentationen anhand von Grafiken kaum oder gar nicht helfen kann. Kleinlichkeit hat damit rein gar nichts zu tun. :) BTW: Das Thema umfasst inzwischen 14 Seiten ....

LG
Angaben stets ohne Gewähr, da von vielfachen Konstrukten abhängig.

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

Re: [3.2] [3.2.1] [DEV] Modern

Beitragvon Tastenplayer » 16.10.2017 19:20

BTW: Das Thema umfasst inzwischen 14 Seiten ....
etliches ist Runterputz oder OT. Ausserdem habt Ihr Stress gemacht betreffend Stand der Dinge. Deshalb musste wieder was geschrieben werden samt Bild.
Jetzt auch schon wieder 5 unnötige Beiträge wegen ein paar Icons zuviel!

Extra für Dich [ externes Bild ] :lol: (Da sieht man eben nicht alle icons, was ich mühsam finde. Weswegen ich meistens ins DE TB gehe)
Startseite: https://www.my-tastenworld.ch
Mein Portal: https://www.portal.my-tastenworld.ch/Mein Forum: https://www.forum.my-tastenworld.ch/

Be the best version of yourself rather than a bad copy of someone else!

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

Re: [3.2] [3.2.1] [DEV] Modern

Beitragvon Talk19zehn » 16.10.2017 21:16

Hi Tastenplayer, für mich musst du gar nicht tätig werden. Es geht allein um dich als neue Style-Autorin, Schöpfer eines Werkes und einzig um deinen Style, den HelferInnen erkunden, um dir ggü. persönlich Hilfe oder eine Abhilfe leisten zu können.

Anhand von Grafiken ist´s mir nicht möglich. Tut mir leid. Und ich entschuldige mich dafür, dass ich gewillt war, dir Unterstützung geben zu wollen, die natürlich auf dieser Basis nicht funktionieren kann.

:) LG
Angaben stets ohne Gewähr, da von vielfachen Konstrukten abhängig.

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

Re: [3.2] [3.2.1] [DEV] Modern

Beitragvon Tastenplayer » 18.10.2017 19:25

Wollte eigentlich nichts mehr schreiben - reklamiert wurde deswegen ja schon. Jedoch seit heute nur noch am ucp Schriftanpassen. Es scheint jetzt überall zu stimmen. Sind doch noch so einige Sachen hervorgekommen aus ihrem Versteck. Jedoch mit dem ucp beiss ich mir die Zähne aus - hier scheint leider endgültig Schluss zu sein. :( Denn stimmt es an dem einen Ort - eben am anderen Ort wieder nicht. Wird also länger dauernde Beschäftigung an diesem Style sein. Kann ja nicht sein, dass ich den ganzen Bettel umfärben und die Schrift neu formatieren muss, blos wegen diesem einen Ort!
Ansonsten klappte es nur mit einem einzigen Titel nicht und dieser ist nur für die Administration. Also nicht weiter schlimm. (Es hat allerdings noch ein paar wenige grasgrün gefärbte Sachen in der color.css, die leider nie irgendwo sichtbar wurden(Dank installierter Erweiterung im Notepad++ lächeln die mich immer schön grasgrün an. Sehr praktisch, wenn man etwas nicht weiss).

Wies scheint könnte ich noch ewig nach den grasgrünen Sachen suchen
(zBsp. .ucprowbg sowie .fieldsbg
Was auf .com bereits jemand im 2010 suchte und darauf diese Antwort erhielt:
They're not actually used. My guess is that they're remnants from when prosilver was in development. 8) (Na dann stimmt das hoffentlich)

Also ich finde jetzt nichts mehr, was farblich nicht stimmt(was nicht lesbar wäre). Kann aber schon sein, dass dann noch wer was findet(Es hat immer noch um die 10 grasgrüne Sachen in der color.css, die nirgendwo angezeigt werden im Style). Bezweifle nur, dass jetzt nicht irgendwo eine sich überschneidende Farbänderung respektive unnötige Farbgebung vorhanden ist. Egal - muss jetzt das Alles korrekt in die diversen Dateien übertragen(die meisten Änderungen befinden sich in der color.css).
Um den Header habe ich mich bisher kaum gekümmert. Schriftfarben waren erst mal wichtig - das war happig. Und obwohl ich kein Freund des Chrombrowsers bin, hat er mir heute zwei Mal die korrekte Lösung geliefert! Firebug fehlt manchmal schon.
Startseite: https://www.my-tastenworld.ch
Mein Portal: https://www.portal.my-tastenworld.ch/Mein Forum: https://www.forum.my-tastenworld.ch/

Be the best version of yourself rather than a bad copy of someone else!

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

Re: [3.2] [3.2.1] [DEV] Modern

Beitragvon Tastenplayer » 21.10.2017 17:46

Da sieht man, was Änderungen am Style für Auswirkungen haben können. Ich komm nicht drauf, warum dem so ist - das ist nur in diesem Style so doof.

Man sehe oben rechts kein Kreuz im Icon [ externes Bild ] und dem ist auch so, wenn der Background weiss formatiert ist. Hat jedoch nichts mit dem Icon Code zu tun, denn im Style von Talk19zehn sieht man das Kreuz ja deutlich!
Code für alle Icons

Code: Alles auswählen

.icon, .button .icon {
    color: #BF0000;
}
ändert man die Farbe im Code in Weiss, dann sieht man auf dem Bild, dass das Kreuz eben auch rot und nicht wie normal, weiss ist. Warum und weshalb auch immer - ich komm nicht drauf. Ist zwar nur eine Kleinigkeit, aber eben doch ein Fehler. Man versuche mal einen Code zu finden, dass eben nur dieses eine Icon weiss, statt rot angezeigt wird! Sonst hab ich jetzt keinen Fehler mehr im Style finden können. Aber dieses Icon nervt schon :cry:
Könnte man höchstens noch in ein Icon fa times ändern. Jedoch man suche mal in welcher Datei sich dieses Icon überhaupt befindet :lol:

Ja und meistens such man viel zu weit! War ja gar keine grosse Sache

Code: Alles auswählen

.alert_close i {
   color: #ffffff;
}
Und weshalb dem so war - ist auch geklärt - was Anfänger nicht alles so für Fehler machen und dies auch noch übersehen :oops: Könnte ich eigentlich jetzt alles wieder löschen - mach ich jetzt aber mal nicht und schäm mich weiter.

Code: Alles auswählen

.alert_close .icon:before {
   background-color: #F4F4F4;
}
logisch wird rotes Kreuz angezeigt, wenn hier rot formatiert war. Ich könnt mich jetzt grad..

Muss jetzt alles in der color.css was in eine andere Datei reingehört rüberschreiben, damit ich den Style wieder on stellen kann.
Startseite: https://www.my-tastenworld.ch
Mein Portal: https://www.portal.my-tastenworld.ch/Mein Forum: https://www.forum.my-tastenworld.ch/

Be the best version of yourself rather than a bad copy of someone else!

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

Re: [3.2] [3.2.1] [DEV] Modern

Beitragvon Tastenplayer » 24.10.2017 12:10

Den Header habe ich jetzt ganz gut hinbekommen nur:

Mit der Searchbox im Bild/Logo - dem Titel über dem Wrap und ohne Beschreibung hat mir der Style eindeutig besser gefallen.
Ausserdem was passiert, wenn ein Forum langen Titel oder lange Beschreibung hat? Wäre es nicht besser, den Titel über dem Wrap? Dann jedoch bleibt die Frage: Wie bekommt man in der Mitte eine weisse Linie, wie in der Navbar sowie die Searchbox über der Linie und die Beschreibung unter der Linie.

Ich versuch auf jeden Fall weiter, den Header mit Searchbox im Bild hinzubekommen. Dann gibt es eben von dem Style zwei Varianten. Auch gut!
So sieht das Ganze jetzt aus: [ externes Bild ] Danke Anke, Deine Header Version hat mich auf die Lösung gebracht. Danke Lehrling: Dein Video betreffend dem Erstellen eines eigenen Containers, war äusserst hilfreich!

Responsiv ist es in den Mobiltelefonen nur in der Landscape Ansicht! Logo-Bild voll - Navbar sowie top_modern sowie der Forenteil leider nicht ganz. Muss ich auch schauen, ob ich da drauf komme.

Wenn ich jetzt so das Foto anschaue, könnte wohl der Abstand von dem Top Container zum Bild etwas grösser sein - mal sehen.
Gut - 1px korrigiert - geschaut wie es mit längerem Titel und Beschreibung aussieht - [ externes Bild ]
So sieht es aus, wenn der Titel über dem Wrap ist(fehlt nur noch die Linie dazwischen): [ externes Bild ] Allerdings besteht bei dieser Variante das Problem, dass es doof aussieht, wenn jemand keine Beschreibung hat.
Ohne Beschreibung wäre der Header ganz gut so [ externes Bild ]

top_modern.html

Code: Alles auswählen

<div class="top_modern" role="container">
   <div class="inner">

 <h1>{SITENAME}</h1>
            <h5>{SITE_DESCRIPTION}</h5>
            <p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
   <a id="top" class="top-anchor" accesskey="t"></a>
            <!-- EVENT overall_header_searchbox_before -->
         <div class="search">
         <!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
         <div id="search-box" class="search-box search-header" role="search">
            <form action="{U_SEARCH}" method="get" id="search">
            <fieldset>
               <input name="keywords" id="keywords" type="search" maxlength="128" title="{L_SEARCH_KEYWORDS}" class="inputbox search tiny" size="20" value="{SEARCH_WORDS}" placeholder="{L_SEARCH_MINI}" />
               <button class="button button-search" type="submit" title="{L_SEARCH}">
                  <i class="icon fa-search fa-fw" aria-hidden="true"></i><span class="sr-only">{L_SEARCH}</span>
               </button>
               <a href="{U_SEARCH}" class="button button-search-end" title="{L_SEARCH_ADV}">
                  <i class="icon fa-cog fa-fw" aria-hidden="true"></i><span class="sr-only">{L_SEARCH_ADV}</span>
               </a>
               {S_SEARCH_HIDDEN_FIELDS}
            </fieldset>
            </form>
         </div>
         <!-- ENDIF -->
         </div>
         <!-- EVENT overall_header_searchbox_after -->

   </div>
</div>

style.css

Code: Alles auswählen

.top_modern {
   background: #1F1F1F;/* Old browsers */
   background: -moz-radial-gradient(center, ellipse cover, #1f1f1f 0%, #1f1f1f 51%, #484848 75%, #939192 100%); /* FF3.6-15 */
   background: -webkit-radial-gradient(center, ellipse cover, #1f1f1f 0%,#1f1f1f 51%,#484848 75%,#939192 100%); /* Chrome10-25,Safari5.1-6 */
   background: radial-gradient(ellipse at center, #1f1f1f 0%,#1f1f1f 51%,#484848 75%,#939192 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1f1f1f', endColorstr='#939192',GradientType=1 ); /* ie6-9 */
   padding: 3px 10px;
   border-bottom: 1px dashed #A9A9A9;
   border-bottom-right-radius: 2px;
   border-bottom-left-radius:2px;
   border-top: 5px solid #000;
   border-left: none;
   border-right: none;
   margin-top: -3px;
}


Jetzt muss ich weiter Daten aus der color.css in die korrekten Dateien übertragen. Habe gestern leider noch ein paar Schriftprobleme gefunden, das hat wieder Zeit benötigt. Klar könnte ich den Style so jetzt hochladen - aber es ist eben alles in der color.css und sollte schon zuerst korrekt übertragen werden.
Startseite: https://www.my-tastenworld.ch
Mein Portal: https://www.portal.my-tastenworld.ch/Mein Forum: https://www.forum.my-tastenworld.ch/

Be the best version of yourself rather than a bad copy of someone else!

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

Re: [3.2] [3.2.1] [DEV] Modern

Beitragvon Tastenplayer » 01.11.2017 18:24

Hallo Anke

Der Header war super so, bis ich heute die headerlink Ext. von Hifikabin installierte (RC11) In allen anderen Styles inkl. Black-silver-split kein Problem!
https://www.phpbb.com/community/viewtopic.php?f=456&t=2410101&p=14857611#p14857611 Mit dem alten Modern-Header hatte ich das ja bereits getestet und angepasst. Mal sehen wenn der Style on ist, woran das liegt(Gestern 5Std. lang PC gereinigt und repariert - heute keine Updatemöglichkeit - erhielt andauernd DB Fehlermeldungen. Bin nicht mal in den ACP reingekommen). [ externes Bild ] :lol: :lol:
Hab mal versucht die Ext. anzupassen - geht nicht - Headerbild ist futsch!
Jetzt muss ich wieder die Höhe des Bildes angegeben damit es klappt! :-? [ externes Bild ]Allerdings ist es immer noch gleich responsiv wie vorher wo 100% als Höhe angegeben war!
Startseite: https://www.my-tastenworld.ch
Mein Portal: https://www.portal.my-tastenworld.ch/Mein Forum: https://www.forum.my-tastenworld.ch/

Be the best version of yourself rather than a bad copy of someone else!

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

Re: [3.2] [3.2.1] [DEV] Modern

Beitragvon Melmac » 01.11.2017 19:02

Zum Thema responsive Anzeige => hier
Inwiefern sich dies jetzt mit dieser Ext beißt oder beißen muss, müsste man mal antesten: es hängt davon ab, wie genau sie den Block mit den Links im Header einbindet. Sprich: welche Struktur sie dort erwartet bzw. hinzufügt (= wie sie funktioniert).

Sie funktioniert mit einem Standard-prosilver Header, aber der ist ja auch nur unter bestimmten Voraussetzungen responsiv.
Handle nur nach derjenigen Maxime, durch die du zugleich wollen kannst, dass sie ein allgemeines Gesetz werde.
(Immanuel Kant)

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

Re: [3.2] [3.2.1] [DEV] Modern

Beitragvon Tastenplayer » 01.11.2017 21:24

Ja Melmac, man muss warten bis der Style on ist. Wie Du jedoch auf dem Bild siehst, sobald ich die Headerlink Ext. installiere fällt der ganze Header zusammen und man sieht kein Bild mehr! Da nützt es auch nichts, die Headerlink Ext. ganz nach unten zu verschieben. Erst, wenn ich wieder die genau Headerhöhe angebe ist alles wieder im grünen Bereich! Ins Bild verschoben habe ich die Ext. ,weil es sonst mit meinem Style irgendwie doof aussieht.
Gestern hatte ich alle meine Styles an die Ext. genau angepasst und heute kam neue Version raus wo auch Änderungen in der style.css stattfanden :lol:

Irgendwie aber schon komisch, dass das Headerbild nach der Ext.-Installation entschwindet! Beim Xmas auch 0 Problemo diesbezüglich. Aber da ist halt auch wieder Höhe und Breite des Headers angegeben und nicht 100% 100%

Ich schau die nächsten Tage mal was passiert, wenn ich die neue Ext.Version installiere. Jedoch ich befürchte, dass dies eben nicht die einzige Ext. ist, bei welcher es dann Konflikte mit meiner Headerkonfiguration geben könnte. Es ist lediglich die Einzige, welche ich benötige. Kann auch sein, dass ich was falsch machte bei der Umsetzung des Headers(Einfügen des Codes). Sehen wir dann ja, wenn er endlich on ist. Ansonsten hab ich bisher keine Fehler in Forum von nicht korrekter Farbgebung mehr gefunden.
Startseite: https://www.my-tastenworld.ch
Mein Portal: https://www.portal.my-tastenworld.ch/Mein Forum: https://www.forum.my-tastenworld.ch/

Be the best version of yourself rather than a bad copy of someone else!

Verschoben von Styles in Entwicklung nach Styles, Templates und Grafiken am 02.11.2017 10:42 durch Melmac


Zurück zu „Styles, Templates und Grafiken“