Skip to content
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Standard: (Kein Skin)
  • Kein Skin
Einklappen
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. Button der Farbe ändert

NEWS

  • Weihnachtsangebot 2025! 🎄
    BluefoxB
    Bluefox
    21
    1
    861

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    9.0k

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    2.4k

Button der Farbe ändert

Geplant Angeheftet Gesperrt Verschoben Visualisierung
39 Beiträge 7 Kommentatoren 2.5k Aufrufe 5 Watching
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • OliverIOO OliverIO

    @codierknecht

    und wie sieht dein css aus?
    das setzen der css klasse funktioniert bei mir auch.
    aber bei button state kommt die regel nicht durch, da sie durch andere regeln überpriorisiert werden.

    mach bitte mal komplettes beispiel wenn es bei dir funktioniert

    CodierknechtC Online
    CodierknechtC Online
    Codierknecht
    Developer Most Active
    schrieb am zuletzt editiert von Codierknecht
    #30

    @oliverio
    Ups, hätte ich ja auch gleich mal dazupacken können - sorry.

    .vis-button button.ui-state-default {
        background-color: blue;
        background-image: none;
        color: white;
    }
    
    
    .vis-button button.ui-state-default:active {
        background-color: green;
        color: red;
    }
    

    2023-04-07-main.zip

    "Any fool can write code that a computer can understand. Good programmers write code that humans can understand." (Martin Fowler, "Refactoring")

    Proxmox 9.1.1 LXC|8 GB|Core i7-6700
    HmIP|ZigBee|Tasmota|Unifi
    Zabbix Certified Specialist
    Konnte ich Dir helfen? Dann benutze bitte das Voting unten rechts im Beitrag

    1 Antwort Letzte Antwort
    0
    • OliverIOO OliverIO

      @codierknecht

      und wie sieht dein css aus?
      das setzen der css klasse funktioniert bei mir auch.
      aber bei button state kommt die regel nicht durch, da sie durch andere regeln überpriorisiert werden.

      mach bitte mal komplettes beispiel wenn es bei dir funktioniert

      CodierknechtC Online
      CodierknechtC Online
      Codierknecht
      Developer Most Active
      schrieb am zuletzt editiert von
      #31

      @oliverio sagte in Button der Farbe ändert:

      aber bei button state kommt die regel nicht durch, da sie durch andere regeln überpriorisiert werden.

      Kannst Du das nicht mit !important erzwingen?

      "Any fool can write code that a computer can understand. Good programmers write code that humans can understand." (Martin Fowler, "Refactoring")

      Proxmox 9.1.1 LXC|8 GB|Core i7-6700
      HmIP|ZigBee|Tasmota|Unifi
      Zabbix Certified Specialist
      Konnte ich Dir helfen? Dann benutze bitte das Voting unten rechts im Beitrag

      OliverIOO 1 Antwort Letzte Antwort
      0
      • CodierknechtC Codierknecht

        @oliverio sagte in Button der Farbe ändert:

        aber bei button state kommt die regel nicht durch, da sie durch andere regeln überpriorisiert werden.

        Kannst Du das nicht mit !important erzwingen?

        OliverIOO Offline
        OliverIOO Offline
        OliverIO
        schrieb am zuletzt editiert von OliverIO
        #32

        @codierknecht

        ne klappt nicht.
        markiert habe ich das button element.
        du siehst die css regel (unterer roter rahmen) wird durch eine regel von vis/jqui (oberer roter rahmen) überschrieben, da diese einen id enthält (also mit #visview_test) und deine regel nur einen klassennamen. id hat prio über klassennamen.

        9b453618-b44e-4e48-a0ed-9921dc52f198-image.png

        wie sieht das bei dir aus? du hast ja kein important verwendet?

        mit important funktioniert es. hm hab ich wohl in der kombination nicht probiert.

        dennoch wäre es besser wenn vis bei den css regeln sich nicht auf den id des containers, sondern nur auf einen css-namen des containers beziehen würde. dann hätte man die chance mit normalen regeln das design zu beeinflussen

        Meine Adapter und Widgets
        TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
        Links im Profil

        CodierknechtC 1 Antwort Letzte Antwort
        0
        • OliverIOO OliverIO

          @codierknecht

          ne klappt nicht.
          markiert habe ich das button element.
          du siehst die css regel (unterer roter rahmen) wird durch eine regel von vis/jqui (oberer roter rahmen) überschrieben, da diese einen id enthält (also mit #visview_test) und deine regel nur einen klassennamen. id hat prio über klassennamen.

          9b453618-b44e-4e48-a0ed-9921dc52f198-image.png

          wie sieht das bei dir aus? du hast ja kein important verwendet?

          mit important funktioniert es. hm hab ich wohl in der kombination nicht probiert.

          dennoch wäre es besser wenn vis bei den css regeln sich nicht auf den id des containers, sondern nur auf einen css-namen des containers beziehen würde. dann hätte man die chance mit normalen regeln das design zu beeinflussen

          CodierknechtC Online
          CodierknechtC Online
          Codierknecht
          Developer Most Active
          schrieb am zuletzt editiert von
          #33

          @oliverio sagte in Button der Farbe ändert:

          wie sieht das bei dir aus? du hast ja kein important verwendet?

          Nö - ist ja nur meine Testkiste - da ist nix weiter drauf.

          ID sticht Klasse - stimmt.
          Aber wenn's dann mit !important läuft ... um so besser ;-)

          "Any fool can write code that a computer can understand. Good programmers write code that humans can understand." (Martin Fowler, "Refactoring")

          Proxmox 9.1.1 LXC|8 GB|Core i7-6700
          HmIP|ZigBee|Tasmota|Unifi
          Zabbix Certified Specialist
          Konnte ich Dir helfen? Dann benutze bitte das Voting unten rechts im Beitrag

          1 Antwort Letzte Antwort
          0
          • bergjetB Offline
            bergjetB Offline
            bergjet
            schrieb am zuletzt editiert von
            #34

            Hat nichts mit mir zu tun, oder?

            homee, ioBroker, iMac, iPhone, Sonos, Alaxa

            CodierknechtC 1 Antwort Letzte Antwort
            0
            • bergjetB bergjet

              Hat nichts mit mir zu tun, oder?

              CodierknechtC Online
              CodierknechtC Online
              Codierknecht
              Developer Most Active
              schrieb am zuletzt editiert von
              #35

              @bergjet sagte in Button der Farbe ändert:

              Hat nichts mit mir zu tun, oder?

              Eigentlich schon.

              Du hast ja vermutlich mehr als nur 1 Button, den Du so behandeln willst.
              Das ist mit 'ner CSS-Klasse etwas einfacher als die ganzen ID's der Buttons in das CSS zu klöppeln.
              Man kann im Editor dann einfach alle Buttons markieren und denen die CSS-Klasse verpassen.
              Wenn keine CSS-Einstellungen zu ID's die der Klasse übersteuern (ID sticht Klasse), sollte das so funktionieren.

              "Any fool can write code that a computer can understand. Good programmers write code that humans can understand." (Martin Fowler, "Refactoring")

              Proxmox 9.1.1 LXC|8 GB|Core i7-6700
              HmIP|ZigBee|Tasmota|Unifi
              Zabbix Certified Specialist
              Konnte ich Dir helfen? Dann benutze bitte das Voting unten rechts im Beitrag

              bergjetB 1 Antwort Letzte Antwort
              0
              • bergjetB bergjet

                @bananajoe sagte in Button der Farbe ändert:

                so etwas?

                Ja, so sollte es aussehen. Ist halt etwas aufwendig.

                BananaJoeB Offline
                BananaJoeB Offline
                BananaJoe
                Most Active
                schrieb am zuletzt editiert von
                #36

                @bergjet sagte in Button der Farbe ändert:

                @bananajoe sagte in Button der Farbe ändert:

                so etwas?

                Ja, so sollte es aussehen. Ist halt etwas aufwendig.

                Du startest doch sowieso ein Skript. Oder besser, weil so soll man es ja machen: Du Triggerst es an.
                Und damit es neu angetriggert werden kann muss du den Datenpunkt sowieso wieder auf Falsch setzen.
                Also, entweder gar keine oder nur eine Zeile mehr in dem Skript.

                Punkt 2 wäre das du dir dadurch ja auch gleiche eine "Läuft" Anzeige bauen kannst. So nutze ich es beim manuellen Backup.
                Ich trigger an mit dem Widget, solange das Backup läuft ist es aktiv, ist das Backup fertig geht es wieder aus.

                ioBroker@Ubuntu 24.04 LTS (VMware) für: >260 Geräte, 5 Switche, 7 AP, 9 IP-Cam, 1 NAS 42TB, 1 ESXi 15TB, 4 Proxmox 1TB, 1 Hyper-V 48TB, 14 x Echo, 5x FireTV, 5 x Tablett/Handy VIS || >=160 Tasmota/Shelly || >=95 ZigBee || PV 8.1kW / Akku 14kWh || 2x USV 750W kaskadiert || Creality CR-10 SE 3D-Drucker

                1 Antwort Letzte Antwort
                0
                • CodierknechtC Codierknecht

                  @bergjet sagte in Button der Farbe ändert:

                  Hat nichts mit mir zu tun, oder?

                  Eigentlich schon.

                  Du hast ja vermutlich mehr als nur 1 Button, den Du so behandeln willst.
                  Das ist mit 'ner CSS-Klasse etwas einfacher als die ganzen ID's der Buttons in das CSS zu klöppeln.
                  Man kann im Editor dann einfach alle Buttons markieren und denen die CSS-Klasse verpassen.
                  Wenn keine CSS-Einstellungen zu ID's die der Klasse übersteuern (ID sticht Klasse), sollte das so funktionieren.

                  bergjetB Offline
                  bergjetB Offline
                  bergjet
                  schrieb am zuletzt editiert von
                  #37

                  @codierknecht sagte in Button der Farbe ändert:

                  @bergjet sagte in Button der Farbe ändert:

                  Hat nichts mit mir zu tun, oder?

                  Eigentlich schon.

                  Du hast ja vermutlich mehr als nur 1 Button, den Du so behandeln willst.
                  Das ist mit 'ner CSS-Klasse etwas einfacher als die ganzen ID's der Buttons in das CSS zu klöppeln.
                  Man kann im Editor dann einfach alle Buttons markieren und denen die CSS-Klasse verpassen.
                  Wenn keine CSS-Einstellungen zu ID's die der Klasse übersteuern (ID sticht Klasse), sollte das so funktionieren.

                  Bei mir funktioniert das nicht. In der CSS-Klasse wird mir ein "vis-style-green-gray" angeboten. Wenn ich aber "vis-button" eingebe, passiert nichts.

                  homee, ioBroker, iMac, iPhone, Sonos, Alaxa

                  OliverIOO 1 Antwort Letzte Antwort
                  0
                  • bergjetB bergjet

                    @codierknecht sagte in Button der Farbe ändert:

                    @bergjet sagte in Button der Farbe ändert:

                    Hat nichts mit mir zu tun, oder?

                    Eigentlich schon.

                    Du hast ja vermutlich mehr als nur 1 Button, den Du so behandeln willst.
                    Das ist mit 'ner CSS-Klasse etwas einfacher als die ganzen ID's der Buttons in das CSS zu klöppeln.
                    Man kann im Editor dann einfach alle Buttons markieren und denen die CSS-Klasse verpassen.
                    Wenn keine CSS-Einstellungen zu ID's die der Klasse übersteuern (ID sticht Klasse), sollte das so funktionieren.

                    Bei mir funktioniert das nicht. In der CSS-Klasse wird mir ein "vis-style-green-gray" angeboten. Wenn ich aber "vis-button" eingebe, passiert nichts.

                    OliverIOO Offline
                    OliverIOO Offline
                    OliverIO
                    schrieb am zuletzt editiert von OliverIO
                    #38

                    @bergjet

                    hier mal nochmal ein vollständiges beispiel.
                    Das so in den css-reiter kopieren.

                    .vis-button button.ui-state-default {
                        background-color: blue !important;
                        background-image: none !important;
                        color: white !important ;
                    }
                     
                     
                    .vis-button button.ui-state-default:active {
                        background-color: green !important;
                        color: red !important;
                    }
                    

                    Bei den Knöpfen wo du das Design anwenden wills im Feld CSS Class dann
                    vis-button
                    eintragen
                    du siehst mir wird das vis-style-gree-gray auch angeboten. Woher das auch immer kommt. aber du trägst mit Tastatur genau das vis-button ein (ohne Punkt davor)
                    406321b5-b90e-4c53-aa80-469e821724f0-image.png

                    Im Screenshot siehst du einen Knopf mit und einen ohne

                    Meine Adapter und Widgets
                    TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
                    Links im Profil

                    bergjetB 1 Antwort Letzte Antwort
                    1
                    • OliverIOO OliverIO

                      @bergjet

                      hier mal nochmal ein vollständiges beispiel.
                      Das so in den css-reiter kopieren.

                      .vis-button button.ui-state-default {
                          background-color: blue !important;
                          background-image: none !important;
                          color: white !important ;
                      }
                       
                       
                      .vis-button button.ui-state-default:active {
                          background-color: green !important;
                          color: red !important;
                      }
                      

                      Bei den Knöpfen wo du das Design anwenden wills im Feld CSS Class dann
                      vis-button
                      eintragen
                      du siehst mir wird das vis-style-gree-gray auch angeboten. Woher das auch immer kommt. aber du trägst mit Tastatur genau das vis-button ein (ohne Punkt davor)
                      406321b5-b90e-4c53-aa80-469e821724f0-image.png

                      Im Screenshot siehst du einen Knopf mit und einen ohne

                      bergjetB Offline
                      bergjetB Offline
                      bergjet
                      schrieb am zuletzt editiert von
                      #39

                      @oliverio Ja, jetzt geht es. Ich habe zuvor den Code vom Posting weiter oben eingefügt (dort gab es noch kein !important).
                      Danke.

                      homee, ioBroker, iMac, iPhone, Sonos, Alaxa

                      1 Antwort Letzte Antwort
                      0
                      Antworten
                      • In einem neuen Thema antworten
                      Anmelden zum Antworten
                      • Älteste zuerst
                      • Neuste zuerst
                      • Meiste Stimmen


                      Support us

                      ioBroker
                      Community Adapters
                      Donate

                      608

                      Online

                      32.5k

                      Benutzer

                      81.6k

                      Themen

                      1.3m

                      Beiträge
                      Community
                      Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                      ioBroker Community 2014-2025
                      logo
                      • Anmelden

                      • Du hast noch kein Konto? Registrieren

                      • Anmelden oder registrieren, um zu suchen
                      • Erster Beitrag
                        Letzter Beitrag
                      0
                      • Home
                      • Aktuell
                      • Tags
                      • Ungelesen 0
                      • Kategorien
                      • Unreplied
                      • Beliebt
                      • GitHub
                      • Docu
                      • Hilfe