Skip to content
  • Home
  • Recent
  • Tags
  • 0 Unread 0
  • Categories
  • Unreplied
  • Popular
  • 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

  • Default (No Skin)
  • No Skin
Collapse
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

Scheduled Pinned Locked Moved Visualisierung
material uivismaterial css
717 Posts 74 Posters 178.2k Views 77 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • UhulaU Uhula

    @Dominik-F Die Farben kannst du ja direkt im Widget über die background-color bzw. font-color setzen. Sollte/müsste (häufig) funktionieren. In der mdui-(color) geht es nicht, da diese je nach gewählten light/dark-Theme sich automatisch anpassen, was bei festen Farben so nicht funktioniert.

    @Glasfaser sagte in [Projekt] Material Design CSS v2:

    aber warum passiert es erst wenn dein Script eingefügt wird

    Genau das kann ich dir so nicht beantworten, da ich die MDW nicht kenne und somit auch die Wechselwirkungen zwischen den beiden nicht. Ohne Browser-Debugging (also bei mir Installation der MDW und Aufnahme deines Projekts) werde ich es nicht beantworten können. Da ich keine 2´zweite ioBroker Inst habe, möchte ich die MDW auch nicht installieren. Du wirst dann ohne MDCSSv1 eine Lösung nur mit MDW suchen müssen - oder ich schreibe irgendwann das Adapter-Anzeige-Script von @Scrounger so um, dass es ohne MDW und nur mit MDCSSv2 funktioniert ;-) (ist ja nur ein HTML-Code in einem State, welches dann in der vis angezeigt wird). Auf Dauer wirst du aber mit MDW und MDCSS immer bei bestimmten Konstellationen auf Probleme stoßen. Weder @Scrounger noch ich werden das so hinbekommen, dass es überall kooperativ klappt.

    Dominik F.D Offline
    Dominik F.D Offline
    Dominik F.
    wrote on last edited by
    #81

    @Uhula
    Das würde wenn ich jetzt richtig getestet habe bedeuten, dass ich von dem CSS weg müsste und das raised etc nachbauen müsste, was schade wäre
    Ich habe als Test dieses Widget genutzt und wollte folgende Farbe anstatt mdui-green-bg nutzen :#02c908. Das mdui-green-bg muss ich dann entfernen damit es funktioniert, das Widget sieht danach leider nicht mehr so "schön" aus

    [{"tpl":"tplHtml","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","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-card-raised mdui-green-bg mdui-center mdui-label","g_last_change":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,"html":"IP: {tr-064.0.devices.raspberrypi4-io.lastIP}","comment":""},"style":{"left":"16px","top":"163px","width":"150px","height":"40px","z-index":0,"background":"","background-color":""},"widgetSet":"basic"}]
    
    UhulaU 1 Reply Last reply
    0
    • Stephan SchleichS Offline
      Stephan SchleichS Offline
      Stephan Schleich
      wrote on last edited by
      #82

      Ich bekomme folgende Fehlermeldung, Script ist auf die Vis angepasst.
      Hab ich irgendwo was vergessen?
      fe01824c-52b5-422e-b3cc-35346b9f9f1c-image.png

      Dominik F.D 1 Reply Last reply
      0
      • Dominik F.D Dominik F.

        @Uhula

        Ich hätte da noch eine Idee bzw. einen Vorschlag. Ich fände es cool, wenn man anstatt mdui-green vielleicht auch mdui-#02c908 eingeben könnte damit man was die Farben angeht noch etwas flexibler ist. Oder ist das vielleicht schon machbar?

        @der-eine
        Ich habe das Dashboard nun einbinden können, vielen Dank für die Hilfe. Mir fällt nur auf, dass sich die Anzeige nicht selbstständig aktualisiert und ich bevor ich Änderungen sehe erst die Anzeige einmal umstellen muss zu z.B. einer Woche und dann wieder auf 1 Tag damit es sich aktualsiert. Hast du da noch einen Tipp für mich?

        D Offline
        D Offline
        der-eine
        wrote on last edited by
        #83

        @der-eine
        Ich habe das Dashboard nun einbinden können, vielen Dank für die Hilfe. Mir fällt nur auf, dass sich die Anzeige nicht selbstständig aktualisiert und ich bevor ich Änderungen sehe erst die Anzeige einmal umstellen muss zu z.B. einer Woche und dann wieder auf 1 Tag damit es sich aktualsiert. Hast du da noch einen Tipp für mich?

        @Dominik-F nein, sorry ist bei mir auch so und hab noch keine Lösung dafür.

        Dominik F.D 1 Reply Last reply
        1
        • Stephan SchleichS Stephan Schleich

          Ich bekomme folgende Fehlermeldung, Script ist auf die Vis angepasst.
          Hab ich irgendwo was vergessen?
          fe01824c-52b5-422e-b3cc-35346b9f9f1c-image.png

          Dominik F.D Offline
          Dominik F.D Offline
          Dominik F.
          wrote on last edited by
          #84

          @Stephan-Schleich

          Es gibt in VIS, dort wo du das CSS Script einfügst auch einen Reiter Script, da musst du das Script einfügen und nicht unter Java

          Unbenannt.PNG

          Stephan SchleichS 1 Reply Last reply
          1
          • D der-eine

            @der-eine
            Ich habe das Dashboard nun einbinden können, vielen Dank für die Hilfe. Mir fällt nur auf, dass sich die Anzeige nicht selbstständig aktualisiert und ich bevor ich Änderungen sehe erst die Anzeige einmal umstellen muss zu z.B. einer Woche und dann wieder auf 1 Tag damit es sich aktualsiert. Hast du da noch einen Tipp für mich?

            @Dominik-F nein, sorry ist bei mir auch so und hab noch keine Lösung dafür.

            Dominik F.D Offline
            Dominik F.D Offline
            Dominik F.
            wrote on last edited by
            #85

            @der-eine

            Okay, dann kann man da wohl nix machen, dank dir

            1 Reply Last reply
            0
            • Dominik F.D Dominik F.

              @Stephan-Schleich

              Es gibt in VIS, dort wo du das CSS Script einfügst auch einen Reiter Script, da musst du das Script einfügen und nicht unter Java

              Unbenannt.PNG

              Stephan SchleichS Offline
              Stephan SchleichS Offline
              Stephan Schleich
              wrote on last edited by
              #86

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

              @Stephan-Schleich

              Es gibt in VIS, dort wo du das CSS Script einfügst auch einen Reiter Script, da musst du das Script einfügen und nicht unter Java

              Unbenannt.PNG

              Danke Dominik, ich doofi haha, danke jetzt geht's ^^

              1 Reply Last reply
              0
              • Dominik F.D Dominik F.

                @Uhula
                Das würde wenn ich jetzt richtig getestet habe bedeuten, dass ich von dem CSS weg müsste und das raised etc nachbauen müsste, was schade wäre
                Ich habe als Test dieses Widget genutzt und wollte folgende Farbe anstatt mdui-green-bg nutzen :#02c908. Das mdui-green-bg muss ich dann entfernen damit es funktioniert, das Widget sieht danach leider nicht mehr so "schön" aus

                [{"tpl":"tplHtml","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","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-card-raised mdui-green-bg mdui-center mdui-label","g_last_change":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,"html":"IP: {tr-064.0.devices.raspberrypi4-io.lastIP}","comment":""},"style":{"left":"16px","top":"163px","width":"150px","height":"40px","z-index":0,"background":"","background-color":""},"widgetSet":"basic"}]
                
                UhulaU Offline
                UhulaU Offline
                Uhula
                wrote on last edited by
                #87

                @Dominik-F Stimmt, da du mdui-card-raised verwendest, wirkt sich die eigene background-color natürlich auf das gesamte Widget aus, nicht nur auf den inneren "card"-Anteil. Du "missbrauchst" hier ein wenig die mdui-card Zuweisung, welche z.B. auch margins und paddings setzt.
                Mit einer eigenen background-color musst du, wie du erkannt hast, die mdui-card-raised nachbilden und als CSS entfernen. Hier ein Beispiel, wie das Widget dann aussieht (eigene shadow/border-radius usw)

                [{"tpl":"tplHtml","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":true,"g_css_border":true,"g_gestures":false,"g_signals":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","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-center mdui-label ","g_last_change":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,"html":"IP: 0.0.0.0","comment":"xmdui-card-raised xmdui-green-bg xmdui-center xmdui-label"},"style":{"left":"16px","top":"163px","width":"150px","height":"40px","z-index":0,"background":"#02c908","box-shadow":"0 0 0 1px rgba(255,255,255,0.025) inset, 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23)","border-radius":"4px"},"widgetSet":"basic"}]
                


                Grafana-refresh funktioniert, es muss nur in der URL (Quelle) mit angegeben werden. Bsp: &refresh=5m ergänzen.

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

                Dominik F.D 1 Reply Last reply
                0
                • D Offline
                  D Offline
                  der-eine
                  wrote on last edited by der-eine
                  #88

                  @Uhula nochmal eine Frage zur lnav und rnav. Wenn ich die rnav öffne und irgendwo auf den Display hinklicke fährt sie wieder ganz normal ein. Das macht die lnav nicht. Sollte das nicht auch so funktionieren? Ich kann sie nur schließen wenn ich auf das Hamburger-Menü-Symbol klicke. Sind die beiden nicht "gleich" von der Funktion her?

                  1 Reply Last reply
                  0
                  • UhulaU Uhula

                    @Dominik-F Stimmt, da du mdui-card-raised verwendest, wirkt sich die eigene background-color natürlich auf das gesamte Widget aus, nicht nur auf den inneren "card"-Anteil. Du "missbrauchst" hier ein wenig die mdui-card Zuweisung, welche z.B. auch margins und paddings setzt.
                    Mit einer eigenen background-color musst du, wie du erkannt hast, die mdui-card-raised nachbilden und als CSS entfernen. Hier ein Beispiel, wie das Widget dann aussieht (eigene shadow/border-radius usw)

                    [{"tpl":"tplHtml","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":true,"g_css_border":true,"g_gestures":false,"g_signals":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","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-center mdui-label ","g_last_change":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,"html":"IP: 0.0.0.0","comment":"xmdui-card-raised xmdui-green-bg xmdui-center xmdui-label"},"style":{"left":"16px","top":"163px","width":"150px","height":"40px","z-index":0,"background":"#02c908","box-shadow":"0 0 0 1px rgba(255,255,255,0.025) inset, 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23)","border-radius":"4px"},"widgetSet":"basic"}]
                    


                    Grafana-refresh funktioniert, es muss nur in der URL (Quelle) mit angegeben werden. Bsp: &refresh=5m ergänzen.

                    Dominik F.D Offline
                    Dominik F.D Offline
                    Dominik F.
                    wrote on last edited by
                    #89

                    @Uhula

                    Super, das Widget sieht genauso aus wie es sein sollte und hab nun eine Vorlage für den Shadow falls ich sowas nochmal brauche.

                    Das mit dem Refresh funktioniert bei mir nicht richtig.

                    http://192.168.178.38:3000/d/UxKIGxkgz/temperaturen?orgId=1&refresh=30m&kiosk&from=1582543232156&to=1582629632156&panelId=2&fullscreen
                    

                    Refresh ist dort schon enthalten und der aktualisiert sich bei mir trotzdem nicht.

                    D 1 Reply Last reply
                    0
                    • Dominik F.D Dominik F.

                      @Uhula

                      Super, das Widget sieht genauso aus wie es sein sollte und hab nun eine Vorlage für den Shadow falls ich sowas nochmal brauche.

                      Das mit dem Refresh funktioniert bei mir nicht richtig.

                      http://192.168.178.38:3000/d/UxKIGxkgz/temperaturen?orgId=1&refresh=30m&kiosk&from=1582543232156&to=1582629632156&panelId=2&fullscreen
                      

                      Refresh ist dort schon enthalten und der aktualisiert sich bei mir trotzdem nicht.

                      D Offline
                      D Offline
                      der-eine
                      wrote on last edited by der-eine
                      #90

                      @Dominik-F bei mir sieht der link so aus:

                      http://192.168.178.51:3000/d/BFQXFoQZz/raume?orgId=1&from=1582794576508&to=1582880976508&panelId=10&fullscreen&kiosk&theme=dark&refresh=1m
                      

                      und er wird auch aktualisiert.

                      1 Reply Last reply
                      0
                      • mrFenyxM mrFenyx

                        @Bastelritius Hi, wenn du ioBroker.vis-material benutzt dann bitte deinstallieren. Es benutzt eine alte Version von MDUI und macht alles durcheinander.

                        BastelritiusB Offline
                        BastelritiusB Offline
                        Bastelritius
                        wrote on last edited by
                        #91

                        @mrFenyx: Danke, ich glaube das war es. Dann kann ich ja mal etwas rumprobieren.

                        1 Reply Last reply
                        0
                        • Stefan GlückS Offline
                          Stefan GlückS Offline
                          Stefan Glück
                          wrote on last edited by Stefan Glück
                          #92

                          hallo,

                          ich würde gerne deine 2 Demo Projekte importieren, bekomme aber immer wieder fehlermeldungen:
                          acb2081b-b636-4ba0-965f-45c83bfe67ae-image.png
                          hat vielleicht jemand eine idee für mich?

                          danke

                          edit: funktioniert. da hatte ich beim Download ein Problem

                          Dominik F.D 1 Reply Last reply
                          0
                          • Stephan SchleichS Offline
                            Stephan SchleichS Offline
                            Stephan Schleich
                            wrote on last edited by
                            #93

                            Ich hab ein Problem mit der v2.1.1 23.02.2020, und zwar lassen sich dadurch iframes nicht mehr verschieben.

                            Eine andere Frage noch am Rande, ersetzte ich meinen Script Baustein komplett durch deinen oder füge ich den nur dazu, was bewirken diese eigentlic, vor allem was ist wenn ich deins mal wieder lösche und mein altes nicht mehr habe, kommt es dann zu Problemen?

                            UhulaU 1 Reply Last reply
                            0
                            • Stefan GlückS Stefan Glück

                              hallo,

                              ich würde gerne deine 2 Demo Projekte importieren, bekomme aber immer wieder fehlermeldungen:
                              acb2081b-b636-4ba0-965f-45c83bfe67ae-image.png
                              hat vielleicht jemand eine idee für mich?

                              danke

                              edit: funktioniert. da hatte ich beim Download ein Problem

                              Dominik F.D Offline
                              Dominik F.D Offline
                              Dominik F.
                              wrote on last edited by
                              #94

                              @Stefan-Glück

                              hast du dir das Projekt als Zip Datei heruntergeladen und dann versucht diese ZIP Datei zu importieren?

                              @Stephan-Schleich
                              Wenn du ein eigenes CSS Skript geschrieben hast, dann kann es natürlich zu Problemen kommen, muss aber nicht unbedingt je nachdem was du gezaubert hast. Du legst ja selber fest wann du was vom Skript nutzt oder nicht.
                              Uhulas Projekt ist darauf ausgelegt, dass du sein CSS Script und das Script dazu nutzt. Dieses bewirkt optische Veränderungen verschiedener Widgets und viele Anpassungsmöglichkeiten. Wenn du seins löscht und deine Vis auf seiner CSS aufgebaut hast, dann kommt es auf jedenfall zu optischen Problemen und vieles wird nicht mehr funktionieren bzw sehr komisch aussehen. Ich bin mir aber auch nicht sicher ob ich deiner letzte Frage richtig verstanden habe :D

                              Stephan SchleichS 1 Reply Last reply
                              0
                              • Dominik F.D Dominik F.

                                @Stefan-Glück

                                hast du dir das Projekt als Zip Datei heruntergeladen und dann versucht diese ZIP Datei zu importieren?

                                @Stephan-Schleich
                                Wenn du ein eigenes CSS Skript geschrieben hast, dann kann es natürlich zu Problemen kommen, muss aber nicht unbedingt je nachdem was du gezaubert hast. Du legst ja selber fest wann du was vom Skript nutzt oder nicht.
                                Uhulas Projekt ist darauf ausgelegt, dass du sein CSS Script und das Script dazu nutzt. Dieses bewirkt optische Veränderungen verschiedener Widgets und viele Anpassungsmöglichkeiten. Wenn du seins löscht und deine Vis auf seiner CSS aufgebaut hast, dann kommt es auf jedenfall zu optischen Problemen und vieles wird nicht mehr funktionieren bzw sehr komisch aussehen. Ich bin mir aber auch nicht sicher ob ich deiner letzte Frage richtig verstanden habe :D

                                Stephan SchleichS Offline
                                Stephan SchleichS Offline
                                Stephan Schleich
                                wrote on last edited by
                                #95

                                @Dominik-F Danke für die Infos.
                                Ich hab den CSS und Script Code einfach in mein Projekt kopiert. Unter Script steht z.b. schon was drin wenn ich das lösche verändert sich auch nichts ob gut oder schlecht weiß ich nicht, hab dort bisher nie was gemacht, deswegen wusst ich nicht ob überschreiben oder dazu kopieren.

                                gehen bei dir denn die iframes wenn du neue hinzufügst?

                                Dominik F.D 1 Reply Last reply
                                0
                                • Stephan SchleichS Stephan Schleich

                                  @Dominik-F Danke für die Infos.
                                  Ich hab den CSS und Script Code einfach in mein Projekt kopiert. Unter Script steht z.b. schon was drin wenn ich das lösche verändert sich auch nichts ob gut oder schlecht weiß ich nicht, hab dort bisher nie was gemacht, deswegen wusst ich nicht ob überschreiben oder dazu kopieren.

                                  gehen bei dir denn die iframes wenn du neue hinzufügst?

                                  Dominik F.D Offline
                                  Dominik F.D Offline
                                  Dominik F.
                                  wrote on last edited by
                                  #96

                                  @Stephan-Schleich

                                  Ich hab bisher noch eine ältere Version laufen und bin da selber mit den Iframes und Grafana am rumprobieren. Ich konnte bisher aber die Iframes problemlos einfügen.

                                  1 Reply Last reply
                                  0
                                  • Stephan SchleichS Stephan Schleich

                                    Ich hab ein Problem mit der v2.1.1 23.02.2020, und zwar lassen sich dadurch iframes nicht mehr verschieben.

                                    Eine andere Frage noch am Rande, ersetzte ich meinen Script Baustein komplett durch deinen oder füge ich den nur dazu, was bewirken diese eigentlic, vor allem was ist wenn ich deins mal wieder lösche und mein altes nicht mehr habe, kommt es dann zu Problemen?

                                    UhulaU Offline
                                    UhulaU Offline
                                    Uhula
                                    wrote on last edited by
                                    #97

                                    @Stephan-Schleich Wenn du mit "nicht verschieben" meinst, dass du die iframes nicht mehr per Klick auswählen kannst, dass Problem habe ich auch manchmal. Du kannst es aber immer über "Widgets | Aktives Widget" aus der Widgetliste auswählen. Eine Ursache kenne ich nicht, das Script scheidet aus, da es im vis Editor nicht ausgeführt wird;: evtl. eine CSS Anweisung, muss ich mal suchen.

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

                                    1 Reply Last reply
                                    0
                                    • mrFenyxM Offline
                                      mrFenyxM Offline
                                      mrFenyx
                                      wrote on last edited by
                                      #98

                                      Hi, kann ich in tnav ein widget haben das nicht wie alle andere aligned sind sondern, z.B. ganz rechts? Die wären auch keine navitems.

                                      UhulaU 1 Reply Last reply
                                      0
                                      • mrFenyxM mrFenyx

                                        Hi, kann ich in tnav ein widget haben das nicht wie alle andere aligned sind sondern, z.B. ganz rechts? Die wären auch keine navitems.

                                        UhulaU Offline
                                        UhulaU Offline
                                        Uhula
                                        wrote on last edited by
                                        #99

                                        @mrFenyx Klar, du musst es mit "mdui-noflex" nur aus der flex-Anordnung rausnehmen, dann kannst du es beliebig positionieren, z.B. mit: left=calc(100% - 40px). Kann auch weiterhin ein "mdui-navitem" sein, muss aber nicht.

                                        [{"tpl":"tplJquiIconNav","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","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-navitem  mdui-noflex ","text":"<i class='material-icons'>help</i>","nav_view":"pageDemoEx1","g_last_change":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":"calc(100% - 40px)","top":"0px","width":"40px","height":"39px","position":""},"widgetSet":"jqui"}]
                                        

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

                                        mrFenyxM jpgorganizerJ 2 Replies Last reply
                                        1
                                        • T Offline
                                          T Offline
                                          Tirador
                                          wrote on last edited by
                                          #100

                                          Hallo,

                                          ich probiere nun auch meine ersten Gehversuche.
                                          Dabei versuche ich die "Grid-Struktur" mit mdui-cols-n umzusetzen.

                                          Ich hätte gerne das Responsive Design so, dass es sowohl im Quer- als auch Hochformat gut aussieht.

                                          Mein Handy hat die folgende Auflösung:

                                          • 396px im Hochformat
                                          • 766px im Querformat

                                          Im Hochformat passt prinzipiell nur eine Card auf den Schirm. Im Querformat könnte man zwei nebeneinander packen.

                                          Muss ich dann alles auf den kleinsten gemeinsamen Nenner ausrichten, d.h. 766 / 2 = 383 px?

                                          Ich habe gesehen das es im CSS für jede mdui-col-x Breite ein min-width und ein max-width gibt.
                                          Oder muss ich dann max-width auf 396 px einstellen und min-width auf 383 px?

                                          Die weitere Verkomplizierung.
                                          Es gibt nun noch ein Tablet, dass ich mit dem gleichen Design füttern wollen würde.

                                          Das Tablet hat die folgende Auflösung:

                                          • 587px im Hochformat
                                          • 939px im Querformat

                                          Ist das überhaupt mit einem responsive Design alles unter einen Hut zu zaubern?

                                          Dominik F.D 1 Reply Last reply
                                          0
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          494

                                          Online

                                          32.4k

                                          Users

                                          81.4k

                                          Topics

                                          1.3m

                                          Posts
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Login

                                          • Don't have an account? Register

                                          • Login or register to search.
                                          • First post
                                            Last post
                                          0
                                          • Home
                                          • Recent
                                          • Tags
                                          • Unread 0
                                          • Categories
                                          • Unreplied
                                          • Popular
                                          • GitHub
                                          • Docu
                                          • Hilfe