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

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. Material Design Widgets: Top App Bar Widget

NEWS

  • Weihnachtsangebot 2025! 🎄
    BluefoxB
    Bluefox
    22
    1
    1.0k

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

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

Material Design Widgets: Top App Bar Widget

Scheduled Pinned Locked Moved Visualisierung
vis
412 Posts 74 Posters 90.3k Views 79 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.
  • liv-in-skyL liv-in-sky

    @damrak2022 nee - ganz verstehe ich nicht

    du hast eine view - deine hauptview oder übersichtsview - darin ist normalerweise (um es einfach zu halten - das app menu widget links oben und das view 8 widget ist über die ganze seite gezogen (von der größe her).

    wählst du etwas im menu aus, wird die ausgewählte view in das view 8 widget "gespiegelt". dein browser ist also immer auf der hauptseite (hauptview)

    es gibt 2 nachteile:

    • auf jedem gerät (pc, tablet, handy) wird die hauptview geöffnet. egal im welchen gerät du dir eine bestimmte view durch das app menu widget ansiehst, werden auf allen anderen geräten die selbe seite angezeigt. du schaust dir auf dem pc die beleuchtungsview der küche an - dann wird auch auf dem tablet im wohnzimmer, die küchenbeleuchtung angezeigt

    • durch die nutzung des json's für untermenus ist das spätere einfügen von neuen views etwas aufwendig, denn jeder eintrag im json ist ja eine weitere view. dadurch stimmt die reihenfolge im view 8 widget nicht mehr und muss angepasst werden.

    mehr: siehe chat

    Damrak2022D Offline
    Damrak2022D Offline
    Damrak2022
    wrote on last edited by
    #381

    @liv-in-sky Habe Dir gerade im Chat geantwotet

    Mit besten Grüßen
    Andy

    1 Reply Last reply
    1
    • D3ltoroxpD D3ltoroxp

      Gibt es eine Möglichkeit, das hier

      fully://launcher
      

      mit in die App Bar zu packen, sprich als Menu Punkt z.B. Apps und wenn ich drauf klick, öffnet sich der App Launcher von Fully ? Ich versuche das grad irgendwie ein zu bauen, aber will nicht.

      D3ltoroxpD Online
      D3ltoroxpD Online
      D3ltoroxp
      wrote on last edited by
      #382

      @d3ltoroxp said in Material Design Widgets: Top App Bar Widget:

      Gibt es eine Möglichkeit, das hier

      fully://launcher
      

      mit in die App Bar zu packen, sprich als Menu Punkt z.B. Apps und wenn ich drauf klick, öffnet sich der App Launcher von Fully ? Ich versuche das grad irgendwie ein zu bauen, aber will nicht.

      Hier einer eine Idee, wie ich das sonst lösen könnte ? Ich hätte das irgendwie gern mit als Menu Punkt.

      liv-in-skyL 1 Reply Last reply
      0
      • D3ltoroxpD D3ltoroxp

        @d3ltoroxp said in Material Design Widgets: Top App Bar Widget:

        Gibt es eine Möglichkeit, das hier

        fully://launcher
        

        mit in die App Bar zu packen, sprich als Menu Punkt z.B. Apps und wenn ich drauf klick, öffnet sich der App Launcher von Fully ? Ich versuche das grad irgendwie ein zu bauen, aber will nicht.

        Hier einer eine Idee, wie ich das sonst lösen könnte ? Ich hätte das irgendwie gern mit als Menu Punkt.

        liv-in-skyL Offline
        liv-in-skyL Offline
        liv-in-sky
        wrote on last edited by liv-in-sky
        #383

        @d3ltoroxp damit ein menu punkt einen befeh ausführen könnte, müßte das wohl im widget programmiert werden - vermute ich mal

        was aber geht:

        der button kann auch anders gemacht werden - das er zum layout paßt

        Animation (10).gif

        nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

        D3ltoroxpD 1 Reply Last reply
        0
        • liv-in-skyL liv-in-sky

          @d3ltoroxp damit ein menu punkt einen befeh ausführen könnte, müßte das wohl im widget programmiert werden - vermute ich mal

          was aber geht:

          der button kann auch anders gemacht werden - das er zum layout paßt

          Animation (10).gif

          D3ltoroxpD Online
          D3ltoroxpD Online
          D3ltoroxp
          wrote on last edited by
          #384

          @liv-in-sky Hm das sieht auch nicht schlecht aus. Hättest du mir da den Code dazu ? Oder machst du das über Sichtbar ? Wenn ich das Menu öffne, das der Button sichtbar wird ?
          Und wie hast du die Icons da bekommen oder ist das dann einfach die Fully Launch Seite ?

          liv-in-skyL 2 Replies Last reply
          0
          • D3ltoroxpD D3ltoroxp

            @liv-in-sky Hm das sieht auch nicht schlecht aus. Hättest du mir da den Code dazu ? Oder machst du das über Sichtbar ? Wenn ich das Menu öffne, das der Button sichtbar wird ?
            Und wie hast du die Icons da bekommen oder ist das dann einfach die Fully Launch Seite ?

            liv-in-skyL Offline
            liv-in-skyL Offline
            liv-in-sky
            wrote on last edited by liv-in-sky
            #385

            @d3ltoroxp

            hier kannst du jeden beliebigen html code eintragem - also einen buttton oder ein bild

            Image 7.png

            z.b

            <br>
            
            <style>
            .button-73 {
             appearance: none;
             background-color: #FFFFFF;
             border-radius: 40em;
             border-style: none;
             box-shadow: #ADCFFF 0 -12px 6px inset;
             box-sizing: border-box;
             color: #000000;
             cursor: pointer;
             display: inline-block;
             font-family: -apple-system,sans-serif;
             font-size: 1.2rem;
             font-weight: 700;
             letter-spacing: -.24px;
             margin: 0;
             outline: none;
             padding: 1rem 1.3rem;
             quotes: auto;
             text-align: center;
             text-decoration: none;
             transition: all .15s;
             user-select: none;
             -webkit-user-select: none;
             touch-action: manipulation;
            }
            
            .button-73:hover {
             background-color: #FFC229;
             box-shadow: #FF6314 0 -6px 8px inset;
             transform: scale(1.125);
            }
            
            .button-73:active {
             transform: scale(1.025);
            }
            
            @media (min-width: 768px) {
             .button-73 {
               font-size: 1.5rem;
               padding: .75rem 2rem;
             }
            }   
               
               
            </style>
            <button class="button-73" role="button">Button 73</button>
            

            dann dieses script im script tab im vis editor

            setTimeout(function() {   
            $(".button-73").on('click', function(event){
              console.log("click")
              window.location.href = "fully://launcher"
             /*  window.location.href   = "https://www.fully-kiosk.com/samples/universal-launcher.html"*/
              
            });
            }, 5000);
            

            nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

            1 Reply Last reply
            1
            • D3ltoroxpD D3ltoroxp

              @liv-in-sky Hm das sieht auch nicht schlecht aus. Hättest du mir da den Code dazu ? Oder machst du das über Sichtbar ? Wenn ich das Menu öffne, das der Button sichtbar wird ?
              Und wie hast du die Icons da bekommen oder ist das dann einfach die Fully Launch Seite ?

              liv-in-skyL Offline
              liv-in-skyL Offline
              liv-in-sky
              wrote on last edited by liv-in-sky
              #386

              @d3ltoroxp

              was du auch machen kannst - finde ich besser - wenn man fully browser nutzt

              mit diesen einträgen steuerst du den startapplication dp in den objecten und öffnest direkt die app -ohne den fully launcher

              Image 1.png

              auch das kann durch css schöner gemacht werden

              <br>
              
              <span class="mdc-list-item mdc-ripple-upgraded" onclick="vis.setValue('fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.rhmsoft.fm.hd')">FILE MANAGER</span>
              
              <span class="mdc-list-item mdc-ripple-upgraded" onclick="vis.setValue('fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.google.android.youtube')">YOUTUBE</span>
              
              <br>
              

              um den aufruf zu finden : zb. com.google.android.youtube gehst du in das setting des fully launcher im fully browser und wählst deine app aus - danach steht dieser pfad im setting des fully launchers

              nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

              D3ltoroxpD 1 Reply Last reply
              1
              • liv-in-skyL liv-in-sky

                @d3ltoroxp

                was du auch machen kannst - finde ich besser - wenn man fully browser nutzt

                mit diesen einträgen steuerst du den startapplication dp in den objecten und öffnest direkt die app -ohne den fully launcher

                Image 1.png

                auch das kann durch css schöner gemacht werden

                <br>
                
                <span class="mdc-list-item mdc-ripple-upgraded" onclick="vis.setValue('fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.rhmsoft.fm.hd')">FILE MANAGER</span>
                
                <span class="mdc-list-item mdc-ripple-upgraded" onclick="vis.setValue('fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.google.android.youtube')">YOUTUBE</span>
                
                <br>
                

                um den aufruf zu finden : zb. com.google.android.youtube gehst du in das setting des fully launcher im fully browser und wählst deine app aus - danach steht dieser pfad im setting des fully launchers

                D3ltoroxpD Online
                D3ltoroxpD Online
                D3ltoroxp
                wrote on last edited by D3ltoroxp
                #387

                @liv-in-sky Das heißt ich könnte mir auch eine neue view erstellen und dort Images und einen Link drüber legen ?

                Das man das einfach hier einbaut ?

                d22ea740-e552-45c3-a031-07df873d496c-grafik.png

                liv-in-skyL 1 Reply Last reply
                0
                • D3ltoroxpD D3ltoroxp

                  @liv-in-sky Das heißt ich könnte mir auch eine neue view erstellen und dort Images und einen Link drüber legen ?

                  Das man das einfach hier einbaut ?

                  d22ea740-e552-45c3-a031-07df873d496c-grafik.png

                  liv-in-skyL Offline
                  liv-in-skyL Offline
                  liv-in-sky
                  wrote on last edited by
                  #388

                  @d3ltoroxp ja du kannst aber direkt ein bild als link machen

                  https://www.html-seminar.de/bild-verlinken.htm

                  das bild legst du über den filemanger in die vis
                  in einem img tag kannst du auch die größe des bildes festlegen

                  z.b.

                  <span  onclick="vis.setValue('fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.google.android.youtube')"><img src="/vis.0/armin/img/youtube.gif" width="30px" height="30px"></span>
                  

                  nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

                  D3ltoroxpD 1 Reply Last reply
                  0
                  • liv-in-skyL liv-in-sky

                    @d3ltoroxp ja du kannst aber direkt ein bild als link machen

                    https://www.html-seminar.de/bild-verlinken.htm

                    das bild legst du über den filemanger in die vis
                    in einem img tag kannst du auch die größe des bildes festlegen

                    z.b.

                    <span  onclick="vis.setValue('fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.google.android.youtube')"><img src="/vis.0/armin/img/youtube.gif" width="30px" height="30px"></span>
                    
                    D3ltoroxpD Online
                    D3ltoroxpD Online
                    D3ltoroxp
                    wrote on last edited by
                    #389

                    @liv-in-sky said in Material Design Widgets: Top App Bar Widget:

                    filemanger

                    Ich war zu langsam, ich hab noch nen Post über dir. Welchen File Manager meinst du ? Ich kann das nur über CSS machen ?

                    liv-in-skyL 1 Reply Last reply
                    0
                    • D3ltoroxpD D3ltoroxp

                      @liv-in-sky said in Material Design Widgets: Top App Bar Widget:

                      filemanger

                      Ich war zu langsam, ich hab noch nen Post über dir. Welchen File Manager meinst du ? Ich kann das nur über CSS machen ?

                      liv-in-skyL Offline
                      liv-in-skyL Offline
                      liv-in-sky
                      wrote on last edited by
                      #390

                      @d3ltoroxp

                      dein beispiel bild müßte auch funktionieren

                      ich meinte
                      in der vis-editor heißt der Dateimanager - damit lädt man die bilder hoch

                      willst du immer noch den fully launcher nutzen ? - bei mir kann ich den aufrufen, dann eine app öffnen aber ich komme nicht mehr zurück in den fully browser, nachdem ich die app genutzt habe

                      nur bilder sieht so aus:

                      Image 4.png

                      nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

                      D3ltoroxpD 1 Reply Last reply
                      0
                      • liv-in-skyL liv-in-sky

                        @d3ltoroxp

                        dein beispiel bild müßte auch funktionieren

                        ich meinte
                        in der vis-editor heißt der Dateimanager - damit lädt man die bilder hoch

                        willst du immer noch den fully launcher nutzen ? - bei mir kann ich den aufrufen, dann eine app öffnen aber ich komme nicht mehr zurück in den fully browser, nachdem ich die app genutzt habe

                        nur bilder sieht so aus:

                        Image 4.png

                        D3ltoroxpD Online
                        D3ltoroxpD Online
                        D3ltoroxp
                        wrote on last edited by
                        #391

                        @liv-in-sky Ich würde auch gern direkt in die App, so ist es nicht. Wusste bisher nur wie man über den Fully Launcher da rein kommt. Raus komm ich so direkt auch nicht, muss dann immer die Leiste vom Tablet hochziehen und zurück drücken oder ich ziehe das Fully Menu raus und dort auf Start Url.

                        liv-in-skyL 1 Reply Last reply
                        0
                        • D3ltoroxpD D3ltoroxp

                          @liv-in-sky Ich würde auch gern direkt in die App, so ist es nicht. Wusste bisher nur wie man über den Fully Launcher da rein kommt. Raus komm ich so direkt auch nicht, muss dann immer die Leiste vom Tablet hochziehen und zurück drücken oder ich ziehe das Fully Menu raus und dort auf Start Url.

                          liv-in-skyL Offline
                          liv-in-skyL Offline
                          liv-in-sky
                          wrote on last edited by
                          #392

                          @d3ltoroxp

                          <br>
                          <span  onclick="vis.setValue('fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.google.android.youtube')"><img src="/vis.0/armin/img/Werkzeug.gif" width="30px" height="30px"></span>
                          <span  onclick="vis.setValue('fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.google.android.youtube')"><img src="/vis.0/armin/img/cyberghost-sicher_1.jpg" width="30px" height="30px"></span>
                          <span  onclick="vis.setValue('fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.google.android.youtube')"><img src="/vis.0/armin/img/iconfinder_youtube_834723.png" width="30px" height="30px"></span>
                          
                          

                          das kopierst du in das app menu widget

                          du musst nur die dp des fully adapters angleichen, die apps eingeben und die bilder angleichen

                          funktioniert aber nur mit einem tablet - bei unterschiedlichen tablets wird es um einiges komplizierter

                          nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

                          D3ltoroxpD 1 Reply Last reply
                          0
                          • liv-in-skyL liv-in-sky

                            @d3ltoroxp

                            <br>
                            <span  onclick="vis.setValue('fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.google.android.youtube')"><img src="/vis.0/armin/img/Werkzeug.gif" width="30px" height="30px"></span>
                            <span  onclick="vis.setValue('fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.google.android.youtube')"><img src="/vis.0/armin/img/cyberghost-sicher_1.jpg" width="30px" height="30px"></span>
                            <span  onclick="vis.setValue('fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.google.android.youtube')"><img src="/vis.0/armin/img/iconfinder_youtube_834723.png" width="30px" height="30px"></span>
                            
                            

                            das kopierst du in das app menu widget

                            du musst nur die dp des fully adapters angleichen, die apps eingeben und die bilder angleichen

                            funktioniert aber nur mit einem tablet - bei unterschiedlichen tablets wird es um einiges komplizierter

                            D3ltoroxpD Online
                            D3ltoroxpD Online
                            D3ltoroxp
                            wrote on last edited by
                            #393

                            @liv-in-sky said in Material Design Widgets: Top App Bar Widget:

                            fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.google.android.youtube

                            Kann ich auch nur mit diesem Teil arbeiten ?

                            fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.google.android.youtube
                            

                            Das ganze im html Widget z.b. ? Ich würde dann gern eine eigene view machen, in der ich dann Icons oder Grafiken hinterlege und da drüber dann das html widget und beim klicken öffnet sich die app.

                            Mit http: Adressen klappt das wunderbar, es wird direkt aus der Vis raus die Seite geöffnet.

                            Im Menu habe ich da leider nicht viel Platz um dort in der TopApp Bar die Icons zu platzieren.

                            liv-in-skyL 1 Reply Last reply
                            0
                            • D3ltoroxpD D3ltoroxp

                              @liv-in-sky said in Material Design Widgets: Top App Bar Widget:

                              fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.google.android.youtube

                              Kann ich auch nur mit diesem Teil arbeiten ?

                              fullybrowser.0.192_168_178_44.Commands.startApplication', 'com.google.android.youtube
                              

                              Das ganze im html Widget z.b. ? Ich würde dann gern eine eigene view machen, in der ich dann Icons oder Grafiken hinterlege und da drüber dann das html widget und beim klicken öffnet sich die app.

                              Mit http: Adressen klappt das wunderbar, es wird direkt aus der Vis raus die Seite geöffnet.

                              Im Menu habe ich da leider nicht viel Platz um dort in der TopApp Bar die Icons zu platzieren.

                              liv-in-skyL Offline
                              liv-in-skyL Offline
                              liv-in-sky
                              wrote on last edited by
                              #394

                              @d3ltoroxp

                              du kannst irgendein widget nehmen, das dir den dp mit dem richtigen inhalt setzt

                              z.b material design oder inventwo widgets können einen text in einen dp schreiben

                              nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

                              D3ltoroxpD 1 Reply Last reply
                              0
                              • liv-in-skyL liv-in-sky

                                @d3ltoroxp

                                du kannst irgendein widget nehmen, das dir den dp mit dem richtigen inhalt setzt

                                z.b material design oder inventwo widgets können einen text in einen dp schreiben

                                D3ltoroxpD Online
                                D3ltoroxpD Online
                                D3ltoroxp
                                wrote on last edited by
                                #395

                                @liv-in-sky Sorry irgendwie stehe ich auf dem Schlauch, in welchen DP soll ich was schreiben ? Das war ja jetzt alles html und css integriert in die TopAppBar... Ich dachte das wird halt direkt an den Fully geschickt und eben auf dem Tablet ausgeführt.

                                liv-in-skyL 1 Reply Last reply
                                0
                                • D3ltoroxpD D3ltoroxp

                                  @liv-in-sky Sorry irgendwie stehe ich auf dem Schlauch, in welchen DP soll ich was schreiben ? Das war ja jetzt alles html und css integriert in die TopAppBar... Ich dachte das wird halt direkt an den Fully geschickt und eben auf dem Tablet ausgeführt.

                                  liv-in-skyL Offline
                                  liv-in-skyL Offline
                                  liv-in-sky
                                  wrote on last edited by
                                  #396

                                  @d3ltoroxp

                                  nee - ich habe versucht auch andere apps direkt zu öffnen - hat leider nicht geklappt

                                  fullybrowser.0.192_168_178_44.Commands.startApplication 
                                  

                                  ist ein dp des fully browser adapters - dort wird die app gestartet

                                  nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

                                  D3ltoroxpD 1 Reply Last reply
                                  1
                                  • liv-in-skyL liv-in-sky

                                    @d3ltoroxp

                                    nee - ich habe versucht auch andere apps direkt zu öffnen - hat leider nicht geklappt

                                    fullybrowser.0.192_168_178_44.Commands.startApplication 
                                    

                                    ist ein dp des fully browser adapters - dort wird die app gestartet

                                    D3ltoroxpD Online
                                    D3ltoroxpD Online
                                    D3ltoroxp
                                    wrote on last edited by
                                    #397

                                    @liv-in-sky Klappt nun wunderbar wie gewünscht. Vielen Dank !!!

                                    1 Reply Last reply
                                    1
                                    • Chris TailorC Chris Tailor

                                      Das letzte "Problem", was ich mit der Top App Bar habe ist die Höhe der Menüpunkte. Kann man diese unabhängig von der Grösse des Symbols definieren? Mit den Chrome Entwickler Tools konnte ich die Höhe ohne Probleme manipulieren:
                                      3eaddab7-99d8-4163-bf06-9cf16114cb8a-image.png

                                      <div class="mdc-list-item mdc-ripple-upgraded" tabindex="-1" id="listItem_3" style="height: 120px !important;" data-value=""><span class="mdi mdi-train materialdesign-icon-image mdc-list-item__graphic" style="width: 20px !important;; height: 20px !important;; font-size: 20px !important;; color: #ffffff; padding-top: 8px; padding-bottom: 8px;;"></span><span class="mdc-list-item__text mdc-typography--headline5" id="listItem_3" style="width: 100%; text-align: left; ">
                                                                              SBB
                                                                      </span></div>
                                      

                                      Global über einen CSS Eintrag habe ich das nicht hinbekommen, bzw. die Höhe ändert sich nicht:

                                      .mdc-list-item .mdc-ripple-upgraded { 
                                          height: 120px !important;
                                      }
                                      

                                      Jemand eine Idee?

                                      DickenD Offline
                                      DickenD Offline
                                      Dicken
                                      wrote on last edited by
                                      #398

                                      @chris-tailor said in Material Design Widgets: Top App Bar Widget:

                                      Das letzte "Problem", was ich mit der Top App Bar habe ist die Höhe der Menüpunkte. Kann man diese unabhängig von der Grösse des Symbols definieren? Mit den Chrome Entwickler Tools konnte ich die Höhe ohne Probleme manipulieren:
                                      3eaddab7-99d8-4163-bf06-9cf16114cb8a-image.png

                                      <div class="mdc-list-item mdc-ripple-upgraded" tabindex="-1" id="listItem_3" style="height: 120px !important;" data-value=""><span class="mdi mdi-train materialdesign-icon-image mdc-list-item__graphic" style="width: 20px !important;; height: 20px !important;; font-size: 20px !important;; color: #ffffff; padding-top: 8px; padding-bottom: 8px;;"></span><span class="mdc-list-item__text mdc-typography--headline5" id="listItem_3" style="width: 100%; text-align: left; ">
                                                                              SBB
                                                                      </span></div>
                                      

                                      Global über einen CSS Eintrag habe ich das nicht hinbekommen, bzw. die Höhe ändert sich nicht:

                                      .mdc-list-item .mdc-ripple-upgraded { 
                                          height: 120px !important;
                                      }
                                      

                                      Jemand eine Idee?

                                      Hey, ich weiß das der Beitrag hier schon uralt ist, aber hab in dem Thread hier keine Antwort dazu gefunden.
                                      Habe das selbe Problem und würde die Höhe auch gern ändern, hat da jemand ne Möglichkeit für mich?

                                      1 Reply Last reply
                                      0
                                      • I Offline
                                        I Offline
                                        it00x32
                                        wrote on last edited by
                                        #399

                                        Höhe von Top Titel

                                        ich steh etwas auf der Leitung. Wie kann ich das Fenster des Kopfzeilentext kleiner machen (schwarze Box wo Titel und Subtitel drinnen steht, Nav ist Permanent)?

                                        Der CSS Eintrag .mdc-top-app-bar__row giltet ja nur für die Leiste neben dem Menü

                                        Bildschirmfoto 2022-04-11 um 10.52.04.png

                                        Danke

                                        1 Reply Last reply
                                        0
                                        • Martin BlankM Offline
                                          Martin BlankM Offline
                                          Martin Blank
                                          wrote on last edited by
                                          #400

                                          Guten Abend zusammen.

                                          ist es in der neuen Version irgendwie möglich ein 2 Faches Untermenü zu machen?
                                          Bsp.:

                                          • EG
                                            • Küche
                                            • Wohnzimmer
                                              - Licht
                                              - Rolladen
                                              - usw.
                                            • Büro

                                          Wäre dankbar für Tipps.

                                          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

                                          752

                                          Online

                                          32.5k

                                          Users

                                          81.6k

                                          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