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

  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. [Projekt] Material Design CSS für ioBroker.vis

NEWS

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

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

  • Neues Video "KI im Smart Home" - ioBroker plus n8n
    BluefoxB
    Bluefox
    15
    1
    2.4k

[Projekt] Material Design CSS für ioBroker.vis

Geplant Angeheftet Gesperrt Verschoben Visualisierung
650 Beiträge 111 Kommentatoren 220.6k Aufrufe 68 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.
  • C Offline
    C Offline
    cortezz
    schrieb am zuletzt editiert von cortezz
    #513

    Moin moin,

    Ich habe folgendes Problem: Wenn ich in der Vis eine Checkbox betätige, dann werden auch einige andere Checkboxen bewegt. Auch passt der Status ab zu nicht zu dem Angezeigten Status.

    Im HTML steht unter label die zum Widget passende ID (<label for="w00057_checkbox"><label>) und sie kommt auch nicht bei dem Widget, dass fälschlicherweise mit schaltet vor. Ich klicke beispielsweise auf die Box Spots im Büro und die Box für die Spots im Bad schaltet einfach mit.

    Die Checkboxen sind an KNX Datenpunkten verknüpft, diese haben keine verknüpften Status-Adressen, die dazwischen funken könnten, auf dem Bus geht auch Tatsächlich nur nur die eine Leuchte an, die geschaltet wurde.
    Hat jemand eine Idee hierzu? Vielen Dank!

    Und nochmal danke an Uhula für die Klasse arbeit mit dem MD!!Unbenannt.PNG Unbenannt1.PNG

    1 Antwort Letzte Antwort
    0
    • jpgorganizerJ jpgorganizer

      @Uhula Danke

      @Dominik-F


      @Uhula said in [Projekt] Material Design CSS für ioBroker.vis:

      @jpgorganizer Das Anordnungen der Cards auf dem gesamten Screen hat mit den flex Boxen zu tun, wenn diese sich auch in der Höhe anpassen sollen. Dann ist im pageXXX für den content mdui-flex-stretch gesetzt. Einfach wegnehmen, dann bleiben alle cards oben.

      das dürfte dann deine Frage beantworten

      @Uhula said in [Projekt] Material Design CSS für ioBroker.vis:

      Das je Page ein view nur 1x dargestellt werden kann ist eine Beschränkung durch vis, lässt sich nicht ändern.

      Hatte ich befürchtet

      @Uhula said in [Projekt] Material Design CSS für ioBroker.vis:

      ch würde den Text stattdessen in einen State setzen und den jeweils anzeigen.

      schon, aber dann muss ich die View ja mehrfach aufbauen oder habe ich dich falsch verstanden.

      Grüße jpgorganizer

      UhulaU Offline
      UhulaU Offline
      Uhula
      schrieb am zuletzt editiert von
      #514

      @jpgorganizer Das hast du falsch verstanden. Da du nur Texte darstellen möchtest, kannst du diese in einen vis-State (z.B. vis.0.myText) setzen (geht auch mit HTML-Angaben). Und diesen vis-State zeigst du dann auf den entsprechenden views an. Ist der Text variabel, nutzt du entweder das vis-Binding (mir {}) oder setzt den State über ein Script.

      @Dominik-F Nein, noch gibt es keine Möglichkeit einer card mitzuteilen, dass sie per Vorgabe geschlossen sein soll. Aber ich habe eine Idee der Umsetzung: Einführung eines "mdui-onload", welches dann dazu führt, dass die mit dem Button verknüpfte Funktion beim Laden der Page ausgeführt wird. Du müsstest dann dem Button also "mdui-button mdui-expand mdui-onload" zuweisen. Demnächst ...

      @cortezz Es gibt nur zwei Gründe, warum Switches "parallel" schalten: Entweder die <label> Angabe im "HTML anhängen" ist falsch, oder der Switch hat den Bezug zum gleichen Objekt unter "Objekt ID"

      Ich spiele im Moment mit Grafana (Grafikserver) rum und versuche die Grafiken im MD CSS 2.0 steuern zu können. Möchte meine flot-Grafiken ersetzen. Funktioniert schon gut. Mehr, wenn es final ist.
      98013d30-c40e-4c34-a5e3-2d33c8c07575-image.png

      Uhula - Leise und Weise
      Ex: ioBroker on Gigabyte NUC Proxmox

      P 1 Antwort Letzte Antwort
      0
      • C Offline
        C Offline
        cortezz
        schrieb am zuletzt editiert von
        #515

        @Uhula Tatsächlich, ich hab beim Kopieren wohl vergessen die Objekt ID zu ersetzen :face_with_rolling_eyes:

        1 Antwort Letzte Antwort
        0
        • jpgorganizerJ Offline
          jpgorganizerJ Offline
          jpgorganizer
          schrieb am zuletzt editiert von jpgorganizer
          #516

          @Uhula, danke für die Klarstellung im Post zuvor. So werd ich es wohl machen.

          Ich hänge aber auch schon wieder am nächsten Problem.
          Ich versuche einen Button zum Löschen zu implementieren. Das Löschen ansich ist nicht das Problem, der Button eigentlich auch nicht, sondern die Abfolge.

          Löschen ist ja immer so eine endgültige Sache :-) Deshalb möchte ich die allseits bekannten Nachfragedialoge einsetzen. Mein geplanter Ablauf:

          • ich öffne eine Bearbeiten View. Hier kann ich einige Dinge tun und eben auch löschen
          • Zum Löschen gibt es einen Button, wird dieser gedrückt
            • kommt eine neue View mit der Nachfrage "Wirklich löschen?" und zwei Buttons ja/nein.
              • Egal welchen Button man nun drückt, soll die aktuelle View als auch die View zuvor geschlossen werden. (die Bearbeitenview darf auch gerne schon schließen, wenn man den Lösch-Button drückt)

          Ich hab gerade keinen Plan.

          Aufgehen tun die Views. Zugehen noch nicht.

          Grüße jpgorganizer

          Bitte keine Fragen per PN, die gehören ins Forum!

          ioBroker
          smartgarden Adapter für GARDENA smart system
          Plattform: Raspberry Pi OS Linux 12 (bookworm), Node.js: v18.18.2, NPM: 9.8.1

          1 Antwort Letzte Antwort
          0
          • UhulaU Uhula

            @jpgorganizer Das hast du falsch verstanden. Da du nur Texte darstellen möchtest, kannst du diese in einen vis-State (z.B. vis.0.myText) setzen (geht auch mit HTML-Angaben). Und diesen vis-State zeigst du dann auf den entsprechenden views an. Ist der Text variabel, nutzt du entweder das vis-Binding (mir {}) oder setzt den State über ein Script.

            @Dominik-F Nein, noch gibt es keine Möglichkeit einer card mitzuteilen, dass sie per Vorgabe geschlossen sein soll. Aber ich habe eine Idee der Umsetzung: Einführung eines "mdui-onload", welches dann dazu führt, dass die mit dem Button verknüpfte Funktion beim Laden der Page ausgeführt wird. Du müsstest dann dem Button also "mdui-button mdui-expand mdui-onload" zuweisen. Demnächst ...

            @cortezz Es gibt nur zwei Gründe, warum Switches "parallel" schalten: Entweder die <label> Angabe im "HTML anhängen" ist falsch, oder der Switch hat den Bezug zum gleichen Objekt unter "Objekt ID"

            Ich spiele im Moment mit Grafana (Grafikserver) rum und versuche die Grafiken im MD CSS 2.0 steuern zu können. Möchte meine flot-Grafiken ersetzen. Funktioniert schon gut. Mehr, wenn es final ist.
            98013d30-c40e-4c34-a5e3-2d33c8c07575-image.png

            P Offline
            P Offline
            Pittini
            Developer
            schrieb am zuletzt editiert von
            #517

            @Uhula sagte in [Projekt] Material Design CSS für ioBroker.vis:

            Ich spiele im Moment mit Grafana (Grafikserver) rum und versuche die Grafiken im MD CSS 2.0 steuern zu können.

            Sag bloß, ich hab Dich angefixxt? :)

            UhulaU 1 Antwort Letzte Antwort
            0
            • P Pittini

              @Uhula sagte in [Projekt] Material Design CSS für ioBroker.vis:

              Ich spiele im Moment mit Grafana (Grafikserver) rum und versuche die Grafiken im MD CSS 2.0 steuern zu können.

              Sag bloß, ich hab Dich angefixxt? :)

              UhulaU Offline
              UhulaU Offline
              Uhula
              schrieb am zuletzt editiert von
              #518

              @Pittini Sagen wir so: Du hast mich auf eine gute flot-Alternative gebracht ;-) An flot hat mich immer die Eingeschränkheit und die Langsamkeit gestört. Mal sehen, was Grafana so bietet. Über eine URL-Injection ist es gut steuerbar.

              @jpgorganizer Das Dialog-Close hat nichts mit dem MD CSS zu tun. Trotzdem ein Tipp, wie du es machen könntest. Du hast einen Button A zum Öffnen des Dialogs A, dort setzt du bei "Objekt ID" z.B. vis.0.close_dialog und als Wert 0. Bei der Eigenschaft "Autoclose in ms" gibst du {vis.0.close_dialog} ein (vis-Binding nutzen).
              Im DIalog A hast du den Button B (Löschen) zum Öffnen des Dialogs B, dort setzt du bei "Objekt ID" auch vis.0.close_dialog und als Wert 2000 - dann sollte sich DIalog A nach 2 Sek schließen.
              Alternativ, was ich machen würde: Die Bearbeitung wäre eine eigene pageXXXX, kein Dialog.

              Uhula - Leise und Weise
              Ex: ioBroker on Gigabyte NUC Proxmox

              Dominik F.D Homer.J.H 2 Antworten Letzte Antwort
              0
              • UhulaU Uhula

                @Pittini Sagen wir so: Du hast mich auf eine gute flot-Alternative gebracht ;-) An flot hat mich immer die Eingeschränkheit und die Langsamkeit gestört. Mal sehen, was Grafana so bietet. Über eine URL-Injection ist es gut steuerbar.

                @jpgorganizer Das Dialog-Close hat nichts mit dem MD CSS zu tun. Trotzdem ein Tipp, wie du es machen könntest. Du hast einen Button A zum Öffnen des Dialogs A, dort setzt du bei "Objekt ID" z.B. vis.0.close_dialog und als Wert 0. Bei der Eigenschaft "Autoclose in ms" gibst du {vis.0.close_dialog} ein (vis-Binding nutzen).
                Im DIalog A hast du den Button B (Löschen) zum Öffnen des Dialogs B, dort setzt du bei "Objekt ID" auch vis.0.close_dialog und als Wert 2000 - dann sollte sich DIalog A nach 2 Sek schließen.
                Alternativ, was ich machen würde: Die Bearbeitung wäre eine eigene pageXXXX, kein Dialog.

                Dominik F.D Offline
                Dominik F.D Offline
                Dominik F.
                schrieb am zuletzt editiert von
                #519

                @Uhula

                das klingt sehr gut, ich freue mich dann schon auf die neue Funktion:)
                mir ist aufgefallen, dass die automatische Schriftfarbe nicht immer funktioniert, habe manchmal kommt es vor, dass bei dunklem Hintergrund die Schriftfarbe schwarz ist, erst nach erneutem anwählen der Page oder auch Neuladen wird die Schriftfarbe weiß.

                @jpgorganizer ich nutze um Dialoge zu schließen folgendes Widget:

                [{"tpl":"tplJquiButtonDialogClose","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","buttontext":"SCHLIESSEN","iconClass":"","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"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,"class":"mdui-button mdui-closebtn","dlgName":"","no_style":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},"style":{"left":"180px","top":"370px","width":"131px","height":"30px"},"widgetSet":"jqui"}]
                

                vielleicht ist es ja das was du suchst

                1 Antwort Letzte Antwort
                0
                • UhulaU Uhula

                  @Pittini Sagen wir so: Du hast mich auf eine gute flot-Alternative gebracht ;-) An flot hat mich immer die Eingeschränkheit und die Langsamkeit gestört. Mal sehen, was Grafana so bietet. Über eine URL-Injection ist es gut steuerbar.

                  @jpgorganizer Das Dialog-Close hat nichts mit dem MD CSS zu tun. Trotzdem ein Tipp, wie du es machen könntest. Du hast einen Button A zum Öffnen des Dialogs A, dort setzt du bei "Objekt ID" z.B. vis.0.close_dialog und als Wert 0. Bei der Eigenschaft "Autoclose in ms" gibst du {vis.0.close_dialog} ein (vis-Binding nutzen).
                  Im DIalog A hast du den Button B (Löschen) zum Öffnen des Dialogs B, dort setzt du bei "Objekt ID" auch vis.0.close_dialog und als Wert 2000 - dann sollte sich DIalog A nach 2 Sek schließen.
                  Alternativ, was ich machen würde: Die Bearbeitung wäre eine eigene pageXXXX, kein Dialog.

                  Homer.J.H Offline
                  Homer.J.H Offline
                  Homer.J.
                  schrieb am zuletzt editiert von
                  #520

                  Hallo @Uhula hab jetzt angefangen meine Vis auf 2.0 umzustellen ist wirklich richtig cool geworden.
                  1 Frage wie kann ich im Vis den Hintergrund von weiß auf eine andere Farbe umstellen man sieht sonst nicht viel wenn man manche Sachen bearbeiten will.

                  Grüße Homer.J.

                  UhulaU 1 Antwort Letzte Antwort
                  0
                  • jpgorganizerJ Offline
                    jpgorganizerJ Offline
                    jpgorganizer
                    schrieb am zuletzt editiert von jpgorganizer
                    #521

                    @Uhula

                    ich möchte einen wirklich 'kleinen' Button, d.h. der Button selbst soll evtl. gar nicht so klein sein, sondern nur die Schrift. In den MD CSS ist die font-size bei mdui-button ja fix auf 1em eingestellt.
                    Ich dachte mir nun, versuche ich mich mal an CSS. Vielleicht nicht meine schlaueste Idee heute :-(

                    Ich habe nun in der CSS ganz am Ende eingefügt (in 2017 hattest du solch eine Lösung mal empfohlen - evtl. ist das mit MD2.0 nicht mehr richtig)

                    .mdui-font-small {
                    font-size:0.8em !important;
                    }
                    

                    und habe dem Button in VIS nun zugewiesen:

                    mdui-button mdui-font-small 
                    

                    Aber es geht nicht sieht beides mal genau gleich aus.. Dachte zuerst, die Reihenfolge sei wichtig, aber auch nicht. Mit den Werten habe ich auch schon rumgespielt. Es sieht so aus, als ob er meine eigene Klasse ignoriert. Aber warum?

                    8d7236d7-6eb3-4e85-aec7-85829a3a4772-grafik.png

                    Grüße
                    jpgorganizer

                    Bitte keine Fragen per PN, die gehören ins Forum!

                    ioBroker
                    smartgarden Adapter für GARDENA smart system
                    Plattform: Raspberry Pi OS Linux 12 (bookworm), Node.js: v18.18.2, NPM: 9.8.1

                    UhulaU 1 Antwort Letzte Antwort
                    0
                    • jpgorganizerJ jpgorganizer

                      @Uhula

                      ich möchte einen wirklich 'kleinen' Button, d.h. der Button selbst soll evtl. gar nicht so klein sein, sondern nur die Schrift. In den MD CSS ist die font-size bei mdui-button ja fix auf 1em eingestellt.
                      Ich dachte mir nun, versuche ich mich mal an CSS. Vielleicht nicht meine schlaueste Idee heute :-(

                      Ich habe nun in der CSS ganz am Ende eingefügt (in 2017 hattest du solch eine Lösung mal empfohlen - evtl. ist das mit MD2.0 nicht mehr richtig)

                      .mdui-font-small {
                      font-size:0.8em !important;
                      }
                      

                      und habe dem Button in VIS nun zugewiesen:

                      mdui-button mdui-font-small 
                      

                      Aber es geht nicht sieht beides mal genau gleich aus.. Dachte zuerst, die Reihenfolge sei wichtig, aber auch nicht. Mit den Werten habe ich auch schon rumgespielt. Es sieht so aus, als ob er meine eigene Klasse ignoriert. Aber warum?

                      8d7236d7-6eb3-4e85-aec7-85829a3a4772-grafik.png

                      Grüße
                      jpgorganizer

                      UhulaU Offline
                      UhulaU Offline
                      Uhula
                      schrieb am zuletzt editiert von
                      #522

                      @jpgorganizer Das funktioniert bei mir ... deine CSS Anweisungen müssen hinter den anderen stehen, also weiter unten im CSS Projekt. Warum es bei dir nicht funkioniert, weiß ich nicht. Wenn du

                      .mdui-button.mdui-font-small {
                      font-size:0.8em !important;
                      }
                      

                      schreibst, erhöhst du die Selektivität der Anweisung, vielleicht hilft das.

                      Uhula - Leise und Weise
                      Ex: ioBroker on Gigabyte NUC Proxmox

                      1 Antwort Letzte Antwort
                      0
                      • Homer.J.H Homer.J.

                        Hallo @Uhula hab jetzt angefangen meine Vis auf 2.0 umzustellen ist wirklich richtig cool geworden.
                        1 Frage wie kann ich im Vis den Hintergrund von weiß auf eine andere Farbe umstellen man sieht sonst nicht viel wenn man manche Sachen bearbeiten will.

                        Grüße Homer.J.

                        UhulaU Offline
                        UhulaU Offline
                        Uhula
                        schrieb am zuletzt editiert von
                        #523

                        @Homer-J Das macht die CSS Projekt eigentlich schon, auf #f8f8f8

                        .vis_container>div {
                            background: #f8f8f8 !important;
                        }
                        

                        Kannst du dir anpassen.

                        Uhula - Leise und Weise
                        Ex: ioBroker on Gigabyte NUC Proxmox

                        Homer.J.H 1 Antwort Letzte Antwort
                        0
                        • UhulaU Uhula

                          @Homer-J Das macht die CSS Projekt eigentlich schon, auf #f8f8f8

                          .vis_container>div {
                              background: #f8f8f8 !important;
                          }
                          

                          Kannst du dir anpassen.

                          Homer.J.H Offline
                          Homer.J.H Offline
                          Homer.J.
                          schrieb am zuletzt editiert von
                          #524

                          @Uhula andere Farbe genommen und geht Danke.

                          1 Antwort Letzte Antwort
                          0
                          • T Offline
                            T Offline
                            tobiv
                            schrieb am zuletzt editiert von
                            #525

                            Hallo, gibt es bereits bzw. wird es auch eine MD_Simple 2.0 geben?

                            UhulaU 1 Antwort Letzte Antwort
                            0
                            • mrFenyxM Offline
                              mrFenyxM Offline
                              mrFenyx
                              schrieb am zuletzt editiert von
                              #526

                              Hi,
                              erstens, danke an @Uhula für dieses Projekt. Ich habe aber eine Frage. Ich habe einige Widgets selbst erstellt. Die Breite der Widgets (und dessen Inhalt) ist basiert auf die "cols" Größe des Elementes, also 156px, 312px, etc. Im Vis Editor sieht das ganz gut aus:

                              vis_editor.png

                              Das Problem ist dass wenn die eigentliche Breite des "Viewers" (Browser oder Handy Bildschirm) nicht genau passt werden die Widgets ein bisschen komisch angezeigt:

                              vis_view.png

                              Gibt es eine Möglichkeit entweder den Inhalt in jedes mdui-card zu zentrieren so dass diese extra Pixel links und rechts vom Inhalt sind oder die automatische Anpassung der Breite zu verhindern?

                              Danke!

                              1 Antwort Letzte Antwort
                              0
                              • T tobiv

                                Hallo, gibt es bereits bzw. wird es auch eine MD_Simple 2.0 geben?

                                UhulaU Offline
                                UhulaU Offline
                                Uhula
                                schrieb am zuletzt editiert von
                                #527

                                @tobiv Wird es geben, bis dahin aus dem MD_Demo kopieren.

                                @mrFenyx Ich vermute, du nutzt noch die v1.0, wegen der col-Breite von 156px, die v2.0 arbeitet mit 80px Breite für eine feinere Granularität. Ich weiß nicht mehr, wie es vor 2 Jahren in der v1.0 war, aber in der v2.0 ist es so, dass die mdui-cols-(N) Angaben eine Breitentoleranz von 10% haben um ungenutzte rechte Bereiche im content (der mdui-flex hat) mit nutzen zu können. Bsp: mdui-cols-2 = 160 bis 176px.
                                Wenn das nicht gewünscht ist, lässt es sich in v2.0 verhindern. Dazu muss man lediglich den toc-Wert (to column) mit angeben. Also statt "mdui-cols-2" dann "mdui-cols-2-toc-2".

                                Uhula - Leise und Weise
                                Ex: ioBroker on Gigabyte NUC Proxmox

                                Dominik F.D mrFenyxM 2 Antworten Letzte Antwort
                                0
                                • UhulaU Uhula

                                  @tobiv Wird es geben, bis dahin aus dem MD_Demo kopieren.

                                  @mrFenyx Ich vermute, du nutzt noch die v1.0, wegen der col-Breite von 156px, die v2.0 arbeitet mit 80px Breite für eine feinere Granularität. Ich weiß nicht mehr, wie es vor 2 Jahren in der v1.0 war, aber in der v2.0 ist es so, dass die mdui-cols-(N) Angaben eine Breitentoleranz von 10% haben um ungenutzte rechte Bereiche im content (der mdui-flex hat) mit nutzen zu können. Bsp: mdui-cols-2 = 160 bis 176px.
                                  Wenn das nicht gewünscht ist, lässt es sich in v2.0 verhindern. Dazu muss man lediglich den toc-Wert (to column) mit angeben. Also statt "mdui-cols-2" dann "mdui-cols-2-toc-2".

                                  Dominik F.D Offline
                                  Dominik F.D Offline
                                  Dominik F.
                                  schrieb am zuletzt editiert von
                                  #528

                                  @Uhula

                                  mir ist aufgefallen, dass die automatische Schriftfarbe nicht immer funktioniert, manchmal kommt es vor, dass bei dunklem Hintergrund die Schriftfarbe schwarz ist, erst nach Neuladen der Page wird die Schriftfarbe weiß. Hast du vielleicht eine Idee wie ich das beheben kann?
                                  ich nutze zum anzeigen der Vis den FullyBrowser.

                                  1 Antwort Letzte Antwort
                                  0
                                  • jpgorganizerJ Offline
                                    jpgorganizerJ Offline
                                    jpgorganizer
                                    schrieb am zuletzt editiert von
                                    #529

                                    @Uhula said in [Projekt] Material Design CSS für ioBroker.vis:

                                    Alternativ, was ich machen würde: Die Bearbeitung wäre eine eigene pageXXXX, kein Dialog.

                                    danke, umgesetzt :-)

                                    @Uhula said in [Projekt] Material Design CSS für ioBroker.vis:

                                    @jpgorganizer Das funktioniert bei mir ... deine CSS Anweisungen müssen hinter den anderen stehen, also weiter unten im CSS Projekt. Warum es bei dir nicht funkioniert, weiß ich nicht. Wenn du

                                    .mdui-button.mdui-font-small {
                                    font-size:0.8em !important;
                                    }
                                    

                                    schreibst, erhöhst du die Selektivität der Anweisung, vielleicht hilft das.

                                    bei mir leider nicht ... irgendwo muss ein Unterschied sein. ... für jetzt lass ich das aber mal so, da komm ich später vmtl. wieder drauf zurück.

                                    Viele Grüße
                                    jpgorganizer

                                    PS: dieser Post harrte nun seit gestern Abend darauf endlich abgesandt zu werden :-)

                                    Bitte keine Fragen per PN, die gehören ins Forum!

                                    ioBroker
                                    smartgarden Adapter für GARDENA smart system
                                    Plattform: Raspberry Pi OS Linux 12 (bookworm), Node.js: v18.18.2, NPM: 9.8.1

                                    1 Antwort Letzte Antwort
                                    0
                                    • jpgorganizerJ Offline
                                      jpgorganizerJ Offline
                                      jpgorganizer
                                      schrieb am zuletzt editiert von
                                      #530

                                      Ich nähere mich meinem Ziel (ich habe bei mir die Klasse mymdui-flex gelöscht), somit sollte sich mein Ziel auch nicht verändern :-)

                                      Ein Thema habe ich aktuell noch:
                                      Ich nutze ein mdui-input. Aber Angabe von Width hat keinen Effekt. Egal was ich eingebe, bei der Anzeige ändert sich nichts. Im Editor wird der blaue Rahmen schon breiter, aber der Strich bleibt wie er ist und zu Laufzeit ist der Strich auch nicht länger und bei längeren Eingaben wird der sichtbare Bereich abgeschnitten.

                                      e5580169-cfb1-4db1-9463-0e13de1a155d-grafik.png

                                      Bild aus Demo-Projekt.

                                      Grüße
                                      jpgorganizer

                                      Bitte keine Fragen per PN, die gehören ins Forum!

                                      ioBroker
                                      smartgarden Adapter für GARDENA smart system
                                      Plattform: Raspberry Pi OS Linux 12 (bookworm), Node.js: v18.18.2, NPM: 9.8.1

                                      1 Antwort Letzte Antwort
                                      0
                                      • UhulaU Uhula

                                        @tobiv Wird es geben, bis dahin aus dem MD_Demo kopieren.

                                        @mrFenyx Ich vermute, du nutzt noch die v1.0, wegen der col-Breite von 156px, die v2.0 arbeitet mit 80px Breite für eine feinere Granularität. Ich weiß nicht mehr, wie es vor 2 Jahren in der v1.0 war, aber in der v2.0 ist es so, dass die mdui-cols-(N) Angaben eine Breitentoleranz von 10% haben um ungenutzte rechte Bereiche im content (der mdui-flex hat) mit nutzen zu können. Bsp: mdui-cols-2 = 160 bis 176px.
                                        Wenn das nicht gewünscht ist, lässt es sich in v2.0 verhindern. Dazu muss man lediglich den toc-Wert (to column) mit angeben. Also statt "mdui-cols-2" dann "mdui-cols-2-toc-2".

                                        mrFenyxM Offline
                                        mrFenyxM Offline
                                        mrFenyx
                                        schrieb am zuletzt editiert von mrFenyx
                                        #531

                                        @Uhula danke für die Antwort. Ich werde es mit der Änderung versuchen. Die 156px habe ich aus der Anleitung genommen. Gibt es auch andere Änderungen? Oder eine neue Anleitung?

                                        Update: ich habe alle meine Widgets upgedated so dass die Position mit % Berechnungen gesetzt wird. So werden die unabhängig vom View Größe korrekt dargestellt :D
                                        Wide:
                                        vis-wide.png
                                        Narrow:
                                        vis-narrow.png

                                        Danke nochmals für den Tip ;)

                                        jpgorganizerJ UhulaU Dominik F.D 3 Antworten Letzte Antwort
                                        0
                                        • mrFenyxM mrFenyx

                                          @Uhula danke für die Antwort. Ich werde es mit der Änderung versuchen. Die 156px habe ich aus der Anleitung genommen. Gibt es auch andere Änderungen? Oder eine neue Anleitung?

                                          Update: ich habe alle meine Widgets upgedated so dass die Position mit % Berechnungen gesetzt wird. So werden die unabhängig vom View Größe korrekt dargestellt :D
                                          Wide:
                                          vis-wide.png
                                          Narrow:
                                          vis-narrow.png

                                          Danke nochmals für den Tip ;)

                                          jpgorganizerJ Offline
                                          jpgorganizerJ Offline
                                          jpgorganizer
                                          schrieb am zuletzt editiert von jpgorganizer
                                          #532

                                          Hi und noch eine vmtl. blöde Frage:

                                          Ich öffne einen Dialog. Darin kann ich einen Wert eingeben. Der wird direkt in einem Datenpunkt gespeichert. Anschließend wollte ich zwei Buttons zur Verfügung stellen.

                                          • Abbrechen - dürfte selbst erklärend sein. Als Button nehme ich einen jqui - Button dialog close ---> funktioniert
                                          • Start - ist auch selbst erklärend, ich möchte eine Aktion auslösen. Dazu schreibe ich mit einem jqui - Button state in einen weiteren DP ein true. Das funktioniert auch.
                                            Nur wie bekomm ich den Dialog jetzt zu. Der bleibt nämlich offen. Eigentlich logisch, aber welchen Button sollte ich stattdessen nehmen?

                                          Please help

                                          Danke und Gruß
                                          jpgorganizer

                                          Bitte keine Fragen per PN, die gehören ins Forum!

                                          ioBroker
                                          smartgarden Adapter für GARDENA smart system
                                          Plattform: Raspberry Pi OS Linux 12 (bookworm), Node.js: v18.18.2, NPM: 9.8.1

                                          Dominik F.D jpgorganizerJ 3 Antworten Letzte Antwort
                                          0
                                          Antworten
                                          • In einem neuen Thema antworten
                                          Anmelden zum Antworten
                                          • Älteste zuerst
                                          • Neuste zuerst
                                          • Meiste Stimmen


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          677

                                          Online

                                          32.4k

                                          Benutzer

                                          81.4k

                                          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