Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. Navigations Button hervorheben

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    Navigations Button hervorheben

    This topic has been deleted. Only users with topic management privileges can see it.
    • Y
      youngster91 last edited by

      Kann ich denn auch die Größe des Abzeichens ändern falls ich z.B. einen größeren Button machen will und kann ich dann in dem größeren Button die Schrift einigermaßen frei platzieren?

      Ansonsten wäre der Button genau das was ich suche, nur hätte halt gerne die Möglichkeit nicht von der maximalen Höhe des Abzeichens abhängig zu sein.

      1 Reply Last reply Reply Quote 0
      • P
        pix last edited by

        Hast du dir denn die Einstellungsmöglichkeiten des Widgets mal angesehen?

        Das Abzeichen lässt sich ziemlich frei platzieren. 261_bildschirmfoto_2016-04-16_um_02.09.01.jpg
        Den Text kannst du eben auch mit den CSS-Einstellungen von .metro .label verändern (margin, padding, rahmen, etc.). Irgendwo hier im Forum steht auch noch, wie man das nur auf eine View anwendet (also die View "Navigation" in diesem Falle).

        Letztlich gibt es noch den Workaround, sich selbst Icons in Photoshop zu basteln, die schon einen Text haben. Das Icon dann als Abzeichen verwenden. Ist erstmal mühsam, aber geht immerhin.

        Gruß

        Pix

        1 Reply Last reply Reply Quote 0
        • Y
          youngster91 last edited by

          @pix:

          Hast du dir denn die Einstellungsmöglichkeiten des Widgets mal angesehen?

          Das Abzeichen lässt sich ziemlich frei platzieren. filename="Bildschirmfoto 2016-04-16 um 02.09.01.jpg" index="0">~~ `

          Da liegt das Problem, bei mir tut sich nämlich mit den von dir gezeigten Einstellungen nichts 😉 ich versuche mal Metro zu deinstallieren und wieder drauf zu machen und melde mich dann nochmal 😉

          1 Reply Last reply Reply Quote 0
          • Y
            youngster91 last edited by

            Also auch nach deinstallieren tut sich nichts wie auf dem Bild zu sehen ist.

            http://www.bilder-upload.eu/show.php?file=d28496-1460798064.png Weiß jmd woran das liegen könnte?

            1 Reply Last reply Reply Quote 0
            • P
              pix last edited by

              Hallo youngster,

              erstmal bitte ich dich, die im Forum eingebaute Bild/Datei-Funktion zu nutzen. Wir brauchen keine externen Hoster 😉

              Du kannst die Bilddatei im Abzeichen (engl. Batch) beliebig mit CSS verschieben. Deine Installation war sicher schon korrekt. Anbei ein Screenshot und ein paar Beispielbefehle für das Batch.

              ! ````
              .metro .label {
              height: 3em;
              }
              .metro .label {
              font-size: 2em !important;
              }
              ! .metro .badge {
              height: 50px !important;
              width: 150px !important;
              border: 5px solid red !important;
              }
              ! .metro .badge img {
              height: 100% !important;
              border: 3px solid pink !important;
              padding-left: 30px !important;
              }

              
              >!  ![261_bildschirmfoto_2016-04-16_um_14.27.19.jpg](/assets/uploads/files/261_bildschirmfoto_2016-04-16_um_14.27.19.jpg) 
              Aber bedenke, dass dieser Code ****alle**** Metro-Widgets im Projekt beeinflusst. Wenn du nur ein bestimmtes Widget ändern willst, dann kannst du dessen Widgetnummer (hier W00204) als id in die CCS einbauen oder noch besser eine CSS-Klasse (ohne Punkt) in den Widgeteinstellungen definieren. Letzteres ist praktisch, wenn man mehrere Widgets gleich formatieren will. ![261_bildschirmfoto_2016-04-16_um_14.24.38.jpg](/assets/uploads/files/261_bildschirmfoto_2016-04-16_um_14.24.38.jpg) Das __!important__ hinter jedem Befehl ist nicht schön, aber notwendig, sonst gelten die Standard-Formatierungen.
              
              Wie soll denn deine Navigation aussehen? Vielleicht kann ich dir helfen.
              
              Gruß,
              
              Pix
              1 Reply Last reply Reply Quote 0
              • Y
                youngster91 last edited by

                Perfekt, genauso hab ich mir das vorgestellt danke dir 🙂

                Könntest du mir eventuell auch noch sagen, wie ich die Bildgröße ändern kann, weil wenn ich die unter badge img ändern will tut sich nichts (werder mit height, max-heigth noch sonst was) und wie lautet der Befehl um einen eigenen Icon einzufügen?

                Vielen Dank schon einmal 🙂

                1 Reply Last reply Reply Quote 0
                • P
                  pix last edited by

                  Hallo youngster,

                  das ist kein CSS Befehl, sondern das kannst du unter den Widgeteinstellungen/Abzeichen/Abzeichen URL festlegen. Dann im Pulldown Menü auf Custom stellen. Habe dir in http://forum.iobroker.net/viewtopic.php?f=30&t=2687#p23917 einen Screenshot dazu gemacht (zweiter Spoiler). Abzeichen-Höhe und Breite, sowie Position lassen sich erstmal über die Schieberegler einstellen.

                  Gruß

                  Pix

                  1 Reply Last reply Reply Quote 0
                  • S
                    Schnubbi last edited by

                    Hallo,

                    ich nutze das metro - tile navigation, jedoch keine ich keine Hintergrundfarbe wählen. Bei mir steht nur "keins".

                    Könnte mir vielleicht jemand helfen?

                    1 Reply Last reply Reply Quote 0
                    • P
                      pix last edited by

                      Ein Screenshot wäre hilfreich. Kannst du denn für die anderen Bereiche (Brandhintergrund, etc…) Farben auswählen?

                      Pix

                      1 Reply Last reply Reply Quote 0
                      • S
                        Schnubbi last edited by

                        Hallo,

                        anbei der Screenshot. Ich würde gerne einen Hintergrund einstellen, wenn ich zum Beispiel auf der "View" DG bin.
                        3093_unbenannt.jpg

                        1 Reply Last reply Reply Quote 0
                        • S
                          Superdad last edited by

                          Und wenn du mal auf den Pfeil neben "keins" drückst?

                          1 Reply Last reply Reply Quote 0
                          • S
                            Schnubbi last edited by

                            da ist dann nichts dargestellt. keine Farben

                            kann ich ohne Probleme den adapter noch deinstallieren?

                            derzeit läuft dies noch auf meinem Windows PC

                            1 Reply Last reply Reply Quote 0
                            • First post
                              Last post

                            Support us

                            ioBroker
                            Community Adapters
                            Donate

                            953
                            Online

                            31.9k
                            Users

                            80.2k
                            Topics

                            1.3m
                            Posts

                            4
                            17
                            6618
                            Loading More Posts
                            • Oldest to Newest
                            • Newest to Oldest
                            • Most Votes
                            Reply
                            • Reply as topic
                            Log in to reply
                            Community
                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                            The ioBroker Community 2014-2023
                            logo