Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. CSS Border Einstellungen

    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

    CSS Border Einstellungen

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

      Die vis Version ist die Aktuellste (von gestern). Geht jetzt aber, es lag an den fehlenden "px".

      Vielen Dank

      Dirk

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

        @dirkeb:

        Die vis Version ist die Aktuellste (von gestern). Geht jetzt aber, es lag an den fehlenden "px".

        Vielen Dank

        Dirk `
        Habe dann trotzdem vis geändert, so dass "px" automatisch dazugefügt werden. Danke.

        1 Reply Last reply Reply Quote 0
        • X
          Xanon last edited by

          Hallo,
          gibt es auch eine Möglichkeit über die CSS Border Einstellungen die Ecken oben rund (links und rechts) zu machen und die Ecken unten eckig (rechts und links)?
          Oder muss ich mir da ein Image mit PhotoShop erstellen?

          Homoran foxriver76 sigi234 3 Replies Last reply Reply Quote 0
          • Homoran
            Homoran Global Moderator Administrators @Xanon last edited by

            @Xanon sagte in CSS Border Einstellungen:

            gibt es auch eine Möglichkeit

            nein!
            zumindest nicht in der GUI - ob es über eigene CSS-Klassen geht weiß ich nicht

            X 1 Reply Last reply Reply Quote 0
            • X
              Xanon @Homoran last edited by

              @Homoran
              Ok, danke für die schnelle Antwort👍

              1 Reply Last reply Reply Quote 0
              • foxriver76
                foxriver76 Developer @Xanon last edited by

                @Xanon Du kannst eine CSS-Klasse schreiben und sie dem Widget zuweisen. Photoshop klingt sehr umständlich.

                X 1 Reply Last reply Reply Quote 0
                • X
                  Xanon @foxriver76 last edited by

                  @foxriver76 sagte in CSS Border Einstellungen:

                  @Xanon Du kannst eine CSS-Klasse schreiben und sie dem Widget zuweisen <--- 🤣. Photoshop klingt sehr umständlich.

                  Vielen Dank für die Antwort👍🏻
                  Aber neee kann ich nicht 😞

                  foxriver76 1 Reply Last reply Reply Quote 0
                  • foxriver76
                    foxriver76 Developer @Xanon last edited by

                    @Xanon Wieso?

                    Neue CSS-Klasse erstellen, z. B.:

                    .top-radius {
                        border-style: double;
                        border-width: 3px;
                        border-color: white;
                        border-top-left-radius: 20px;
                        border-top-right-radius: 20px;
                    }
                    

                    Werte musst du anpassen. Wichtig ist, dass du den Haken bei "CSS Ränder" im Widget selbst weg machst.

                    Einfügen in vis:
                    Bildschirmfoto von 2019-08-10 16-19-48.png

                    Dann CSS-Klasse im Widget hinzufügen über Generell.
                    Bildschirmfoto von 2019-08-10 16-22-49.png

                    beste Grüße

                    fox

                    1 Reply Last reply Reply Quote 1
                    • sigi234
                      sigi234 Forum Testing Most Active @Xanon last edited by sigi234

                      @Xanon

                      [{"tpl":"tplFrame","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","title":"","title_color":"black","title_top":"-10","title_left":"15","header_height":"0","header_color":"black","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0},"style":{"left":"853px","top":"149px","width":"144px","height":"125px","z-index":"0","border-width":"2px","border-style":"solid","border-radius":"5px"},"widgetSet":"basic"},{"tpl":"tplHtml","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0},"style":{"left":"849px","top":"273px","width":"152px","height":"10px","z-index":"1","background-color":"#000000"},"widgetSet":"basic"},{"tpl":"tplHtml","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0},"style":{"left":"854px","top":"272px","width":"146px","height":"1px","background-color":"#c0c0bf","z-index":"2"},"widgetSet":"basic"}]
                      

                      Screenshot (3857).png

                      1 Reply Last reply Reply Quote 0
                      • X
                        Xanon last edited by

                        Danke an Euch beiden für die 2 aufgezeigten Varianten.

                        Habe beide ausprobiert und muss sagen, die Variante von foxriver gefällt mir besser (ist schneller und variabler)
                        Danke foxriver auch für die "Super Erklärung"

                        Danke aber auch an sigi234 für die Alternative Darstellung.

                        Mit iobroker / VIS ist echt so viel möglich, wenn man weiß wie 😉

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

                        Support us

                        ioBroker
                        Community Adapters
                        Donate

                        479
                        Online

                        31.9k
                        Users

                        80.1k
                        Topics

                        1.3m
                        Posts

                        7
                        14
                        3197
                        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