Eigenener Farbton

Ich habe einen Blog Artikel verfasst - Wie benutze ich die Suche richtig - Bitte diesen beachten und auch umsetzen bevor Ihr ein Neues Thema eröffnet!

    Zitat von Florian.1985

    Funktioniert super... Nur eine Frage habe ich. Gibt es die Möglichkeit relativ schnell aus dem Farbton gelb ein blau zu machen in der mobilen Version?
    Vielen Dank im Voraus.


    Viele Grüße

    Relativ schnell wohl nicht. Aber du kannst versuchen in der custom.css jeglicher Farbcode #ffe500 mit Suchen und Ersetzen mit deinem gewünschten zu ersetzen.
    Ob du damit alles erwischst ist die andere Frage ...

    Ich hoffe ich beantworte keine Königsblaue Anfrage... :P


    So schwer ist das gar nicht dank jQuery Mobile :-)


    1. öffne dir die custom.css, aus dem \mobile\css Verzeichniss
    2. markiere den kompletten Code und kopiere dir diesen in die Zwischenablage (STRG + C)
    3. besuche den jQuery Mobile ThemeRoller.
    4. klicke auf importieren.
    2016-08-04_20h21_08.png
    5. in das Freitextfeld fügst du nun deinen Code ein, den du zuvor in die Zwischenablage gepackt hast. (STRG + V)
    2016-08-04_20h22_19.png


    6. danach klickst du unten rechts auf Import.
    2016-08-04_20h24_02.png


    Voila, schon siehst du das aktuelle Layout aus meiner Version. Nun kannst du fröhlich via Drag and Drop die Farben austauschen, Sättigung und ggf. Schriftarten usw. ändern. Einfach mal ein bisschen rumspielen.


    2016-08-04_20h27_04.png


    7. Wenn du fertig bist, klickst du oben auf Download.
    2016-08-04_20h28_26.png
    8. Bei Theme Name trägst du custom ein und klickst unten rechts auf Download ZIP.
    9. Wenn das Zip heruntergeladen ist, öffnest du es und gehst in den Ordner Theme.
    10. die darin enthaltene custom.css tauscht du mit meiner aus, und schon hast du deine Farben.


    Ich glaube leichter kann das nicht sein. :-)


    Macht mal Screenshots von euren Layout's. bin gespannt. :-)


    Gruß
    Tino

    Das hat super für die "mittlere" Auswahl funktioniert. Wie bekomme ich diese jetzt noch für die Seitenmenues hin? Also die einzelnen Symbole entsprechend farblich zu ändern.


    Einen schönen Start ins Wochenende.



    Gesendet von iPhone mit Tapatalk

    Hi Florian,


    ich war mir heute Früh nicht sicher. Das Menü hat in dem Sinne keine eigene CSS bzw. habe ich die Icons des Menü nicht in der CSS angepast sondern in der index.php.


    Wenn du dir die index.php der mobilen Seite öffnest, findest du ab Zeile 176 die Menü Einträge für das linke Menü und ab Zeile 222 die für das rechte Menü.


    Hier eine kurze Erklärung anhand eines Links.

    HTML: ein Beispiel aus der index.php
    1. <a href="<?php echo $_SERVER['PHP_SELF']; ?>?site=start"><i style="color: #ffe500;" class="fa fa-home"></i>Start</a>


    Zwischen den Hyperlink (<a href.... </a>), sieht du das Icon definert (<i style.... </i>). Im <i></i> Tag enthalten sieht du color: #ffe500, diesen Wert musst du für jeden einzelnen Menüpunkt, auf deine gewünschte Farbe, anpassen.


    Die Icons kannst du, falls dir eins nicht gefällt, auch ganz einfach ändern. class="fa fa-home" beschreibt welches Icon da geladen wird. Eine Übersicht, welche Icons möglich sind findest du auf http://fontawesome.io/icons/. Hier dann einfach auf das gewünschte Icon klicken, und schauen was bei class hinkommen müsste um dieses Icon da zu haben.


    Beste Grüße
    Tino

    Super, jetzt ist es schon fast perfekt. Bilder anbei.

    [IMG:https://uploads.tapatalk-cdn.com/20160805/a7a311d382785810f1eb63f1564e31ae.png]
    [IMG:https://uploads.tapatalk-cdn.com/20160805/a7043a7b618ce3fb9f6713572576b949.png]
    [IMG:https://uploads.tapatalk-cdn.com/20160805/dfaf37c7f3cbe598d2362c198953996c.png]


    Nur bei einer Überschrift will der Schatten partout nicht weg.


    Gruß
    Florian



    Gesendet von iPhone mit Tapatalk

    Der Style für den Schatten wird eigentlich in der custom.css definiert. Da musst du eventuell nochmal mit dem ThemeRoller ran.


    Alternativ gehst du in die /mobile/content/spielplan.php, Zeile 166 und änderst diese wie folgt ab.



    PHP: spielplan.php
    1. <li data-role="list-divider">Spielplan der Saison <?php echo $saison['saison']?></li>
    4. ÄNDERN IN
    7. <li data-role="list-divider" style="text-shadow: none; !important">Spielplan der Saison <?php echo $saison['saison']?></li>

    Dies sorgt dafür, das der Schatten entfernt wird. Das !important hinter none; sagt aus - Egal was in irgendeiner der *.css Dateien definiert ist, DAS ist richtig, stell es mir so dar. Das none, sagt aus - kein Schatten, solltest du Schatten in einer anderen Farbe wollen, musst du anstelle none wieder einen Hexadezimal Farbcode verwenden.


    Die alternative ist nicht schön rein vom coding her, erfüllt aber seinen Zweck.


    Beste Grüße
    Tino

    Erstmal vielen Dank für die mobile Version und die Anleitung für die Farbanpassung!
    Bei mir hat alles auf Anhieb bestens geklappt.


    Nun möchte ich noch eine letzte kleine, aber feine Änderung vornehmen, welche ich nicht finden kann:
    Wie kann ich die Farbe des Menübuttons (3 waagrechte parallele Linien, sog. Hamburger-Icon) ändern?


    Das ist nötig geworden, da ich für den Hintergrund ein dunkleres blau verwende und auch die Schriftarten entsprechend auf weiß abgeändert habe.
    Da wäre es nun super, wenn auch der Menübutton in weiß erscheinen würde.

    Nicht wirklich schwer...


    HTML: mobile index.php
    1. <a href="#menu" class="animated rubberBand"><i style ="margin-top: 4px;" class="fa fa-bars fa-2x"></i></a>


    ändern in:

    Code
    1. <a href="#menu" class="animated rubberBand"><i style ="margin-top: 4px; color: #ffffff; " class="fa fa-bars fa-2x"></i></a>

    Bei Color dann deinen entsprechenden Hex-Farbcode eintragen, in meinem bsp. oben wird das Hamburger Icon weiß. Für das Zahnrad Icon machst du das selbe, findest du zwei Zeilen drunter im Code.


    Gruß

Tags