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

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

Community Forum

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

NEWS

  • Weihnachtsangebot 2025! 🎄
    BluefoxB
    Bluefox
    22
    1
    1.1k

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

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

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

Geplant Angeheftet Gesperrt Verschoben Visualisierung
650 Beiträge 111 Kommentatoren 224.4k Aufrufe 68 Watching
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • M Offline
    M Offline
    Mac
    schrieb am zuletzt editiert von
    #203

    Hi, wie denn? Wäre nett wenn Du das beschreiben würdest, danke.

    1 Antwort Letzte Antwort
    0
    • R Offline
      R Offline
      reini
      schrieb am zuletzt editiert von
      #204

      2 Fragen bitte, wie bekomm ich denn das Bild FullScreen/zentriert? bzw. die Navigationsleiste (EG, OG usw.) schneidet es mir im Hochformat ab? (müsste die nicht wenn responsiv dann mehrzeilig werden ?!)

      @Mac:

      Hi, wie denn? Wäre nett wenn Du das beschreiben würdest, danke. `

      als Widget nimmst du "Bar" , die Einstellungen bei Allgemein & Hintergrund machen lt. Screens

      Background: linear-gradient(to right,red,yellow,green)
      3845_unbenannt.png
      3845_unbenannt2.png
      3845_unbenannt3.png
      3845_img_3483.jpg

      1 Antwort Letzte Antwort
      0
      • T Offline
        T Offline
        tempestas
        schrieb am zuletzt editiert von
        #205

        Hall uhula,

        eine Frage habe ich:

        ich kopiere mir Teile des MD (komplette Abschnitte, also z.B. alles, was unter /* INPUT */ steht ).

        Trotzdem sehen bei mir z.B. die jqui input Widgets nach Zuweisung der CSS Klasse ganz anders aus, als in deinen Vorlagen? Habe ich da was falsch gemacht, muss man doch einfach alles rüberkopieren?

        Danke vorab!

        Nachtrag: ok, war ne blöde Frage: alles rüberkopieren hilft natürlich. Da habe ich die Abhängigkeiten der einzelnen Abschnitte wohl noch nicht verstanden.

        Hach Mensch, es gibt aber auch viel zu lernen…

        Edit 2:

        ok, eine Frage habe ich nun doch. Wie bekomme ich biem jqui date time input nun die Sekunden weg? die werden immer angezeigt, reagieren nicht auf das "zeige keine Sekunden" (logisch, wird ja auch alles überschrieben).

        was müsste ich tun, um bei spezifischen jqui date time inputs den Unterstrich zu entfernen?

        DANKE!

        <size="85">ioBroker | 21 Adapter | Ubuntu Server | intel NUC | Homematic CCU2 | Hue | Osram Lightify| Sonos | 2x Instar Cam | Samsung Tab A 2016 im Holzrahmen| 3x Echo dot | 1x Echo | Neato Botvac D5</size>

        1 Antwort Letzte Antwort
        0
        • T Offline
          T Offline
          tempestas
          schrieb am zuletzt editiert von
          #206

          Da man die Sekunden wohl nicht ausschalten kann im Widget habe ich mir jetzt so beholfen, die Schrift und die Bottom-Border unsichtbar zu machen und dann das Ganze als unsichtbares Overlay über meine Zeitanszeige zu legen, die sich dann wiederum aus den Stunden und Minuten, die man mit dem Widget einstellt, speist.

          Etwas von Hinten durchs Auge in die Brust, aber funktioniert!

          <size="85">ioBroker | 21 Adapter | Ubuntu Server | intel NUC | Homematic CCU2 | Hue | Osram Lightify| Sonos | 2x Instar Cam | Samsung Tab A 2016 im Holzrahmen| 3x Echo dot | 1x Echo | Neato Botvac D5</size>

          1 Antwort Letzte Antwort
          0
          • R Offline
            R Offline
            reini
            schrieb am zuletzt editiert von
            #207

            Hallo Leute,

            habe ich mit dem responsiven Design auch eine Chance diverse reingesetzte Widgets im Bild richtig positioniert zu bekommen? Bild wird auf die Breite angepasst, die Widgets stehen aber dann zum Teil irgendwo herum..
            3845_img_3502.png

            1 Antwort Letzte Antwort
            0
            • arteckA Offline
              arteckA Offline
              arteck
              Developer Most Active
              schrieb am zuletzt editiert von
              #208

              hier kannst du auf prozent umschalten
              1518_unbenannt.jpg

              zigbee hab ich, zwave auch, nuc's genauso und HA auch

              1 Antwort Letzte Antwort
              0
              • R Offline
                R Offline
                reini
                schrieb am zuletzt editiert von
                #209

                @arteck:

                hier kannst du auf prozent umschalten `

                was ändert das aber an einer richtigen Positionierung? Ich hab ja das Problem das ich Widgets in die Cards reinsetze welche dann je nach Auflösung nicht richtig mitwandern an die korrekten Positionen, vielleicht geht das auch gar nicht aber müsste ich es wissen denn dann probier ich nicht weiter :)

                thx

                1 Antwort Letzte Antwort
                0
                • arteckA Offline
                  arteckA Offline
                  arteck
                  Developer Most Active
                  schrieb am zuletzt editiert von
                  #210

                  @reini:

                  @arteck:

                  hier kannst du auf prozent umschalten `

                  was ändert das an der Positionierung? `

                  na die widgets werden nach der Scallierung an die entsprechnde stelle gepackt..so wie du die haben willst

                  zigbee hab ich, zwave auch, nuc's genauso und HA auch

                  1 Antwort Letzte Antwort
                  0
                  • R Offline
                    R Offline
                    reini
                    schrieb am zuletzt editiert von
                    #211

                    @arteck:

                    @reini:

                    @arteck:

                    hier kannst du auf prozent umschalten `

                    was ändert das an der Positionierung? `

                    na die widgets werden nach der Scallierung an die entsprechnde stelle gepackt..so wie du die haben willst `

                    ich checks nicht, die Widgets wandern auch mit den % irgendwo hin, die Temperatur müsste Mitte des Raumes bleiben und das LED beim TV - die Widgets müssten doch dann auch kleiner werden wenn das Bild responsiv kleiner wird, vielleicht geht das auch gar nicht was ich meine…trotzdem danke

                    Ich werde das Bild einfach alleine darstellen und die Widgets in nem eigenen Grid darunter
                    3845_2018-01-25_10_41_45-home_-teamviewer-freie_lizenz__keine_kommerzielle_nutzung.png

                    1 Antwort Letzte Antwort
                    0
                    • T Offline
                      T Offline
                      tempestas
                      schrieb am zuletzt editiert von
                      #212

                      EDIT: Hier stand eine wirklich, wirklich dumme Frage von mir.

                      Mein Beeindruckt-Sein vom MD scheint manchmal mit meiner Denkfähigkeit zu kollidieren….

                      also: die hier stehende Frage wurde gelöst

                      <size="85">ioBroker | 21 Adapter | Ubuntu Server | intel NUC | Homematic CCU2 | Hue | Osram Lightify| Sonos | 2x Instar Cam | Samsung Tab A 2016 im Holzrahmen| 3x Echo dot | 1x Echo | Neato Botvac D5</size>

                      1 Antwort Letzte Antwort
                      0
                      • arteckA Offline
                        arteckA Offline
                        arteck
                        Developer Most Active
                        schrieb am zuletzt editiert von
                        #213

                        @reini:

                        @arteck:

                        @reini:

                        was ändert das an der Positionierung? `

                        na die widgets werden nach der Scallierung an die entsprechnde stelle gepackt..so wie du die haben willst `

                        ich checks nicht, die Widgets wandern auch mit den % irgendwo hin, die Temperatur müsste Mitte des Raumes bleiben und das LED beim TV - die Widgets müssten doch dann auch kleiner werden wenn das Bild responsiv kleiner wird, vielleicht geht das auch gar nicht was ich meine…trotzdem danke

                        Ich werde das Bild einfach alleine darstellen und die Widgets in nem eigenen Grid darunter `

                        ok also nochmal…du klickst auf das widget was du verschieben willst... jetzt änderst du die px auf % wie ich es dir angegeben habe.. ewtl. nochmal das widget schieben ..halt nur ein stückchen...

                        jetzt die vis neu laden (nicht den editor) ..somit müsste das widget an der stelle bleiben passen zur Scallierung..
                        1518_unbenannt.jpg

                        zigbee hab ich, zwave auch, nuc's genauso und HA auch

                        1 Antwort Letzte Antwort
                        0
                        • R Offline
                          R Offline
                          reini
                          schrieb am zuletzt editiert von
                          #214

                          danke arteck, es scheitert sicher bei mir schon an der "ContPage1" - habe hier sicher nur Schrott eingestellt (und dort sind die Widgets auch schon verschoben)

                          Kannste mir richtige Einstellungen dafür geben ;)

                          thx
                          3845_2018-01-25_14_17_24-posteingang_-reinhard.hackl_spitz.at-_outlook.png

                          1 Antwort Letzte Antwort
                          0
                          • arteckA Offline
                            arteckA Offline
                            arteck
                            Developer Most Active
                            schrieb am zuletzt editiert von
                            #215

                            du musst "top" und "left" auf % stellen nicht die "width" und "height" (das sind die Grössenangaben)

                            zigbee hab ich, zwave auch, nuc's genauso und HA auch

                            1 Antwort Letzte Antwort
                            0
                            • R Offline
                              R Offline
                              reini
                              schrieb am zuletzt editiert von
                              #216

                              ok danke das hatte ich falsch - ich habs nun hinbekommen das die Widgets in allen Views an der richtigen Stelle sind (card, ContPage, EG)- wenn ich dann die Visualisierung im Browser starte ist es direkt wieder falsch :(

                              Jetzt kann mich das ganze bald am A.. lecken :x
                              3845_2018-01-25_16_05_44-einstellungen.png
                              3845_2018-01-25_16_07_12-home_-teamviewer-freie_lizenz__keine_kommerzielle_nutzung.png

                              1 Antwort Letzte Antwort
                              0
                              • arteckA Offline
                                arteckA Offline
                                arteck
                                Developer Most Active
                                schrieb am zuletzt editiert von
                                #217

                                du hast es immer noch falsch…

                                du musst drauf achten das du das richtige Widget was du plazieren willst markierst und dann "top" und "left" auf % umstellst...

                                nicht eintragen ,du musst den button den ich markiert habe drücken für dieses markierte Widget

                                zigbee hab ich, zwave auch, nuc's genauso und HA auch

                                1 Antwort Letzte Antwort
                                0
                                • O Offline
                                  O Offline
                                  Okidoki3009
                                  schrieb am zuletzt editiert von
                                  #218

                                  Hallo ,

                                  kann mir jemand bitte helfen!

                                  Ich sehe im vis bei Fenster keine Schrift , im Editor ist alles ok.

                                  Ich hatte es nur kopiert und Objekt geändert.
                                  3673_mds.png
                                  3673_mds1.png
                                  3673_mds2.png

                                  1 Antwort Letzte Antwort
                                  0
                                  • UhulaU Offline
                                    UhulaU Offline
                                    Uhula
                                    schrieb am zuletzt editiert von
                                    #219

                                    @Okidoki3009:

                                    kann mir jemand bitte helfen! `
                                    Vielleicht. Im Screenshot kann man leider nicht erkennen, ob du nur für den Wert=0 einen Eintrag in der Werteliste vorgenommen hast oder auch für den Wert=1. Daran könnte es schon liegen, weil im Editor der "Testwert" (0) angenommen wird. Im Browser dann aber der echte Wert deiner Object ID - welcher ist das? Ich vermute "Is opened" hat den Wert 1.

                                    Dann müsste dein Eintrag in der Werteliste lauten:

                                    geschlossen;geöffnet

                                    Weitere Infos: http://forum.iobroker.net/viewtopic.php?f=30&t=10540

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

                                    1 Antwort Letzte Antwort
                                    0
                                    • D Offline
                                      D Offline
                                      dali3
                                      schrieb am zuletzt editiert von
                                      #220

                                      Hallo Ulala

                                      Zur Frage von Okidoki3009 eine kleine Ergänzung:

                                      Die Xiaomi Sensoren geben die Werte true und false zurück, nicht 0/1/2…

                                      wo können diese Werte angepasst werden?

                                      Danke im Voraus

                                      Systeminfo:
                                      Iobroker Pro, Surface 3 (Mobil), Acer T272 (Wand), Raspberry Pi 3, NUC, Synology DS212j (BackUp), Google Home, Xiaomi Aqara (Sensoren, Fühler, Kamera, LED), Revo Superconnect, Philips Hue, IKEA Tradfri...

                                      1 Antwort Letzte Antwort
                                      0
                                      • UhulaU Offline
                                        UhulaU Offline
                                        Uhula
                                        schrieb am zuletzt editiert von
                                        #221

                                        @dali3:

                                        wo können diese Werte angepasst werden? `
                                        Im genutzten Widget "basic ValueList HTML" leider nicht, da dieses nur mit 0,1,… arbeiten kann. Also

                                        (a) entweder ein anderes, boolsches Widget verwenden, zB "basic bool HTML"

                                        (b) oder einen eigenen boolschen State unter javascript.0 anlegen und diesen via Script mit on()-Event jedesmal auf 0/1 anpassen, wenn sich der State des Xiaomi auf false/true ändert.

                                        Ich habe beides nicht getestet. (a) ist natürlich einfacher.

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

                                        1 Antwort Letzte Antwort
                                        0
                                        • D Offline
                                          D Offline
                                          dali3
                                          schrieb am zuletzt editiert von
                                          #222

                                          @Uhula:

                                          @dali3:

                                          wo können diese Werte angepasst werden? `
                                          Im genutzten Widget "basic ValueList HTML" leider nicht, da dieses nur mit 0,1,… arbeiten kann. Also

                                          (a) entweder ein anderes, boolsches Widget verwenden, zB "basic bool HTML"

                                          (b) oder einen eigenen boolschen State unter javascript.0 anlegen und diesen via Script mit on()-Event jedesmal auf 0/1 anpassen, wenn sich der State des Xiaomi auf false/true ändert.

                                          Ich habe beides nicht getestet. (a) ist natürlich einfacher. `

                                          Habe es auch mit Variante (a) gelöst, dachte ev. gibt es einen Trick :)

                                          Danke für dein Feedback!

                                          Systeminfo:
                                          Iobroker Pro, Surface 3 (Mobil), Acer T272 (Wand), Raspberry Pi 3, NUC, Synology DS212j (BackUp), Google Home, Xiaomi Aqara (Sensoren, Fühler, Kamera, LED), Revo Superconnect, Philips Hue, IKEA Tradfri...

                                          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

                                          792

                                          Online

                                          32.5k

                                          Benutzer

                                          81.6k

                                          Themen

                                          1.3m

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

                                          • Du hast noch kein Konto? Registrieren

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