Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Praktische Anwendungen (Showcase)
    4. Widget erstellen

    NEWS

    • Wir empfehlen: Node.js 22.x

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker goes Matter ... Matter Adapter in Stable

    Widget erstellen

    This topic has been deleted. Only users with topic management privileges can see it.
    • K
      Kippe last edited by

      Hallo
      Wie bekomme ich so ein Design hin, wo wie es so aussieht als ob mann 3 Ebenen hat.

      IMG_1201.JPG

      Würde mich sehr freuen, wenn mir jemand von Euch sowas geben könnte.👍

      OliverIO 1 Reply Last reply Reply Quote 0
      • OliverIO
        OliverIO @Kippe last edited by OliverIO

        @kippe

        mit css
        https://getcssscan.com/css-box-shadow-examples

        du kannst sogar genau dieses design nachschauen, wenn du die original view hast
        dann einfach rechte maustaste auf das element und untersuchen anklicken.

        dann siehst du den html-code und auf der rechten seite die zugehörigen css-anweisungen
        es müsste sich hier so um box-shadow handeln
        https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/box-shadow
        aber auch noch andere eigenschaften könnten da mit reinspielen

        OliverIO 1 Reply Last reply Reply Quote 0
        • OliverIO
          OliverIO @OliverIO last edited by

          @oliverio

          nicht genau gleich, aber so in die Richtung

          ec376ebc-2122-4ba0-9e9b-0907f9c9c888-image.png

          diese css-anweisung im css-reiter ergänzen
          dann habe ich bspw ein html-element genommen und habe in den widget eigenschaften
          bei General/CSS Class einfach mybox eingetragen
          dann diese box kopiert und entsprechend übereinander gelegt
          müsste theoretisch auch mit anderen widgets funktionieren

          .mybox {
              background-color: #151515;
              border: 2px solid;
              border-color: #202020 #101010 #101010 #202020;
              box-shadow: 0px 0px 15px 5px #000000
          }
          
          K 1 Reply Last reply Reply Quote 0
          • K
            Kippe @OliverIO last edited by

            Bekomme ich nicht hin😠

            OliverIO 1 Reply Last reply Reply Quote 0
            • OliverIO
              OliverIO @Kippe last edited by

              @kippe

              dann mach mal screenshot woran es scheitert

              das css in den css reiter zu kopieren
              oder den text in die einstellung einzutragen
              oder gar schon daran ein html widget zu erstellen?

              K 1 Reply Last reply Reply Quote 0
              • K
                Kippe @OliverIO last edited by

                Hallo
                Ich habe es jetzt hinbekommen und ein wenig mit den Daten gespielt.
                Wie kann ich den Schatten denn gleichmassig haben, also links und rechts gleich ?
                Screenshot (557).png

                OliverIO 1 Reply Last reply Reply Quote 0
                • OliverIO
                  OliverIO @Kippe last edited by

                  @kippe

                  Das ist der Befehl box-shadow
                  Hier ist die Beschreibung
                  https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/box-shadow

                  Jede Zahl steht für eine eigene Eigenschaft / Effekt für den Schatten

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

                  Support us

                  ioBroker
                  Community Adapters
                  Donate

                  899
                  Online

                  32.0k
                  Users

                  80.5k
                  Topics

                  1.3m
                  Posts

                  2
                  7
                  462
                  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