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.4k

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

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

[Projekt] MDCSS v2: Material Design CSS Version 2

Geplant Angeheftet Gesperrt Verschoben Visualisierung
material uivismaterial css
717 Beiträge 74 Kommentatoren 178.2k 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

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

    Kann mir jemand einen Tipp geben?

    Die Icons werden praktisch als Font behandelt, so dass sich fontsize und color auswirken sollten. Über das Widget geht es nicht, da die material-icons Anweisung das zurücksetzt. Versuch es mal direkt in der <i> Anweisung:

    <i class="material-icons" style="fontsize:2em;">play_arrow</i>
    
    A Offline
    A Offline
    ak1
    schrieb am zuletzt editiert von
    #495

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

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

    Kann mir jemand einen Tipp geben?

    Die Icons werden praktisch als Font behandelt, so dass sich fontsize und color auswirken sollten. Über das Widget geht es nicht, da die material-icons Anweisung das zurücksetzt. Versuch es mal direkt in der <i> Anweisung:

    <i class="material-icons" style="fontsize:2em;">play_arrow</i>
    

    Danke! Das war es. Allerdings eine kleine Korrektur: Der Bindestrich gehört in "font-size" hinein.

    <i class="material-icons" style="font-size:2em;">play_arrow</i>
    
    K 1 Antwort Letzte Antwort
    0
    • A ak1

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

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

      Kann mir jemand einen Tipp geben?

      Die Icons werden praktisch als Font behandelt, so dass sich fontsize und color auswirken sollten. Über das Widget geht es nicht, da die material-icons Anweisung das zurücksetzt. Versuch es mal direkt in der <i> Anweisung:

      <i class="material-icons" style="fontsize:2em;">play_arrow</i>
      

      Danke! Das war es. Allerdings eine kleine Korrektur: Der Bindestrich gehört in "font-size" hinein.

      <i class="material-icons" style="font-size:2em;">play_arrow</i>
      
      K Offline
      K Offline
      klausiob
      schrieb am zuletzt editiert von
      #496

      @ak1 Hier auch noch einige Tipps fürs Stylen: Material Icons Guide, z.B. Farbe

      Pi4B, Pi3B+, Master-Slave, EchoPlus, 3xEchoDot, FireTVstick, Xiaomi Sensoren, Fritzbox, DECT200, HS100, ZBT-ExtendedColor (ALDI), Shelly 2.5, 2xZigBee-Router-Plugs, Sileno 500 smart, Somfy switch, IONIQ5, tibber
      node.js: 22.21.0 - npm: 10.9.4 - linux: raspbian-trixie - admin 7.7.19 - vis 1.5.6 - js-controller: 7.0.7

      A 1 Antwort Letzte Antwort
      0
      • K klausiob

        @ak1 Hier auch noch einige Tipps fürs Stylen: Material Icons Guide, z.B. Farbe

        A Offline
        A Offline
        ak1
        schrieb am zuletzt editiert von
        #497

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

        Material Icons Guide

        Besten Dank!

        1 Antwort Letzte Antwort
        0
        • K Offline
          K Offline
          klausiob
          schrieb am zuletzt editiert von
          #498

          @Uhula ist hier vielleicht offtopic, aber ich stelle gerade alles auf MDCSS v2 um. Vorher alles auf einen Raspi4 geschoben. Habe jetzt ein Problem im V1 und V2, dass jqui-Radiobutton-Valuelist, auch jqui-Select-Valuelist keine Werte in einen selbstdefinierten Datenpunkt schreibt. Auf dem Raspi3 hat das noch funktioniert. Das merkwürdige ist, das wenn ich den Wert in den Datenpunkt schreibe, zeigt das Widget den an. Im Datenpunkt steht immer die gleiche Zahl. Hat jemand auch so ein Effekt mal gehabt?

          Pi4B, Pi3B+, Master-Slave, EchoPlus, 3xEchoDot, FireTVstick, Xiaomi Sensoren, Fritzbox, DECT200, HS100, ZBT-ExtendedColor (ALDI), Shelly 2.5, 2xZigBee-Router-Plugs, Sileno 500 smart, Somfy switch, IONIQ5, tibber
          node.js: 22.21.0 - npm: 10.9.4 - linux: raspbian-trixie - admin 7.7.19 - vis 1.5.6 - js-controller: 7.0.7

          UhulaU 1 Antwort Letzte Antwort
          0
          • K klausiob

            @Uhula ist hier vielleicht offtopic, aber ich stelle gerade alles auf MDCSS v2 um. Vorher alles auf einen Raspi4 geschoben. Habe jetzt ein Problem im V1 und V2, dass jqui-Radiobutton-Valuelist, auch jqui-Select-Valuelist keine Werte in einen selbstdefinierten Datenpunkt schreibt. Auf dem Raspi3 hat das noch funktioniert. Das merkwürdige ist, das wenn ich den Wert in den Datenpunkt schreibe, zeigt das Widget den an. Im Datenpunkt steht immer die gleiche Zahl. Hat jemand auch so ein Effekt mal gehabt?

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

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

            Hat jemand auch so ein Effekt mal gehabt?

            Nein, den Effekt kenne ich nicht. Das kann ich auch mit dem MDCSS nicht erklären, da es ja auf das Setzen der States keinen EInfluss nimmt, sondern nur auf die Darstellung. Hast du die States vielleicht mit "write=false" angelegt? Oder direkt unterhalb eines Adapters und nicht in 0_userdata? Ansonsten habe ich keine weitere Idee.

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

            K 1 Antwort Letzte Antwort
            0
            • UhulaU Uhula

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

              Hat jemand auch so ein Effekt mal gehabt?

              Nein, den Effekt kenne ich nicht. Das kann ich auch mit dem MDCSS nicht erklären, da es ja auf das Setzen der States keinen EInfluss nimmt, sondern nur auf die Darstellung. Hast du die States vielleicht mit "write=false" angelegt? Oder direkt unterhalb eines Adapters und nicht in 0_userdata? Ansonsten habe ich keine weitere Idee.

              K Offline
              K Offline
              klausiob
              schrieb am zuletzt editiert von klausiob
              #500

              @Uhula Nee, glaube auch nicht, dass es an MDCSS liegt. Datenpunkt liegt unter javascript.0.Eigene_Datenpunkte usw. ist schreibbar. Gestern abend hat es mal kurz funktioniert, dann mal wieder nicht, heute früh wieder. Vielleicht hatte ich zu viele Browserfenster auf?

              Naja, mal beobachten. Habe noch ein anderes Problem:
              Dein Skript MduiLogTR064Devices wirft bei mir ständig errors:

              2020-05-25 00:00:11.843  - warn: javascript.0 (1017) getState "tr-064.0.devices.HTTP-ServerIPCam.lastIP" not found (3)
              2020-05-25 00:00:11.844  - warn: javascript.0 (1017)     at MduiLogTR064.updateHTML (script.js.common.MduiLogTR064Devices:306:20)
              2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at MduiLogTR064.onChangeReachable (script.js.common.MduiLogTR064Devices:295:14)
              2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at Object.subscribe.obj (script.js.common.MduiLogTR064Devices:264:117)
              2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at Object.callback (/opt/iobroker/node_modules/iobroker.javascript/lib/sandbox.js:1052:38)
              2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at Object.stateChange (/opt/iobroker/node_modules/iobroker.javascript/main.js:451:25)
              2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at Immediate.setImmediate (/opt/iobroker/node_modules/iobroker.js-controller/lib/adapter.js:4851:37)
              2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at runCallback (timers.js:705:18)
              2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at tryOnImmediate (timers.js:676:5)
              2020-05-25 00:00:11.846  - warn: javascript.0 (1017)     at processImmediate (timers.js:658:5)
              2020-05-25 00:00:11.846  - error: javascript.0 (1017) script.js.common.MduiLogTR064Devices: [mduiLogTR064Devices] updateHTML: Cannot read property 'split' of null
              

              Mehrere Devices, die nicht mehr im Netz hängen.
              Irgendwas falsch konfiguriert?
              Im Skript habe ich einen roten Marker rechts:
              ![MduiLogTR06vDev.js](1eb106ba-0029-471b-8fc4-04820b436a0e-grafik.png Bild Link)

              Ist das evt. ein Grund?

              Und noch eine Frage. Kann man auch den Gerätenamen (Bezeichnungen) aus der Liste bei der Instanz anzeigen?
              VG klausiob

              Pi4B, Pi3B+, Master-Slave, EchoPlus, 3xEchoDot, FireTVstick, Xiaomi Sensoren, Fritzbox, DECT200, HS100, ZBT-ExtendedColor (ALDI), Shelly 2.5, 2xZigBee-Router-Plugs, Sileno 500 smart, Somfy switch, IONIQ5, tibber
              node.js: 22.21.0 - npm: 10.9.4 - linux: raspbian-trixie - admin 7.7.19 - vis 1.5.6 - js-controller: 7.0.7

              UhulaU 1 Antwort Letzte Antwort
              0
              • K klausiob

                @Uhula Nee, glaube auch nicht, dass es an MDCSS liegt. Datenpunkt liegt unter javascript.0.Eigene_Datenpunkte usw. ist schreibbar. Gestern abend hat es mal kurz funktioniert, dann mal wieder nicht, heute früh wieder. Vielleicht hatte ich zu viele Browserfenster auf?

                Naja, mal beobachten. Habe noch ein anderes Problem:
                Dein Skript MduiLogTR064Devices wirft bei mir ständig errors:

                2020-05-25 00:00:11.843  - warn: javascript.0 (1017) getState "tr-064.0.devices.HTTP-ServerIPCam.lastIP" not found (3)
                2020-05-25 00:00:11.844  - warn: javascript.0 (1017)     at MduiLogTR064.updateHTML (script.js.common.MduiLogTR064Devices:306:20)
                2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at MduiLogTR064.onChangeReachable (script.js.common.MduiLogTR064Devices:295:14)
                2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at Object.subscribe.obj (script.js.common.MduiLogTR064Devices:264:117)
                2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at Object.callback (/opt/iobroker/node_modules/iobroker.javascript/lib/sandbox.js:1052:38)
                2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at Object.stateChange (/opt/iobroker/node_modules/iobroker.javascript/main.js:451:25)
                2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at Immediate.setImmediate (/opt/iobroker/node_modules/iobroker.js-controller/lib/adapter.js:4851:37)
                2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at runCallback (timers.js:705:18)
                2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at tryOnImmediate (timers.js:676:5)
                2020-05-25 00:00:11.846  - warn: javascript.0 (1017)     at processImmediate (timers.js:658:5)
                2020-05-25 00:00:11.846  - error: javascript.0 (1017) script.js.common.MduiLogTR064Devices: [mduiLogTR064Devices] updateHTML: Cannot read property 'split' of null
                

                Mehrere Devices, die nicht mehr im Netz hängen.
                Irgendwas falsch konfiguriert?
                Im Skript habe ich einen roten Marker rechts:
                ![MduiLogTR06vDev.js](1eb106ba-0029-471b-8fc4-04820b436a0e-grafik.png Bild Link)

                Ist das evt. ein Grund?

                Und noch eine Frage. Kann man auch den Gerätenamen (Bezeichnungen) aus der Liste bei der Instanz anzeigen?
                VG klausiob

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

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

                Ist das evt. ein Grund?

                Antwort hier im tr064 Thema.

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

                1 Antwort Letzte Antwort
                0
                • S Offline
                  S Offline
                  Saschag
                  schrieb am zuletzt editiert von
                  #502

                  Hallo zusammen,

                  kann mir jemand helfen wie ich beim mdui-input einen transparenten Hintergrund hinbekommen

                  [{"tpl":"tplJquiInputDatetime","data":{"oid":"javascript.0.Timer.Template.TimerTimestamp","g_fixed":true,"g_visibility":true,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":"time","visibility-groups-action":"hide","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,"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,"size":"5","timeOnly":true,"hideSeconds":false,"visibility-oid":"javascript.0.Timer.Template.TimerChoice","views":null,"class":"mdui-input","showGrid":false},"style":{"left":"364px","top":"91px","width":"72px","height":"22px","z-index":9},"widgetSet":"jqui"}]
                  

                  Bildschirmfoto 2020-05-27 um 20.20.55.png

                  UhulaU 1 Antwort Letzte Antwort
                  0
                  • K Offline
                    K Offline
                    klausiob
                    schrieb am zuletzt editiert von
                    #503

                    @Uhula
                    Ich würde mein neues VIS mit MDCSS gerne gleichzeitig auf meinem S5 (360x640px) und auf Galaxy Tab S (1280x800px) und am PC verwenden. Im großen und ganzen passt alles bezüglich responsiv, aber kurz vor dem Umklappen der rechten Cards nach unten rutscht der Content über den Rand. Gibt es da eine Möglichkeit das zu verhindern. Fehlt da irgend ein padding-right? Oder wie kann man schon beim Design verhindern, dass der Content breiter wird als die kleinste Breite (min-width)(hier col-4).

                    Überlappung.JPG

                    Pi4B, Pi3B+, Master-Slave, EchoPlus, 3xEchoDot, FireTVstick, Xiaomi Sensoren, Fritzbox, DECT200, HS100, ZBT-ExtendedColor (ALDI), Shelly 2.5, 2xZigBee-Router-Plugs, Sileno 500 smart, Somfy switch, IONIQ5, tibber
                    node.js: 22.21.0 - npm: 10.9.4 - linux: raspbian-trixie - admin 7.7.19 - vis 1.5.6 - js-controller: 7.0.7

                    UhulaU 1 Antwort Letzte Antwort
                    0
                    • K klausiob

                      @Uhula
                      Ich würde mein neues VIS mit MDCSS gerne gleichzeitig auf meinem S5 (360x640px) und auf Galaxy Tab S (1280x800px) und am PC verwenden. Im großen und ganzen passt alles bezüglich responsiv, aber kurz vor dem Umklappen der rechten Cards nach unten rutscht der Content über den Rand. Gibt es da eine Möglichkeit das zu verhindern. Fehlt da irgend ein padding-right? Oder wie kann man schon beim Design verhindern, dass der Content breiter wird als die kleinste Breite (min-width)(hier col-4).

                      Überlappung.JPG

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

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

                      Oder wie kann man schon beim Design verhindern, dass der Content breiter wird als die kleinste Breite (min-width)(hier col-4).

                      Jede col ist 80 Pixel breit, wenn du verhindern möchtest, dass dein Content über die 4 cols hinaus geht, musst du beim Design darauf achten nicht mehr als 320px zu nutzen -evtl. noch abzüglich von 2x16px Rand - je nach genutzten Card-Aussehen. Also max. 288px nutzen (mache ich auch so, damit es auf älteren Smartphones noch passt). Wobei die meisten heute mindestens eine 360er Breite haben und ich dann mdui-cols-4-toc-5 einstelle, damit zumindest optisch die volle Breite genutzt wird.

                      Wenn man im Design das grid unter Tools einstellt, kann man es recht gut kontrollieren, da das MDCSS dann ein 80er Raster anzeigt.
                      7749bb88-9d74-47ea-9444-92ad7a7c456c-image.png

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

                      1 Antwort Letzte Antwort
                      0
                      • S Saschag

                        Hallo zusammen,

                        kann mir jemand helfen wie ich beim mdui-input einen transparenten Hintergrund hinbekommen

                        [{"tpl":"tplJquiInputDatetime","data":{"oid":"javascript.0.Timer.Template.TimerTimestamp","g_fixed":true,"g_visibility":true,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":"time","visibility-groups-action":"hide","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,"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,"size":"5","timeOnly":true,"hideSeconds":false,"visibility-oid":"javascript.0.Timer.Template.TimerChoice","views":null,"class":"mdui-input","showGrid":false},"style":{"left":"364px","top":"91px","width":"72px","height":"22px","z-index":9},"widgetSet":"jqui"}]
                        

                        Bildschirmfoto 2020-05-27 um 20.20.55.png

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

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

                        kann mir jemand helfen wie ich beim mdui-input einen transparenten Hintergrund hinbekommen

                        Der ist eigentlich immer vorhanden - es sei denn, du hast einmal dem View selbst ein Thema zugeordnet, dann ist diese Einstellung stärker - und ich weiß auch nicht, wie du das rückgängig machen kannst ohne einen neuen View anzulegen und deine Widgets dort alle hinein zu kopieren.

                        de75153a-fcd4-4f6b-990a-eb512948ca14-image.png

                        Alternativ kannst du in der CSS Datei dir die Definition für mdui-input suchen und bei der background Angabe noch ein !important dahinter setzen. Ich würde aber eine saubere View nehmen, da die View Thema-Wahl evtl. noch andere Auswirkungen haben kann.

                        .mdui-input input:not([type="button"]) {
                        ...
                          background: rgba(0,0,0,.03) !important;
                        ...
                        }
                        

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

                        S 1 Antwort Letzte Antwort
                        0
                        • BostilB Offline
                          BostilB Offline
                          Bostil
                          schrieb am zuletzt editiert von
                          #506

                          Gerne würde ich ein Widget (von Scrounger) von rechts nach links "sanft" einblendend animieren lassen. War mit meiner Suche (auch hier) bisher erfolglos, hat jemand dennoch eine Idee, ob dies mit CSS klappt? Danke! :-)

                          UhulaU 1 Antwort Letzte Antwort
                          0
                          • BostilB Bostil

                            Gerne würde ich ein Widget (von Scrounger) von rechts nach links "sanft" einblendend animieren lassen. War mit meiner Suche (auch hier) bisher erfolglos, hat jemand dennoch eine Idee, ob dies mit CSS klappt? Danke! :-)

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

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

                            hat jemand dennoch eine Idee, ob dies mit CSS klappt?

                            Grundsätzlich kann man CSS-Properties einer CSS-Klasse animieren, auch left/right/width/height Werte. Was dann wohl dem entspricht, was du erreichen möchtest. Da ich aber die CSS-Klassen der MD-Widgets nicht kenne, kann ich dir leider nicht konkreter antworten. Wenn du dich diesbezüglich in die CSS-Materie einlesen möchtest, such mal nach css animation und css keyframes.

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

                            1 Antwort Letzte Antwort
                            0
                            • UhulaU Uhula

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

                              kann mir jemand helfen wie ich beim mdui-input einen transparenten Hintergrund hinbekommen

                              Der ist eigentlich immer vorhanden - es sei denn, du hast einmal dem View selbst ein Thema zugeordnet, dann ist diese Einstellung stärker - und ich weiß auch nicht, wie du das rückgängig machen kannst ohne einen neuen View anzulegen und deine Widgets dort alle hinein zu kopieren.

                              de75153a-fcd4-4f6b-990a-eb512948ca14-image.png

                              Alternativ kannst du in der CSS Datei dir die Definition für mdui-input suchen und bei der background Angabe noch ein !important dahinter setzen. Ich würde aber eine saubere View nehmen, da die View Thema-Wahl evtl. noch andere Auswirkungen haben kann.

                              .mdui-input input:not([type="button"]) {
                              ...
                                background: rgba(0,0,0,.03) !important;
                              ...
                              }
                              
                              S Offline
                              S Offline
                              Saschag
                              schrieb am zuletzt editiert von Saschag
                              #508

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

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

                              kann mir jemand helfen wie ich beim mdui-input einen transparenten Hintergrund hinbekommen

                              Der ist eigentlich immer vorhanden - es sei denn, du hast einmal dem View selbst ein Thema zugeordnet, dann ist diese Einstellung stärker - und ich weiß auch nicht, wie du das rückgängig machen kannst ohne einen neuen View anzulegen und deine Widgets dort alle hinein zu kopieren.

                              de75153a-fcd4-4f6b-990a-eb512948ca14-image.png

                              Alternativ kannst du in der CSS Datei dir die Definition für mdui-input suchen und bei der background Angabe noch ein !important dahinter setzen. Ich würde aber eine saubere View nehmen, da die View Thema-Wahl evtl. noch andere Auswirkungen haben kann.

                              .mdui-input input:not([type="button"]) {
                              ...
                                background: rgba(0,0,0,.03) !important;
                              ...
                              }
                              

                              @Uhula
                              Bin endlich dazu gekommen 😏
                              Dank dir! Ein neuer View hat geholfen 👍

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

                                @darkiop

                                ja, mit mdui-expand mdui-onload

                                D Online
                                D Online
                                darkiop
                                Most Active
                                schrieb am zuletzt editiert von darkiop
                                #509

                                @Dominik-F sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

                                @darkiop

                                ja, mit mdui-expand mdui-onload

                                @Uhula Aktuell werden nur die cards zusammengeklappt welche auf der View liegen die beim Laden aktiv war. Besteht die Möglichkeit, grundsätzlich alle Cards zusammenzuklappen?

                                Ergänzung: Bei mir funktioniert das nicht wie von dir gedacht, da ich die Seiten in einem View8 Widget lade, d.h. onload() wird da nur einmal beim erstmaligen laden der Seite aufgerufen.

                                Hat trotzdem jemand eine Idee wie ich den Cards mitgeben könnte?

                                Proxmox-ioBroker-Redis-HA Doku: https://forum.iobroker.net/topic/47478/dokumentation-einer-proxmox-iobroker-redis-ha-umgebung

                                UhulaU 1 Antwort Letzte Antwort
                                0
                                • D darkiop

                                  @Dominik-F sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

                                  @darkiop

                                  ja, mit mdui-expand mdui-onload

                                  @Uhula Aktuell werden nur die cards zusammengeklappt welche auf der View liegen die beim Laden aktiv war. Besteht die Möglichkeit, grundsätzlich alle Cards zusammenzuklappen?

                                  Ergänzung: Bei mir funktioniert das nicht wie von dir gedacht, da ich die Seiten in einem View8 Widget lade, d.h. onload() wird da nur einmal beim erstmaligen laden der Seite aufgerufen.

                                  Hat trotzdem jemand eine Idee wie ich den Cards mitgeben könnte?

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

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

                                  Hat trotzdem jemand eine Idee wie ich den Cards mitgeben könnte?

                                  Warte mal auf die Version 2.5.1, da überwache ich den view-Wechsel der View8 Widgets und führe die mdui-onload dann für die nachgeladenen Cards durch. Vielleicht geht es dann auch bei dir.

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

                                  D 1 Antwort Letzte Antwort
                                  1
                                  • UhulaU Uhula

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

                                    Hat trotzdem jemand eine Idee wie ich den Cards mitgeben könnte?

                                    Warte mal auf die Version 2.5.1, da überwache ich den view-Wechsel der View8 Widgets und führe die mdui-onload dann für die nachgeladenen Cards durch. Vielleicht geht es dann auch bei dir.

                                    D Online
                                    D Online
                                    darkiop
                                    Most Active
                                    schrieb am zuletzt editiert von
                                    #511

                                    @Uhula Perfekt, vielen Dank @Uhula! Ist aktuell nur Kosmetik, aber bei der Verwendung aufm Smartphone durchaus nützlich!

                                    Proxmox-ioBroker-Redis-HA Doku: https://forum.iobroker.net/topic/47478/dokumentation-einer-proxmox-iobroker-redis-ha-umgebung

                                    1 Antwort Letzte Antwort
                                    0
                                    • kmxakK Offline
                                      kmxakK Offline
                                      kmxak
                                      Most Active
                                      schrieb am zuletzt editiert von
                                      #512

                                      Moin, bei mir funzt die Lbar nicht wie sie soll. Ist nicht anklickbar. Habe alle anderen Adapter mit Material deinstalliert auch mehrfach neu gestartet und cache gelöscht und alle browser probiert aber nix zu machen. hat noch einer eine idee?

                                      Gruß Alex

                                      UhulaU 1 Antwort Letzte Antwort
                                      0
                                      • kmxakK kmxak

                                        Moin, bei mir funzt die Lbar nicht wie sie soll. Ist nicht anklickbar. Habe alle anderen Adapter mit Material deinstalliert auch mehrfach neu gestartet und cache gelöscht und alle browser probiert aber nix zu machen. hat noch einer eine idee?

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

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

                                        hat noch einer eine idee?

                                        Was bedeutet "lbar funzt nicht"? Du meinst sicher die lnav-View?
                                        In welchem Projekt? MD-Demo?
                                        Wird sie nicht dargestellt? Öffnet sie sich nicht beim Klick auf das Burger-Menü?
                                        Wenn es nicht das MD_Demo Projekt ist, hast du den Script-Teil in dein Projekt übernommen?

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

                                        1 Antwort Letzte Antwort
                                        0
                                        • kmxakK Offline
                                          kmxakK Offline
                                          kmxak
                                          Most Active
                                          schrieb am zuletzt editiert von kmxak
                                          #514

                                          MD_Demo von GitHub habe CSS und JS im Projekt eingefügt und auch die CSS geändert wegen anderem Namen.
                                          Die Lnav öffnet sich ist aber nicht anklickbar auch die Untermenüs lassen sich nicht aufklappen stattdessen schließt sich die Lnav einfach wieder.

                                          So ich habe eine Lösung.
                                          Ich hatte vor einiger Zeit mal die anderen Material Adapter getestet diese aber wieder deinstalliert und gelöscht aber scheinbar hat der ioBroker diese eben nicht gelöscht. Nachdem ich in ioBroker Ordnern zumgestöbert habe sind mit einige Ordner von den Adaptern aufgefallen und habe diese manuell gelöscht. Danach ein restart und nun geht es alles so wie es soll.

                                          Gruß Alex

                                          UhulaU 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

                                          498

                                          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