Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. CSS - Widget Bezeichnungen rausfinden

    NEWS

    • Neues Video "KI im Smart Home" - ioBroker plus n8n

    • Neues Video über Aliase, virtuelle Geräte und Kategorien

    • Wir empfehlen: Node.js 22.x

    CSS - Widget Bezeichnungen rausfinden

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

      Liebe Leute,

      eine sicherlich einfache Frage:

      ich will mit CSS ein paar Dinge ändern, weiß aber nie, wie die Widgets heißen, um sie bzw ihre Klasse anzusprechen.

      Beispiel metro bool (dieses Häkchen zum setzen): wie heißt das widget im CSS Bereich?

      Firefox bzw Chrome F12 drücken kenne ich, aber ich finde mich da nicht zu recht.

      Ich habe z.B. mühsam die color codes für einige metro Farben rausgefunden, aber einzelne Widgets zu finden, da tue ich mir tierisch schwer.

      Wer kann mich kurz erleuchten?

      Danke!

      1 Reply Last reply Reply Quote 0
      • F
        Fitti last edited by

        Jedes Widget hat doch einen w00xxx Namen im Editor. Du kannst dann über die ID in CSS dieses Widget ansprechen.

        Am einfachsten untersuchst Du das im F12 Editor und dann im echten View - also nicht im Editor. Dann auf das Widget gehen und mittels rechter Maustaste auf "Untersuchen". Wenn Du im Quellcode mit der Maus rüber gehst, siehst du sehr schön die Hervorhebung.

        Ich habe zwei Bilder angehangen, die den Bezug zeigen.

        Aus versehen habe ich dabei zwei unterschiedliche Widgets erwischt. Zum Verdeutlichen recht es aber wohl, oder?

        So long,

        Fitti
        578_2018-01-22_22_33_55-vis.png
        578_2018-01-22_22_39_05-edit_vis.png

        1 Reply Last reply Reply Quote 0
        • T
          tempestas last edited by

          Danke!

          F12 kannte ich und habe ich genutzt, aber auf das F12, dann Untersuchen bin ich nicht gekommen!

          Die Schriftart bekomme ich bei den bool Checkboxen leider trotzdem nicht geädnert?

          Edit: so langsam begreife ich, wie ich die Dinge in F12 mir ansehen muss… habe jetzt das "geerbt von..." begriffen und konnte die Schriftart einstellen.

          Momentan noch sehr grobschlächtig, weil ich einfach alles im Metro Style überschreibe, aber das Finetuning kommt später 🙂

          [old text pre edit]

          habs so probiert:

          .metro .input-control.checkbox .check,
          .metro .input-control.radio .check {
            width: 16px;
            height: 16px;
            background-color: #ffffff;
            border: 2px #d9d9d9 solid;
            padding: 0;
            margin: 0 5px 0 0;
            position: relative;
            display: inline-block;
            vertical-align: middle;
          
              font-family: RobotoCondensed-Regular
              !important;
          }
          
          

          Größe und Co kann ich ändern, sofern ich ein "important" dahinter setze. Mit der Schriftart passiert nichts?

          1 Reply Last reply Reply Quote 0
          • F
            Fitti last edited by

            Warum nutzt du nicht die widget eigenen Felder dazu?

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

            Support us

            ioBroker
            Community Adapters
            Donate

            978
            Online

            32.1k
            Users

            80.7k
            Topics

            1.3m
            Posts

            2
            4
            828
            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