Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. Toggle Button beim drauf zeigen blau hinterlegt.

    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

    Toggle Button beim drauf zeigen blau hinterlegt.

    This topic has been deleted. Only users with topic management privileges can see it.
    • Glasfaser
      Glasfaser @padi0-000 last edited by Glasfaser

      @padi0-000

      Verstehe es gerade nicht , warum es bei dir nicht geht 🤔

      Teste mal hiermit , damit wird die Buttonfarbe geändert.

      https://forum.iobroker.net/topic/12193/farbe-vom-nav-button-ändern/22

      -.----

      EDIT :

      Bin gerade nicht Online ........
      versuche mal damit , vielleicht habe ich was bei mir übersehen , obwohl es wie oben angegeben funktioniert.

      .UiStyle .ui-state-hover .ui-button {
       background: linear-gradient(to top, #000000, #434343) !important;
      border:black !important;
      }
      
      1 Reply Last reply Reply Quote 0
      • P
        padi0-000 last edited by

        Hallo, nein das mit der Farbe klappt auch nicht .

        Glasfaser 1 Reply Last reply Reply Quote 0
        • Glasfaser
          Glasfaser @padi0-000 last edited by

          @padi0-000 sagte in Toggle Button beim drauf zeigen blau hinterlegt.:

          Hallo, nein das mit der Farbe klappt auch nicht .

          ??...🙄

          Lege mal bitte ein neues Projekt an und füge dort den Button ein , mit der CSS.
          Was ist dann !?

          P 1 Reply Last reply Reply Quote 0
          • P
            padi0-000 @Glasfaser last edited by

            @glasfaser
            Hallo auch dort funktioniert es nicht.

            Habe noch die alte Vis 1.1.4 und Admin Adapert 2.0.9

            Bin aber auch seit einer Woche am verzweifeln bei einer Neuinstallation.

            Glasfaser 1 Reply Last reply Reply Quote 0
            • Glasfaser
              Glasfaser @padi0-000 last edited by

              @padi0-000 sagte in Toggle Button beim drauf zeigen blau hinterlegt.:

              alte Vis 1.1.4 und Admin Adapert 2.0.9

              Puhh ... das ist echt alt.

              "VIS ist 1.3.9 und Admin ist 4.2.1"

              1 Reply Last reply Reply Quote 0
              • P
                padi0-000 last edited by

                Danke dir erst mal für die Hilfe .. Wenn ich die neue Version am laufen habe , versuche ich es noch mal und gebe Rückmeldung..

                P 1 Reply Last reply Reply Quote 0
                • P
                  padi0-000 @padi0-000 last edited by

                  habe es hinbekommen aber ganz anders als von dir vorgeschlagen.

                  das hat trotz update vis und Admin nicht funktioniert
                  1.PNG

                  gibt es eine Möglichkeit wie ich das auf alle Widgets der Art anwende one es ünerall zu interlegen ?

                  1 Reply Last reply Reply Quote 0
                  • Glasfaser
                    Glasfaser last edited by Glasfaser

                    @padi0-000 sagte in Toggle Button beim drauf zeigen blau hinterlegt.:

                    gibt es eine Möglichkeit wie ich das auf alle Widgets der Art anwende one es ünerall zu interlegen ?

                    Nur über CSS Anweisungen .... aber ich habe gerade keine Ahnung warum es bei dir nicht funktioniert.

                    im CSS kannst du auch mehr mitgeben , Textart, Größe usw.

                    Wie du es manuell eingetragen hast , dann aber pro Widget wieder der CSS Eintrag .

                    .UiStyle  {
                    background: linear-gradient(to top, #000000, #434343) !important;
                    }
                    

                    Was passiert wenn du nur diesen Eintrag in CSS reinmachst :

                    .vis-view {
                        background: blue;
                    }
                    
                    P 1 Reply Last reply Reply Quote 0
                    • P
                      padi0-000 @Glasfaser last edited by

                      @glasfaser sagte in Toggle Button beim drauf zeigen blau hinterlegt.:

                      @padi0-000 sagte in Toggle Button beim drauf zeigen blau hinterlegt.:

                      gibt es eine Möglichkeit wie ich das auf alle Widgets der Art anwende one es ünerall zu interlegen ?

                      Nur über CSS Anweisungen .... aber ich habe gerade keine Ahnung warum es bei dir nicht funktioniert.

                      im CSS kannst du auch mehr mitgeben , Textart, Größe usw.

                      Wie du es manuell eingetragen hast , dann aber pro Widget wieder der CSS Eintrag .

                      .UiStyle  {
                      background: linear-gradient(to top, #000000, #434343) !important;
                      }
                      

                      Was passiert wenn du nur diesen Eintrag in CSS reinmachst :

                      .vis-view {
                          background: blue;
                      }
                      

                      wenn ich das ins CSS eintrage wird der Hintergrund blau

                      Glasfaser 1 Reply Last reply Reply Quote 0
                      • Glasfaser
                        Glasfaser @padi0-000 last edited by

                        @padi0-000

                        Lade mir mal bitte ein Widget Button hier hoch oder den View , damit ich es mal bei mir anschaue .

                        P 1 Reply Last reply Reply Quote 0
                        • P
                          padi0-000 @Glasfaser last edited by

                          @glasfaser

                          [{"tpl":"tplJquiToogle","data":{"oid":"s7.0.DBs.DB1.Schlafzimmer_Decke","g_fixed":true,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":true,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/img/bulb_on.png","signals-icon-size-0":"60","signals-blink-0":false,"signals-horz-0":"80","signals-vert-0":"","signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":"fales","signals-icon-1":"/vis/img/bulb_off.png","signals-icon-size-1":"60","signals-blink-1":false,"signals-horz-1":"80","signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"signals-oid-0":"s7.0.Outputs.1.Schlafzimmer_Decke","label":"Schlaf Decke","signals-oid-1":"s7.0.Outputs.1.Schlafzimmer_Decke"},"style":{"left":"972px","top":"140px","width":"305px","height":"80px","color":"#ffffff","text-align":"left","font-size":"xx-large","letter-spacing":"","word-spacing":"100","z-index":"2","line-height":"2","border-width":"3px","border-style":"groove"},"widgetSet":"jqui"}]
                          
                          P 1 Reply Last reply Reply Quote 0
                          • P
                            padi0-000 @padi0-000 last edited by

                            Hoffe das ist richtig so..

                            Glasfaser 1 Reply Last reply Reply Quote 0
                            • Glasfaser
                              Glasfaser @padi0-000 last edited by

                              @padi0-000

                              BEISPIEL , mit deinem Widget :

                              1.JPG

                              .UiStyle   {
                               border:#222 !important;
                               background: linear-gradient(0deg, #2c2a3f, #4f344c, #2c2a3f) !important;
                              }
                              
                              P Crazy32 2 Replies Last reply Reply Quote 0
                              • P
                                padi0-000 @Glasfaser last edited by

                                @glasfaser
                                Ja so klapp es bei mir aber der Rand ist nicht mehr so groß

                                wie bekomme ich das nun hin ? farbe habe ich mir schon entsprechend angepasst.

                                .UiStyle   {
                                
                                 border:#434343!important;
                                
                                 background: linear-gradient(to top, #121212, #666666) !important;
                                
                                }
                                
                                Glasfaser 1 Reply Last reply Reply Quote 0
                                • Glasfaser
                                  Glasfaser @padi0-000 last edited by

                                  @padi0-000

                                  So ... habe es mal gelb gemacht ?

                                  1.JPG

                                  Zusatz :

                                  border-width : 4px !important;
                                  
                                  1 Reply Last reply Reply Quote 0
                                  • P
                                    padi0-000 last edited by

                                    Super ...Danke

                                    Ich Danke für die Mühen und das einfache und simple Erklären .

                                    1 Reply Last reply Reply Quote 0
                                    • Crazy32
                                      Crazy32 @Glasfaser last edited by Crazy32

                                      @glasfaser sagte in Toggle Button beim drauf zeigen blau hinterlegt.:

                                      @padi0-000

                                      BEISPIEL , mit deinem Widget :

                                      1.JPG

                                      .UiStyle   {
                                       border:#222 !important;
                                       background: linear-gradient(0deg, #2c2a3f, #4f344c, #2c2a3f) !important;
                                      }
                                      

                                      Moin. Ich habe das gleiche Problem und @Glasfaser hat mich hierhin verwiesen. Bei mir haben wie beim Themenersteller komischerweise die obigen Tipps auch alle nicht funktioniert. Erst beim hier zitierten Post hat sich die Farbe des Buttons geändert. Aber leider nicht nur die Farbe des Buttons, sondern auch die Hintergrundfarbe der View. Wahrscheinlich weil bei View Hintergrund CSS eingestellt ist. Gibt es hierfür auch eine Lösung, damit nur die Buttonfarbe geändert wird?
                                      Ich bin momentan im Zwiespalt, einerseits gefallen mir die Buttons ganz gut, andererseits überlege ich, ob ich mir selber einen aus basic image und basic html state bastel.

                                      1.png

                                      EDIT: Ich habe im Netz noch ein bisschen rumgesucht und auf dieser Seite was zum Thema CSS gefunden. Mit dem unten stehenden Code habe ich dann die Buttons einfärben können, ohne das sich der Hintergrund der View auch ändert.

                                      }
                                      .black{
                                          color:#ececec;
                                          background: linear-gradient(to bottom, #5b5b5b 0%,#0c0c0c 100%);
                                          border-color: #0c0c0c;
                                      }
                                      
                                      1 Reply Last reply Reply Quote 0
                                      • First post
                                        Last post

                                      Support us

                                      ioBroker
                                      Community Adapters
                                      Donate

                                      451
                                      Online

                                      31.8k
                                      Users

                                      79.9k
                                      Topics

                                      1.3m
                                      Posts

                                      3
                                      25
                                      1519
                                      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