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] MDCSS v2: Material Design CSS Version 2

NEWS

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

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

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

[Projekt] MDCSS v2: Material Design CSS Version 2

Geplant Angeheftet Gesperrt Verschoben Visualisierung
material uivismaterial css
717 Beiträge 74 Kommentatoren 177.7k Aufrufe 77 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.
  • UhulaU Uhula

    @chhe Wenn du den 2 Jahre alten "Material Design Widget Adapter" installiert hast, der stört, da dort die MDCSS v1.8 enthalten sind. Auch kann es sein, dass der Material Design Adapter von Scrounger stört (habe ich aber noch nicht selbst ausprobiert, nur an anderer Stelle einen Hinweis gelesen).

    C Offline
    C Offline
    chhe
    schrieb am zuletzt editiert von
    #267

    @Uhula said in [Projekt] MDCSS v2: Material Design CSS Version 2:

    @chhe Wenn du den 2 Jahre alten "Material Design Widget Adapter" installiert hast, der stört, da dort die MDCSS v1.8 enthalten sind. Auch kann es sein, dass der Material Design Adapter von Scrounger stört (habe ich aber noch nicht selbst ausprobiert, nur an anderer Stelle einen Hinweis gelesen).

    Habe den "Material Design Widget Adapter" deinstalliert. Leider brachte dies keinen Erfolg.
    Den anderen genannten Adapter hatte ich nicht installiert.

    P 1 Antwort Letzte Antwort
    0
    • C chhe

      @Uhula said in [Projekt] MDCSS v2: Material Design CSS Version 2:

      @chhe Wenn du den 2 Jahre alten "Material Design Widget Adapter" installiert hast, der stört, da dort die MDCSS v1.8 enthalten sind. Auch kann es sein, dass der Material Design Adapter von Scrounger stört (habe ich aber noch nicht selbst ausprobiert, nur an anderer Stelle einen Hinweis gelesen).

      Habe den "Material Design Widget Adapter" deinstalliert. Leider brachte dies keinen Erfolg.
      Den anderen genannten Adapter hatte ich nicht installiert.

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

      @chhe sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

      Habe den "Material Design Widget Adapter" deinstalliert. Leider brachte dies keinen Erfolg.

      Kann sein dass es trotzdem nicht geht, aber lösch mal den Browsercache, das hatte bei zweien meiner Betatester geholfen.

      1 Antwort Letzte Antwort
      0
      • C Offline
        C Offline
        chhe
        schrieb am zuletzt editiert von
        #269

        Browsercache löschen bringt leider nichts. Habe es auch nochmal mit Firefox probiert => ohne Erfolg :(

        1 Antwort Letzte Antwort
        0
        • C Offline
          C Offline
          chhe
          schrieb am zuletzt editiert von
          #270

          Wenn ich das MD_Design VIS öffne und auf den Reiter "Layout" wechsel, dann kann ich dort die Cards auf- und zuklappen. Auf anderen Reitern funktioniert dies nicht.

          Können wir den Fehler dadurch weiter eingrenzen?

          1 Antwort Letzte Antwort
          0
          • mickymM Online
            mickymM Online
            mickym
            Most Active
            schrieb am zuletzt editiert von mickym
            #271

            Blitzende Icons
            Hört sich zwar gut an, will ich aber nicht. ;)

            Scheint aber ebenfalls ein iPad-Problem zu sein.

            Ich lade dazu mal dieses Video hoch und auch wenn die anderen Icons manchmal refreshen und blitzen - stört mich das an dem Text-Icon also den Temperaturen:

            Blitzende Icons.mp4

            Die anderen Icons refreshen zwar auch manchmal, aber nicht so häufig, wie das Thermometersymbol.
            Ursache ist wohl mdui-label. Die Icons werden kurz ganz weiß bevor sie dann die Zielfarbe annehmen. Und dann scheint es auch von der Farbe abzuhängen - bei schwarz ist auch mit black alles OK.

            Wenn ich das "mdui-label" weglasse, dann sieht es wie bei dem roten Icon aus - bleibt ruhig, aber die Farbe stimmt nicht genau mit der Schriftfarbe überein - aber immerhin grob.

            Wenn man in dem HTML - Text einen Zeilenumbruch habe - siehe blaues Symbol mit Luftfeucht in der 2. Zeile blizt nur der Tropfen.

            Es scheint aber wieder mal nur ein Problem auf dem iPad zu sein . :/ - Ich verzweifle langsam - aber es ist noch zu neu, um es zu entsorgen.

            Nachtrag: Es scheint sich nach einiger Zeit etwas zu beruhigen - ich bin mir nicht sicher, ob das überhaupt etwas ist, was nachzuverfolgen ist.

            Jeder Flow bzw. jedes Script, das ich hier poste implementiert jeder auf eigene Gefahr. Flows und Scripts können Fehler aufweisen und weder der Seitenbetreiber noch ich persönlich können hierfür haftbar gemacht werden. Das gleiche gilt für Empfehlungen aller Art.

            UhulaU 1 Antwort Letzte Antwort
            0
            • D Offline
              D Offline
              der-eine
              schrieb am zuletzt editiert von
              #272

              @Uhula nutzt Du für Deine Views nur den Hue Color Slider der im Demo ist oder evtl auch diesen RGB Spectrum und es gibt den auch in schön? :relaxed: :hand_with_index_and_middle_fingers_crossed:

              Bildschirmfoto 2020-03-23 um 19.44.10.png

              UhulaU 1 Antwort Letzte Antwort
              0
              • D der-eine

                @Uhula nutzt Du für Deine Views nur den Hue Color Slider der im Demo ist oder evtl auch diesen RGB Spectrum und es gibt den auch in schön? :relaxed: :hand_with_index_and_middle_fingers_crossed:

                Bildschirmfoto 2020-03-23 um 19.44.10.png

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

                @der-eine Ich hatte mir die ganzen RGB Widgets mal angesehen - und alle verworfen, da sie nur unter gewissen Voraussetzungen funktionieren. Die meisten sind dialog-basiert, funktionieren also nicht innerhalb von Dialogen selbst. Und da mache ich meine Farbeinstellungen - deswegen nutze ich nur ganz simple Slider.

                Eine Alternative sind die nativen Colordialoge des Betriebssystems -und die bekommt man mit einem normalen inpuit-Feld. Schau dir mal im MD_Demo unter "Bedienung" die "Eingabeelemente" und dort die "Color"-Eingabe an. Je nach Betriebssystem öffnet sich ein anderer Dialog. Ob du aber das string-Ergebnis in deine states direkt setzen kannst, ist ein anderes Problem.
                d0b5e563-5c06-452a-8e2e-da242f29ace8-image.png

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

                D 1 Antwort Letzte Antwort
                0
                • mickymM mickym

                  Blitzende Icons
                  Hört sich zwar gut an, will ich aber nicht. ;)

                  Scheint aber ebenfalls ein iPad-Problem zu sein.

                  Ich lade dazu mal dieses Video hoch und auch wenn die anderen Icons manchmal refreshen und blitzen - stört mich das an dem Text-Icon also den Temperaturen:

                  Blitzende Icons.mp4

                  Die anderen Icons refreshen zwar auch manchmal, aber nicht so häufig, wie das Thermometersymbol.
                  Ursache ist wohl mdui-label. Die Icons werden kurz ganz weiß bevor sie dann die Zielfarbe annehmen. Und dann scheint es auch von der Farbe abzuhängen - bei schwarz ist auch mit black alles OK.

                  Wenn ich das "mdui-label" weglasse, dann sieht es wie bei dem roten Icon aus - bleibt ruhig, aber die Farbe stimmt nicht genau mit der Schriftfarbe überein - aber immerhin grob.

                  Wenn man in dem HTML - Text einen Zeilenumbruch habe - siehe blaues Symbol mit Luftfeucht in der 2. Zeile blizt nur der Tropfen.

                  Es scheint aber wieder mal nur ein Problem auf dem iPad zu sein . :/ - Ich verzweifle langsam - aber es ist noch zu neu, um es zu entsorgen.

                  Nachtrag: Es scheint sich nach einiger Zeit etwas zu beruhigen - ich bin mir nicht sicher, ob das überhaupt etwas ist, was nachzuverfolgen ist.

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

                  @mickym Ist es ein altes iPad? Evtl ist es einfach zu langsam um das Browser-Rendering schnell genug auszuführen. Ansonsten bin ich bei allem aus der Apfelfamilie leider raus.

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

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

                    @mickym Ist es ein altes iPad? Evtl ist es einfach zu langsam um das Browser-Rendering schnell genug auszuführen. Ansonsten bin ich bei allem aus der Apfelfamilie leider raus.

                    mickymM Online
                    mickymM Online
                    mickym
                    Most Active
                    schrieb am zuletzt editiert von
                    #275

                    @Uhula Nein - ist ein ipadPro 2. Generation mit 12,9 Zoll - also mit A10x Prozessor - wurde zwar gerade durch ein neues Modell ersetzt - also eigentlich ziemlich aktuell. Aber ich verstehe, dass Du es ja mangels eigener HW kaum nachvollziehen kannst. Aber vielleicht hilft Dir ja die eine oder andere Rückmeldung.

                    Jeder Flow bzw. jedes Script, das ich hier poste implementiert jeder auf eigene Gefahr. Flows und Scripts können Fehler aufweisen und weder der Seitenbetreiber noch ich persönlich können hierfür haftbar gemacht werden. Das gleiche gilt für Empfehlungen aller Art.

                    1 Antwort Letzte Antwort
                    0
                    • UhulaU Uhula

                      @mickym Ist es ein altes iPad? Evtl ist es einfach zu langsam um das Browser-Rendering schnell genug auszuführen. Ansonsten bin ich bei allem aus der Apfelfamilie leider raus.

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

                      @Uhula

                      Ich habe bei der Darstellung mit Chrome Veränderungen in der Darstellung festgestellt. Einmal einen streifen in der tnav und das sich beim auf/zuklappen von Cards die Breite dieser ändert.
                      Hast du eine Idee wie ich es behoben bekomme? Über Fully ist zumindest der Streifen in der tnav nicht da.
                      InkedInkedScreenshot_20200324_003802_com.android.chrome_LI.jpg
                      InkedScreenshot_20200324_003755_com.android.chrome_LI.jpg

                      UhulaU F 2 Antworten Letzte Antwort
                      0
                      • C Offline
                        C Offline
                        chhe
                        schrieb am zuletzt editiert von
                        #277

                        Ich habe für mein Problem (nicht minimierbare Cards) ein neuen Thread aufgemacht. Dann ist die hoffentlich vorhandene Lösung für alle gut dokumentiert auffindbar.

                        https://forum.iobroker.net/topic/31489/mdcss-v2-cards-lassen-sich-nicht-minimieren

                        1 Antwort Letzte Antwort
                        0
                        • mickymM Online
                          mickymM Online
                          mickym
                          Most Active
                          schrieb am zuletzt editiert von
                          #278

                          @Uhula

                          Hier mal ein paar Rückmeldung von meinem iPad ;) - mir ist zwar das Verhalten nicht klar - aber vielleicht kann der Spezialist daraus einige Schlüsse ziehen.

                          Wenn ich die Widgets auf eine Card ziehe und nichts ändere werden sie komischer weise korrekt dargestellt.

                          auf Card hell.png auf Card dunkel.png

                          sobald ich das aber auf einem eigens erstellten View mache - habe ich wieder das Problem obwohl ich die CSS Sytles nun 1000-fach überprüft habe.

                          Ich habe jetzt einfach mal so eine Card kopiert und kopiere jetzt die Widgets alle nochmal neu da drauf. Ich weiß nicht, ob vis da ein Problem gemacht hat oder in Deinem Demo View in den Cards noch irgendeine Einstellung gemacht wurde, die ich nicht sehe, aber ich gehe jetzt einfach pragmatisch diesen Weg weiter ohne weiter Ursachenforschung zu betreiben.

                          Aber ich dachte - auch mal eine positive Rückmeldung sollte ich hier mal posten.

                          Jeder Flow bzw. jedes Script, das ich hier poste implementiert jeder auf eigene Gefahr. Flows und Scripts können Fehler aufweisen und weder der Seitenbetreiber noch ich persönlich können hierfür haftbar gemacht werden. Das gleiche gilt für Empfehlungen aller Art.

                          UhulaU 1 Antwort Letzte Antwort
                          0
                          • UhulaU Uhula

                            @der-eine Ich hatte mir die ganzen RGB Widgets mal angesehen - und alle verworfen, da sie nur unter gewissen Voraussetzungen funktionieren. Die meisten sind dialog-basiert, funktionieren also nicht innerhalb von Dialogen selbst. Und da mache ich meine Farbeinstellungen - deswegen nutze ich nur ganz simple Slider.

                            Eine Alternative sind die nativen Colordialoge des Betriebssystems -und die bekommt man mit einem normalen inpuit-Feld. Schau dir mal im MD_Demo unter "Bedienung" die "Eingabeelemente" und dort die "Color"-Eingabe an. Je nach Betriebssystem öffnet sich ein anderer Dialog. Ob du aber das string-Ergebnis in deine states direkt setzen kannst, ist ein anderes Problem.
                            d0b5e563-5c06-452a-8e2e-da242f29ace8-image.png

                            D Offline
                            D Offline
                            der-eine
                            schrieb am zuletzt editiert von
                            #279

                            @Uhula danke, dass kannte ich noch garnicht. :+1:
                            Ist auf jedenfall schöner und besser zu bedienen als das andere.

                            1 Antwort Letzte Antwort
                            0
                            • Dominik F.D Dominik F.

                              @Uhula

                              Ich habe bei der Darstellung mit Chrome Veränderungen in der Darstellung festgestellt. Einmal einen streifen in der tnav und das sich beim auf/zuklappen von Cards die Breite dieser ändert.
                              Hast du eine Idee wie ich es behoben bekomme? Über Fully ist zumindest der Streifen in der tnav nicht da.
                              InkedInkedScreenshot_20200324_003802_com.android.chrome_LI.jpg
                              InkedScreenshot_20200324_003755_com.android.chrome_LI.jpg

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

                              @Dominik-F Mit der Version v2.3? Das kann sein, da hier nun die Scrollbalken in "hübsch" angezeigt werden. Sollte aber nur auf Desktops passieren, nicht auf Touch-Geräten. Muss ich wohl noch mal ran. Wenn du in der CSS die Zeilen 149-177 auskommentierst hast du den alten Zustand der v2.2.
                              Ursache bei dir:
                              (a) Die tnav ist breiter als der Screen -> Scrollbalken
                              (b) Nachdem du mehrere cards eingeklappt hast, ist kann vertikales Scrollen mehr notwendig, also kein Scrollbalken mehr -> mehr Platz in der Breite -> cards breiter

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

                              Dominik F.D 1 Antwort Letzte Antwort
                              0
                              • mickymM mickym

                                @Uhula

                                Hier mal ein paar Rückmeldung von meinem iPad ;) - mir ist zwar das Verhalten nicht klar - aber vielleicht kann der Spezialist daraus einige Schlüsse ziehen.

                                Wenn ich die Widgets auf eine Card ziehe und nichts ändere werden sie komischer weise korrekt dargestellt.

                                auf Card hell.png auf Card dunkel.png

                                sobald ich das aber auf einem eigens erstellten View mache - habe ich wieder das Problem obwohl ich die CSS Sytles nun 1000-fach überprüft habe.

                                Ich habe jetzt einfach mal so eine Card kopiert und kopiere jetzt die Widgets alle nochmal neu da drauf. Ich weiß nicht, ob vis da ein Problem gemacht hat oder in Deinem Demo View in den Cards noch irgendeine Einstellung gemacht wurde, die ich nicht sehe, aber ich gehe jetzt einfach pragmatisch diesen Weg weiter ohne weiter Ursachenforschung zu betreiben.

                                Aber ich dachte - auch mal eine positive Rückmeldung sollte ich hier mal posten.

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

                                @mickym Hmm, scheint mit width/height Angaben des Widgets zusammen zu hängen. Die ergeben dann wohl ein clip-Rechteck, welches vom Safari berücksichtigt wird. Leider ist nicht ganz klar, wann die vis intern die width/height neu berechnet, wenn die Felder leer sind.
                                Stimmt meine Annahme?
                                Was passiert wenn width/height leer sind?
                                Und wenn "auto" drin steht?
                                Nach dem direkten Einfügen?
                                Nach dem Verschieben mit der Maus?

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

                                mickymM 1 Antwort Letzte Antwort
                                0
                                • Dominik F.D Dominik F.

                                  @Uhula

                                  Ich habe bei der Darstellung mit Chrome Veränderungen in der Darstellung festgestellt. Einmal einen streifen in der tnav und das sich beim auf/zuklappen von Cards die Breite dieser ändert.
                                  Hast du eine Idee wie ich es behoben bekomme? Über Fully ist zumindest der Streifen in der tnav nicht da.
                                  InkedInkedScreenshot_20200324_003802_com.android.chrome_LI.jpg
                                  InkedScreenshot_20200324_003755_com.android.chrome_LI.jpg

                                  F Offline
                                  F Offline
                                  FrenkyIO
                                  schrieb am zuletzt editiert von
                                  #282

                                  @Dominik-F wie bekommst du so eine schöne Ansicht (vollbild) mit farbübergang und ohne Adresszeile hin?

                                  Bei mir sieht es so aus.Screenshot_20200311-192034_Chrome.jpg

                                  Dominik F.D 1 Antwort Letzte Antwort
                                  0
                                  • F FrenkyIO

                                    @Dominik-F wie bekommst du so eine schöne Ansicht (vollbild) mit farbübergang und ohne Adresszeile hin?

                                    Bei mir sieht es so aus.Screenshot_20200311-192034_Chrome.jpg

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

                                    @FrenkyIO

                                    Geh mal auf deine Startseite und dann oben rechts ins Menü. Dann "zum Startbildschirm hinzufügen" . Wenn du darüber öffnest ist es weg

                                    F 1 Antwort Letzte Antwort
                                    0
                                    • UhulaU Uhula

                                      @Dominik-F Mit der Version v2.3? Das kann sein, da hier nun die Scrollbalken in "hübsch" angezeigt werden. Sollte aber nur auf Desktops passieren, nicht auf Touch-Geräten. Muss ich wohl noch mal ran. Wenn du in der CSS die Zeilen 149-177 auskommentierst hast du den alten Zustand der v2.2.
                                      Ursache bei dir:
                                      (a) Die tnav ist breiter als der Screen -> Scrollbalken
                                      (b) Nachdem du mehrere cards eingeklappt hast, ist kann vertikales Scrollen mehr notwendig, also kein Scrollbalken mehr -> mehr Platz in der Breite -> cards breiter

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

                                      @Uhula

                                      Ja, das passiert in der neuesten Version. Was verwunderlich ist, dass dies in Chrome passiert, jedoch nicht mit dem Fullybrowser. Vielleicht hilft dir diese Info noch weiter.

                                      1 Antwort Letzte Antwort
                                      0
                                      • Dominik F.D Dominik F.

                                        @FrenkyIO

                                        Geh mal auf deine Startseite und dann oben rechts ins Menü. Dann "zum Startbildschirm hinzufügen" . Wenn du darüber öffnest ist es weg

                                        F Offline
                                        F Offline
                                        FrenkyIO
                                        schrieb am zuletzt editiert von
                                        #285

                                        @Dominik-F genauso hab ich es gemacht. Leider mit diesem Ergebnis. Ich importiere mal ein neues Projekt und versuche es nochmals. Mit der MD_Demo sollte es ja klappen.

                                        Dominik F.D 1 Antwort Letzte Antwort
                                        0
                                        • F FrenkyIO

                                          @Dominik-F genauso hab ich es gemacht. Leider mit diesem Ergebnis. Ich importiere mal ein neues Projekt und versuche es nochmals. Mit der MD_Demo sollte es ja klappen.

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

                                          @FrenkyIO

                                          Bei mir sieht das genauso aus, wenn ich chrome öffne, mir die Seite als Link abspeicher und dann öffne. Wenn ich aber die Seite so auf dem Starbildschirm von Android öffne ist die Adresszeile weg. Das sollte unabhängig vom Projekt sein

                                          F 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

                                          393

                                          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