Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. bug im materialdesign - dialog iframe Widget

    NEWS

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

    • ioBroker goes Matter ... Matter Adapter in Stable

    • Monatsrückblick - April 2025

    bug im materialdesign - dialog iframe Widget

    This topic has been deleted. Only users with topic management privileges can see it.
    • arteck
      arteck Developer Most Active last edited by arteck

      @Scrounger haben wir ein bug in dem icon ??die 2 scrollbalken kann ich nicht ausblenden

      aa36f49a-d21e-492b-af25-d7187db08944-grafik.png

      müsste das hier sein
      b1d35b94-4b0c-4f62-8d0c-b54989a9eb86-grafik.png

      liv-in-sky 1 Reply Last reply Reply Quote 0
      • arteck
        arteck Developer Most Active last edited by arteck

        8fa89ee2-9418-42ec-9565-92b013139f04-grafik.png

        der ist es

        @liv-in-sky du weisst bestimmt wie ich es per css überschreiben kann .... auf overflow: hidden

        BananaJoe liv-in-sky 2 Replies Last reply Reply Quote 0
        • BananaJoe
          BananaJoe Most Active @arteck last edited by BananaJoe

          @arteck da könnte es mehrere Ansätze geben ...

          Nur für das jeweilige Widget:

          #w00123 {
              overflow: hidden;
          }
          

          im CSS-Reiter von VIS einfügen und w00123 dann mit der jeweiligen Widget-Nummer ersetzen
          Bei mehreren Widgets ggf. Wiederholen

          Ansonsten hast du da jede Menge Bezeichnungen, folgendes könnte auch gehen

          .scrollbar-view {
              overflow: hidden;
          }
          

          was dann aber auch überall in deinem Projekt gelten würde wo diese Klasse vorkommt.

          Alternativ erstellst du deine eigene CSS-Klasse:

          .bitte-keine-scrollbars {
              overflow: hidden;
          }
          

          und fügst diese beim Widget unter Generell => CSS Klasse mit dem Namen bitte-keine-scrollbars ein

          Dazu kommt der Effekt das es sein kann das du am PC die Scrollbars trotzdem noch siehst, auf dem Tablet sind die dann weg. Man kann die Scrollbars auch umdesignen, also z.B. nur 1 Pixel breit in rot oder 0px breit. So etwas sieht man auch am PC sofort

          arteck 1 Reply Last reply Reply Quote 0
          • liv-in-sky
            liv-in-sky @arteck last edited by

            @arteck

            bin etwas verwirrt - bei mir sieht das ganz anders aus, wenn ich das mat-des dialog iframe ansehe - bist du sicher, du zeigst nicht das andere iframe vom grafana

            am besten wäre es, du könntest die grafana seite, die du einbindest, definieren und zwar so, dass sie größenmäßig paßt - iframes zeigen immer einen scrollbalken, wenn das anzuzeigende objet zu groß ist

            du kannst auf jeden fall mal den vorschlag von @BananaJoe ausprobieren

            hier mein ausdruck vom widget: und da ist sogar hidden eingestellt - hilft aber nicht -

            Image 003.png

            das hier kommt hinten in der markierten zeile - wird aber nicht angenommen

            Image 002.png

            1 Reply Last reply Reply Quote 0
            • liv-in-sky
              liv-in-sky @arteck last edited by

              @arteck habe noch eine stunde alles mögliche probiert - leider habe ich keine weiteren ideen und es gelingt mitr nicht - @Scrounger hat da mehr überblick - viell. meldet er sich noch

              beispiel, was ich getestet habe (damit konnte ich bei meinen widgets die scrollen eine schönere scrollbar erzeugen - mit material design geht das nicht:

              ....::-webkit-scrollbar {
                 width: 0px !important;
                  background: transparent !important; 
                   display: none !important;
                  scrollbar-width: none;
              }
              .....::-webkit-scrollbar-thumb {
                 width: 0px !important;
                  background: transparent !important; 
                   display: none !important;
                  scrollbar-width: none;
              }
              
              1 Reply Last reply Reply Quote 0
              • arteck
                arteck Developer Most Active @BananaJoe last edited by

                @bananajoe ne so einfach ist es nicht.. auf die idee bin ich auch schon gekommen...

                deshalb die frage an die, die sich mehr mit css beschäftigen :-).. da tickt das widget anders

                @liv-in-sky ja das was ich geschickt habe ist direkt von dem widget. wenn ich es da auf hidden stellen ist der balken weg guck
                8bc02d6b-459d-4bba-8c67-873701fa7539-grafik.png

                das grafana gedönz kommt als nächstes.. aber einz nach dem anderen ..

                liv-in-sky 1 Reply Last reply Reply Quote 0
                • liv-in-sky
                  liv-in-sky @arteck last edited by liv-in-sky

                  @arteck
                  ich nehme an das dies nicht funktioniert

                  .scrollbar-view{ overflow:hidden !important;}
                  

                  im ccs-tab der vis

                  arteck 1 Reply Last reply Reply Quote 0
                  • arteck
                    arteck Developer Most Active @liv-in-sky last edited by

                    @liv-in-sky nope

                    liv-in-sky 1 Reply Last reply Reply Quote 0
                    • liv-in-sky
                      liv-in-sky @arteck last edited by

                      @arteck

                      evtl ein jquery script, welches das attribut nachträglich ändert

                      arteck 1 Reply Last reply Reply Quote 0
                      • arteck
                        arteck Developer Most Active @liv-in-sky last edited by arteck

                        @liv-in-sky ich habs

                        .div.css-17x4n39{ overflow:hidden !important;}
                        

                        67468335-092e-46ff-87cd-562b0c04ba76-grafik.png

                        liv-in-sky 1 Reply Last reply Reply Quote 0
                        • liv-in-sky
                          liv-in-sky @arteck last edited by

                          @arteck ahh - eine ebene drüber - 👍

                          arteck 1 Reply Last reply Reply Quote 0
                          • arteck
                            arteck Developer Most Active @liv-in-sky last edited by

                            @liv-in-sky aber nicht immer
                            c24a868f-94b5-42ac-8f1d-727421c6bdf9-grafik.png

                            liv-in-sky 1 Reply Last reply Reply Quote 0
                            • liv-in-sky
                              liv-in-sky @arteck last edited by

                              @arteck sagte in bug im materialdesign - dialog iframe Widget:

                              @liv-in-sky aber nicht immer

                              ändert sich der class name ?

                              arteck 1 Reply Last reply Reply Quote 0
                              • arteck
                                arteck Developer Most Active @liv-in-sky last edited by arteck

                                @liv-in-sky ne der wird nicht generiert.
                                35150517-827c-4902-96e8-75775e3f1fcc-grafik.png

                                zumindest nicht zur laufzeit

                                ich werd bekloppt

                                @Scrounger hilfmal.. kann auch quick and dirty sein... im code ..hauptsache wech 🙂

                                liv-in-sky Scrounger 2 Replies Last reply Reply Quote 0
                                • liv-in-sky
                                  liv-in-sky @arteck last edited by liv-in-sky

                                  @arteck

                                  evtl das problem - eigentlich nur eine theorie - diese änderung ist eigentlich nicht im widget sondern du änderst damit den inhalt des iframes widget - das ganze hat eigentlich wenig mit dem mat-des widget zu tun, sondern mit der eingebundenen seite - wenn also die class geändert wird ist evtl bei einem neuladen des inhalts (ich denke grafana) das nicht der fall

                                  wenn du das ganze nicht in grafana steuern kannst - muss evtl doch ein script her, das irgendwie getriggert wird, wenn der inhalt des iframes upgedatet wird - da seigentliche mat-des widget wird ja nur einmal geladen uns ist dann da

                                  hoffentlich stimmt das, was ich hier zusammenschreibe

                                  arteck 1 Reply Last reply Reply Quote 0
                                  • Scrounger
                                    Scrounger Developer @arteck last edited by

                                    @arteck, @liv-in-sky
                                    das wäre auch mein Vermutung, liegt wahscheinlich am Inhalt des Iframe, evtl. einfach zu groß.
                                    Evtl. kannst du was über die Dialog größe ändern.

                                    Oder einfach mal alles im iframe überschreiben

                                    .dialog_wXXXXX .iFrame_container > * {
                                    overflow:hidden !important;
                                    } 
                                    
                                    1 Reply Last reply Reply Quote 0
                                    • arteck
                                      arteck Developer Most Active @liv-in-sky last edited by arteck

                                      @liv-in-sky damit könntest du sogar recht haben
                                      af373188-908e-401d-b43c-a0e4e40dd5dc-grafik.png
                                      ne andere Seite eingebunden

                                      hast recht

                                      e9f7cf70-04fc-4445-ac99-f859ed65c40f-grafik.png
                                      das view von grafana nur im neuem browser tab.. und ich such mir einen

                                      liv-in-sky 1 Reply Last reply Reply Quote 0
                                      • liv-in-sky
                                        liv-in-sky @arteck last edited by

                                        @arteck

                                        ein paar infos sind hier zu finden

                                        https://stackoverflow.com/questions/583753/using-css-to-affect-div-style-inside-iframe

                                        arteck 1 Reply Last reply Reply Quote 0
                                        • arteck
                                          arteck Developer Most Active @liv-in-sky last edited by arteck

                                          @liv-in-sky ich hasse css..... 🙂

                                          so gehts
                                          0edf6fe2-3983-42e5-acca-9bb01a6d3fae-grafik.png

                                          mit einem navi dialog ..

                                          @liv-in-sky DANKÖÖÖÖÖÖÖÖÖÖ

                                          @Scrounger erledigt... kannst dich wieder hinlegen 🙂

                                          1 Reply Last reply Reply Quote 1
                                          • First post
                                            Last post

                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          1.1k
                                          Online

                                          31.7k
                                          Users

                                          79.7k
                                          Topics

                                          1.3m
                                          Posts

                                          4
                                          19
                                          470
                                          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