Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. [Projekt] Material Design CSS für ioBroker.vis

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

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

    This topic has been deleted. Only users with topic management privileges can see it.
    • D
      darkiop Most Active @davimas last edited by

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

      @zahnheinrich

      Die Meisten nutzen mittlerweile den neuen Adapter mit Material Style - da es hier still wurde in der Weiterentwicklung.....
      https://forum.iobroker.net/topic/26925/test-adapter-material-design-widgets-v0-2-x

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

      @davimas ich nutze beides gleichzeitig, wo das eine schwächelt, punktet das andere...

      Ganz genau, @Uhula s CSS ist das Framework für VIS selbst - die Widgets von @Scrounger passen/ergänzen das perfekt.

      Zusammen mit den Neuerungen in Uhula's Version 2 können wir da wohl was sehr brauchbares Erwarten!

      1 Reply Last reply Reply Quote 0
      • Uhula
        Uhula last edited by

        Ja, das MD-Widget Project und mein MD-CSS Project sind zwei vollkommen verschiedene Wege, ersteres setzt auf die MD web components von Google auf (welche natürlich mit installiert werden), meins hingegen spielt mit viel CSS und ein wenig Script nur mit den originalen vis Ausgaben herum, unter Nutzung der basic/HTML Komponenten.

        Deswegen kann ich auch im Editor solche schöne Dinge, wie Drag&Drop usw. nicht einbauen, darauf habe ich gar keinen Einfluss (da fehlt eine Script-Schnittstelle); lediglich über CSS Anweisungen kann ich den Editor leicht in der Darstellung manipulieren, so dass ein look&feel der späteren Darstellung entsteht. Für die Anordnung der cards im content habe ich aber eine Idee, wenn ich den content auf die Nutzung von flex-boxen umsetze, kann man den cards (child-elemente) dann via CSS eine Reihenfolge (order) mitgeben. Mal sehen, würde das dauernde Exportieren und Importieren der Widgets in dem Fall vermeiden.

        Dabei wird mein Projekt sicher nie die Perfektion der echten MD web components erreichen, dafür bleiben aber auch mehr Freiheiten, da jeder selbst die CSS und Scriptdaten direkt verändern kann. Außerdem müssen keine weiteren Componenten installiert werden. Die Adaption der MD web components für ioBroker von Scrounger sieht aber schon mal sehr gut aus, muss ich später mal testen (wenn denn der Tag nicht nur 24 Std hätte).

        AxelF1977 1 Reply Last reply Reply Quote 2
        • AxelF1977
          AxelF1977 @Uhula last edited by

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

          Deswegen kann ich auch im Editor solche schöne Dinge, wie Drag&Drop usw. nicht einbauen, darauf habe ich gar keinen Einfluss (da fehlt eine Script-Schnittstelle); lediglich über CSS Anweisungen kann ich den Editor leicht in der Darstellung manipulieren, so dass ein look&feel der späteren Darstellung entsteht. Für die Anordnung der cards im content habe ich aber eine Idee, wenn ich den content auf die Nutzung von flex-boxen umsetze, kann man den cards (child-elemente) dann via CSS eine Reihenfolge (order) mitgeben. Mal sehen, würde das dauernde Exportieren und Importieren der Widgets in dem Fall vermeiden.

          Ja genau, dies ständige exportieren und importieren nervt mich nämlich auch wie sau. Da die Möglichkeit besteht fest Scripte in VIS einzubinden, wie CSS, hatte ich die Hoffnung, den Code dort einzubinden und die CSS Klassen dann nutzen zu können. Und siehe da, Drag&Drop.

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

          Dabei wird mein Projekt sicher nie die Perfektion der echten MD web components erreichen, dafür bleiben aber auch mehr Freiheiten, da jeder selbst die CSS und Scriptdaten direkt verändern kann. Außerdem müssen keine weiteren Componenten installiert werden.

          Und genau diese Freiheiten machen es für mich perfekt. Also ist es perfekt!

          1 Reply Last reply Reply Quote 0
          • frieda99
            frieda99 @Uhula last edited by

            @Uhula
            Super! ...ick freu mir

            D 1 Reply Last reply Reply Quote 0
            • D
              darkiop Most Active @frieda99 last edited by

              @frieda99 Ebenso, @Uhula wenn du einen Beta Tester um die Feiertage brauchst ... sag bescheid 🙂

              B 1 Reply Last reply Reply Quote 0
              • B
                Buddinski88 @darkiop last edited by

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

                @frieda99 Ebenso, @Uhula wenn du einen Beta Tester um die Feiertage brauchst ... sag bescheid 🙂

                Melde mich auch, da ich eh die ganze Visualisierung überarbeiten möchte 🙂

                1 Reply Last reply Reply Quote 0
                • M
                  MaikB85 last edited by MaikB85

                  kurze Frage: hab mal auf die aktuelle Version aktualisiert, jetzt ist bei der Top-Navigation Bar was anders. Kann ich von dem weißen Balken des aktiven Tabs die Farbe ändern? Wo kann ich das machen? Der Text vom aktiven Tab ist über die CSS-Klasse mdui-amber-acc eingefärbt aber der Balken nicht mehr, bzw. wird von einem weißen Balken überlagert.

                  Ach und noch was. Die Top-Navigation-Bar ist bei mir für das Smartphone zu klein. Ich kann so leider nur auf die ersten Elemente zugreifen. Hast du ne Idee wie man das anders umsetzen könnte? z.B. scrollen der tnavbar oder das die Elemente in die nächste Zeile springen. Geht sowas?

                  Gruß Maik

                  [EDIT] Für der Farbe hab ich das Attribut gefunden. In Zeile 511 des CSS Codes:

                  .mdui-tnav .mdui-flatbutton.ui-state-active {
                    box-shadow: inset 0px -3px 0px 0px #FFCA28;
                  }
                  

                  Da hab ich die Farbe von #FFFFFF auf #FFCA28 angepasst für "amber"

                  1 Reply Last reply Reply Quote 0
                  • L
                    ljmarkus last edited by

                    Hallo...
                    gibt es eine Möglichkeit einen Timer laufen zulassen sobald man die Startseite verlassen hat nach einem Timeout (keine Touchfunktion ausgelöst hat) das er wieder auf die Startseite geht?

                    lg, Markus

                    P 1 Reply Last reply Reply Quote 0
                    • P
                      Pittini Developer @ljmarkus last edited by

                      @ljmarkus Ja, da gibts nen Script für. Das ganze hat aber halt mal grundsätzlich rein gar nichts mit dem Material Design zu tun, also separaten Thread aufmachen oder die Suche bemühen.

                      1 Reply Last reply Reply Quote 1
                      • D
                        DJNick134 last edited by

                        Guten Abend zusammen,
                        ich habe ein Problem mit dem Material Design.
                        Die VIS läuft auf einem Fire HD 10 mit dem Fully Kiosk Browser.
                        In der Top Navigation wird bei einigen "Kategorien" ein weißer Strich neben dem "Kategorienamen" angezeigt (siehe Bild) und bei anderen nicht...
                        Wie bekomme ich diesen Strich weg?

                        Vielen Dank schon mal.

                        Foto 01.01.20, 19 46 41.jpg

                        1 Reply Last reply Reply Quote 0
                        • M
                          Maverick78 last edited by

                          Ich habe eine kurze Frage, vielleicht habe ich es auch überlesen. Im Handbuch finde ich dazu leider nichts.
                          Ich nutze ein Material Design Bar Chart aus Einzelobjekten. Ich bekomme es einfach nicht hin das der Barchart nach Höhe der Werte eingefärbt wird. Außerdem hätte ich die x-Werte auch gerne Datenobjekten zugewiesen.

                          Ich möchte das sehr ungern auf flot und history umbauen müssen.

                          Jemad eine Idee

                          Unbenannt.PNG

                          D 1 Reply Last reply Reply Quote 0
                          • D
                            darkiop Most Active @Maverick78 last edited by

                            @Maverick78 dann bist du hier in diesem Thread aber falsch ... hier geht es um das Material (CSS) Design von Uhula.

                            Du meinst sicher den hier: https://forum.iobroker.net/topic/26925/test-adapter-material-design-widgets-v0-2-x

                            1 Reply Last reply Reply Quote 0
                            • M
                              Maverick78 last edited by

                              🤦‍♂️ sorry wer lesen kann ist klar im Vorteil. Ich geh in den anderen Thread. Vielleicht kann ein Moderator den Post ja löschen.

                              1 Reply Last reply Reply Quote 0
                              • Archimedeus A
                                Archimedeus A last edited by

                                Hi, ich komme ein wenig voran und bin schon ein echter Fan. Frage: Wie ändere ich die Reihenfolge von Cards/Tiles? mdui-float ordnet die ja so an, wie es passt. Es schein so zu sein, dass die Reihenfolge des Anlegens darüber entscheidet. Kann ich die Reihenfolge ändern? Einfach mit der Maus verschieben geht nicht. Oder liegts am nur am Browser?

                                D 1 Reply Last reply Reply Quote 0
                                • D
                                  darkiop Most Active @Archimedeus A last edited by

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

                                  Es schein so zu sein, dass die Reihenfolge des Anlegens darüber entscheidet. Kann ich die Reihenfolge ändern?

                                  Du kannst die Cards in VIS Edit in der Content View ausschneiden und wieder einfügen, so kannst du eine andere Reihenfolge aufbauen 🙂

                                  Archimedeus A 1 Reply Last reply Reply Quote 1
                                  • Archimedeus A
                                    Archimedeus A last edited by

                                    Funzt! Danke

                                    1 Reply Last reply Reply Quote 0
                                    • Archimedeus A
                                      Archimedeus A @darkiop last edited by

                                      @darkiop
                                      Wo wir schon dabei sind: Gibtv es ein Container, der als Button funktioniert oder ein Navibutton, der eine View enthält? Hab es "gelöst" in dem ich in den Content-Co!ntainer einen unsichtbaren Navi-Button über alles gelegt habe. Ist aber unschön (weil: muss dann beim Editieren immer die Widgets über Menü selektieren).
                                      So sieht es gerade aus (responsive!):
                                      tile-content.PNG

                                      D 1 Reply Last reply Reply Quote 0
                                      • D
                                        darkiop Most Active @Archimedeus A last edited by

                                        @Archimedeus-A Schau dir mal https://forum.iobroker.net/topic/26925/test-adapter-material-design-widgets-v0-2-x an.

                                        Archimedeus A 1 Reply Last reply Reply Quote 0
                                        • Archimedeus A
                                          Archimedeus A @darkiop last edited by

                                          @darkiop
                                          Sieht gut aus, ich werds mal ausprobieren

                                          1 Reply Last reply Reply Quote 0
                                          • Uhula
                                            Uhula last edited by Uhula

                                            Material Design CSS V2.0

                                            Its done ! (fast, Doku usw. fehlt noch)

                                            Wer gerne reinschauen möchte, was mit dem Material Design CSS V2.0 so geht, der kann sich dieses als MP4-Film (ca. 1 min, 63 MByte) ansehen, oder sich das neue Demo-Projekt als ZIP herunter laden. Beim Import muss dieses als MD_Demo benannt werden, da sich in der CSS Datei eine Pfadangabe für den Icon-Font darauf bezieht, wählt man einen anderen Projekt-Namen, muss der Pfad in der CSS angepasst werden.

                                            Und wer dann noch Freude dran hat, kann sich weiter unten die Änderungen durchlesen ... es hat sich sehr viel verändert. Zwar ist das Prinzip mit card/aber/lnav/content usw. erhalten geblieben, trotzdem müssen in eigenen Projekten deutliche Anpassungen an den Widgets vorgenommen werden. Mag sich aber für den einen oder anderen lohnen. 😉

                                            MD_Demo V2 als MP4 Film (Download, 1:08 min, 62 MByte)

                                            MD_Demo V2 Projekt (als MD_Demo aufnehmen)

                                            Wenn ich alles fertig habe, erstelle ein neues Thema und verlinke dort alles rein.

                                            Änderungen V2.0

                                            • Umstellung auf helles Thema
                                              Das komplette Design wurde auf das helle Thema (light) umgesetzt und passt sich
                                              flexibel an die jeweils gewählten Hintergrundfarben für abra, tnav, lnav, rnav
                                              und content an in dem es automatisch eine weiße bzw. schwarze Schrift- und
                                              Stiftfarbe wählt. Somit ist das dunkle Schema zur Laufzeit einstellbar.
                                              Siehe auch "Symbole, Icons"!

                                            • Konfiguration
                                              Die Farben werden nicht mehr direkt den abra, tnav, lnav, rnav und content
                                              -Elementen zugeordnet, sondern es wird z.B. im abar ein HTML-Element mit der
                                              CSS-Class mdui-config ausgewertet, in welchem alle Farbangaben zentral
                                              verzeichnet sind.
                                              Das HTML-Element muss folgenden Aufbau haben:
                                              "primary_color":"<farbe>",
                                              "lnav_color":"<farbe>",
                                              "rnav_color":"<farbe>",
                                              "secondary_color":"<farbe>",
                                              "content_color":"<farbe>",
                                              "lnav_fixed_width":"0..9999",
                                              "lnav_fixed_open":"true"
                                              Für <farbe> können die Werte:
                                              red, pink, purple, deeppurple, indigo, blue, lightblue, cyan, teal, green,
                                              lightgreen, lime, yellow, amber, orange, deeporange, brown, grey,
                                              darkgrey, bluegrey, white, black
                                              sowie jede Farbangabe im Format #rrggbb (Bsp: #8050FF) verwendet werden.
                                              In "lnav_fixed_width" wird die Breite in Pixel angegeben, ab der die lnav
                                              links permanent angezeigt werden soll.
                                              In "lnav_fixed_open" wird über true bzw. false festgelegt, ob die lnav beim
                                              Seitenwechsel geöffnet dargestellt werden soll (wenn die Breite ausreicht)

                                              Natürlich kann in allen Angaben auch von der binding-Fähigkeit von ioBroker
                                              Gebrauch gemacht werden um die Angaben über vis-States zu setzen und somit
                                              z.B. tagsüber ein helles Design und nachts ein dunkles Design zu verwenden.
                                              Beispiel: "primary_color":"{vis.0.md.primary_color}" verwendet dann die akutell in
                                              vis.0.md.primary_color eingestellte Farbe

                                            • mdui-flex (Responsive Design)
                                              Die Handhabung des responsive design, also die Anpassung des Inhalts an
                                              die Breite der Darstellung, wurde komplett geändert. Statt bisher mit
                                              dem float-Attribut zu arbeiten, wird nun flex verwendet. Dieses ist
                                              deutlich mächtiger und bietet u.a. die Möglichkeit die Reihenfolge der
                                              Child-Elemente unabhängig von ihrem Auftreten im HTML über die CSS-Class
                                              mdui-order-<nn> (<nn>=1..99) zu setzen. Damit entfällt das unständliche
                                              Kopieren/Einfügen von Elementen im Designer!
                                              Im Demo-Projekt wird flex für tnav, lnav, rnav und den content verwendet.
                                              Die mdui-flex CSS-Class wird dem Containerelement (z.B. mdui-content) zugeordnet,
                                              nicht den Child-Elementen (z.B. den mdui-card).

                                            • mdui-cols-<n>, mdui-rows-<n>
                                              Die Größenangaben der Cards mit mdui-cols-<n> (Breite) und mdui-rows-<n> (Höhe)
                                              basiert nun auf einem 80 Pixel Raster mit <n>=1-24 (bisher 156 Pixel Raster).
                                              Damit ist eine feinere Größenzuweisung möglich.
                                              Weiterhin kann nun jeweils auch eine maximale Größe mit angegeben werden. Dazu
                                              muss nur mdui-cols-<n> zu mdui-cols-<n>-toc-<m> ergänzt werden <m>=1-24, bzw.
                                              mdui-rows-<n> zu mdui-rows-<n>-tor-<m>.
                                              Beispiel: mdui-cols-4-toc-8 führt dazu, dass das Card-Element je nach Platz
                                              320 bis 640 Pixel breit dargestellt wird.
                                              (wenn der Container "mdui-content" die CSS-Class mdui-flex besitzt)
                                              Beispiel: mdui-rows-4-tor-8 führt dazu, dass das Card-Element je nach Platz
                                              320 bis 640 Pixel hoch dargestellt wird
                                              (wenn der Container "mdui-content" die CSS-Class mdui-flex-stretch besitzt)

                                            • Cards
                                              Die Darstellung der Cards wurde verändert. Sie fügen nun keine margins mehr hinzu,
                                              sondern stellen die Vard-Views so dar, wie sie designt wurden. Es empfiehlt sich
                                              in den Card-Views 16 Px linke und oben frei zu lassen.
                                              mdui-card : Darstellung als flache Card, mit 2px Außen-, 14px Innenabstand (früher: mdui-tile)
                                              mdui-card-raised : Darstellung mit Schatten, mit 8px Außen-, 8px Innenabstand (früher: mdui-card)
                                              mdui-card-outlined: Darstellung mit Rahmen, mit 8px Außen-, 8px Innenabstand

                                            • Buttons
                                              Hier wurden die CSS-Class namentlich verändert und vereinheitlicht:
                                              mdui-flatbutton -> mdui-button
                                              mdui-raisedbutton -> mdui-button-raised
                                              mdui-button-outlined: NEU Stellt Buttons mit einer Rahmenlinie dar, über
                                              mdui-<colorname>-ol kann die Rahmenfarbe gesetzt werden. Vorgabe: grau

                                            • Symbole, Icons
                                              Wenn man mit der Umschaltung heller und dunkler Schema arbeiten möchte, muss
                                              man auch dafür sorgen, dass Symbole und Icons z.B. von schwar auf weiß wechseln.
                                              Da dieses mit diskreten Bilddateien (img) nicht per CSS lösbar ist, können nun die
                                              Material Design Icons genutzt werden.
                                              Link: https://material.io/resources/icons/?style=baseline
                                              Hierzu werden alle Icons als Font in der CSS-Datei eingebunden und können dann in
                                              jeder HTML Eingabe als Icon durch <i class="material-icons">iconname</i> genutzt werden.
                                              Bsp:<i class="material-icons">home</i>
                                              Dadruch werden die Icons wie normaler Text behandelt und passen sich sowohl in der
                                              Größe (font-size) als auch in der Farbe (color) an!
                                              Wichtig: Die font-Dateien (Material-Icons-...) liegen im Demo-Projektordner
                                              (Bsp: /vis.0/MD_Demo/) im Images-Ordner. Wird ein eigenes Projekt verwendet, müssen
                                              die font-Dateien kopiert werden und die Pfadangaben in der CSS-Datei müssen
                                              für @font-face {} angepasst werden!!!

                                            • Slider
                                              Die Dartellung der Slider wurde erweitert, so ist nun sowohl die segmentierte
                                              Darstellung als auch die Anzeige des aktuellen Wertes während des slidens möglich.
                                              mdui-segment-<n> : Anzeige mit entspr. vielen Segmenten <n>=5,10,20,25,33,50
                                              mdui-show-hint : Während des Bedienens wird der aktuelle Wert angezeigt (0-100)
                                              mdui-range-<from>-<to> : Da kein Zugriff auf den aktuellen Wert im vis möglich ist
                                              und nur die Info 0 bis 100% im Slider zur Verfügung steht, kann über die mdui-range
                                              Angabe ein Sliderbereich für mdui-show-hint festgelegt werden. 0%=<from> 100%=<to>
                                              Beispiel: mdui-range-0-255 für die Festlegung eines Rot-Wertes

                                            • Tabellen
                                              Die Tabellen CSS-Classes haben sich ein wenig verändert, ebenso die Angabe der Optionen.
                                              Weiterhin wurde die Darstellung an die flat/raised/outlined Darstellung der Cards
                                              angepasst.
                                              mdui-table: Darstellung der Tabelle in normaler Tabellenform
                                              mdui-table-list : Darstellung in Zeilen (rows) Listenform
                                              mdui-table-raised : Darstellung der Zeilen (rows) als Cards, erhaben, mit Schatten
                                              mdui-table-outlined : Darstellung der Zeilen (rows) als Cards, mit Rahmen
                                              Die Optionen werden nun in einer seperaten CSS-Class angegeben:
                                              mdui-table-opt-[-r<responsewidth>][-w<colwidth>][-c<colcount>][-l]

                                            • Diverses

                                              • box-sizing wird global auf box-model gesetzt damit die width und height
                                                Berechnungen besser passen. Hinweis: Größenangaben werden nun inklusive
                                                Border+Padding interpretiert.
                                              • Werden mdui-toggle 100% Buttons in der lnav bzw. rnav verwendet um strukturierte
                                                Menüs zu erzeugen, so zeigen sie nun bereits einen Pfeil nach unten bzw.
                                                nach oben am rechten Rand automatisch an
                                            • Neue bzw. geänderte CSS Classes

                                              • mdui-center: Zentriert die Ausgabe im Element horizontal und vertikal
                                              • mdui-center-h: Zentriert die Ausgabe im Element horizontal
                                              • mdui-center-v: Zentriert die Ausgabe im Element vertikal
                                              • mdui-cols-<n>-toc-<m>: Über "-toc-<m>" kann nun eine max. Breite angegeben
                                                werden, mit <m>=1 bis 24
                                              • mdui-divider : zeichnet eine dünne horizontale Linie, kann z.B. in lnav
                                                verwendet werden, passt sich dem light-dark-Thema an
                                              • mdui-expand[-<height>]: Kann einer Schaltfläche zugewiesen werden um ein Element
                                                zu kollabieren/expandieren. Normalerweise also innerhalb eines Views, der als
                                                Card verwendet werden soll. Sinnvoll für Phone-Screens.
                                                In [-<height>] kann optional eine Zielhöhe in px im collabierten Zustand
                                                angegeben werden, wenn nicht, werden 64px angenommen
                                              • mdui-flex : Wird einem Container (view-in-view) zugeordnet und führt dazu,
                                                dass enthaltene Elemente automatisch angeordnet werden und je nach deren
                                                mdui-cols- Zuweisungen sich in der Breite anpassen
                                              • mdui-flex-stretch : Wird einem Container (view-in-view) zugeordnet und
                                                führt dazu, dass enthaltene Elemente je nach mdui-rows- Zuweisungen
                                                sich in der Höhe anpassen
                                              • mdui-noflex : Das Element wird im mdui-flex nicht berücksichtigt
                                              • mdui-h-flow bzw. mdui-v-flow: umbenannt zu mdui-flow, da man h/v flow durch
                                                das Drehen mit mdui-rotate-<grad> erreichen kann
                                              • mdui-input mdui-center-horizontal umbenannt zu mdui-input mdui-center-h
                                              • mdui-order-N: Festlegung der Reihenfolge dwer Elemente in flex-Darstellung,
                                                wird zur Designzeit im ElElement mit angezeigt
                                              • mdui-rotate-<grad> : Dreht ein Element um <grad>°. 0° entspricht der horizontalen
                                                Darstellung. 15° Schritte sind möglich.
                                                <grad>=000,015,030,045,060,075,090,105,120,135,150,165,180,195,210,225,
                                                240,255,270,285,300,315,330,345
                                              • mdui-rotateX-cw, mdui-rotateX-ccw : Lässt ein Element um seine X-Achse
                                                rotieren, die Rotationsgeschwindigkeit kann über mdui-slowest, mdui-slower,
                                                mdui-slow, ..., mdui-fast, mdui-faster, mdui-fastest festgelegt werden.
                                                cw=im Uhrzeigersinn, ccw=gegen den Uhrzeigersinn
                                              • mdui-rotateY-cw, mdui-rotateY-ccw : Lässt ein Element um seine Y-Achse
                                                rotieren, die Rotationsgeschwindigkeit kann über mdui-slowest, mdui-slower,
                                                mdui-slow, ..., mdui-fast, mdui-faster, mdui-fastest festgelegt werden.
                                                cw=im Uhrzeigersinn, ccw=gegen den Uhrzeigersinn
                                              • mdui-rotateZ-cw, mdui-rotateZ-ccw : Lässt ein Element um seine Z-Achse
                                                rotieren, die Rotationsgeschwindigkeit kann über mdui-slowest, mdui-slower,
                                                mdui-slow, ..., mdui-fast, mdui-faster, mdui-fastest festgelegt werden.
                                                cw=im Uhrzeigersinn, ccw=gegen den Uhrzeigersinn
                                              • mdui-rows-<n>-tor-<m>: Über "-tor-<m>" kann nun eine max. Höhe angegeben
                                                werden, mit <m>=1 bis 24
                                              • .mdui-scale-<n> : Dient der Skalierung des Elements/Widgets.
                                                Mit <n>=010,020,025,030,033,040,050,060,066,070,075,080,090

                                            Z sigi234 kmxak D P 6 Replies Last reply Reply Quote 6
                                            • First post
                                              Last post

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            538
                                            Online

                                            31.8k
                                            Users

                                            80.0k
                                            Topics

                                            1.3m
                                            Posts

                                            111
                                            650
                                            187295
                                            Loading More Posts
                                            • Oldest to Newest
                                            • Newest to Oldest
                                            • Most Votes
                                            Reply
                                            • Reply as topic
                                            Log in to reply
                                            Community
                                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                            The ioBroker Community 2014-2023
                                            logo