FTUI version 3

[meier81]

erledigt

Super, hab´s gerade geupdatet, funktioniert einwandfrei! 

LG Markus

[grossmaggul]

Hi.

Mal eine Frage, ich habe folgendes Konstrukt:

Code Auswählen Erweitern

<ftui-grid-tile row="1" col="2" height="3" width="5" shape="round" class="semitransparent">
            <ftui-row color="blue" margin="50px 50px 50px 50px">
                <ftui-column color="red" margin="50px 50px 50px 50px">
                    Dingens
                </ftui-column>
            </ftui-row>
       
</ftui-grid-tile>
Warum werden bei <ftui-row> und <ftui-column>, bei Angabe des margins mit vier Werten, nur die Werte für oben und unten berücksichtigt aber nicht die für rechts und links, sprich die "row" bzw. "column> zieht sich über das gesamte <grid-tile>?


Ist das ein Bug oder soll das so?

[mr_petz]

hi gm,
was würdest du den erwarten? Bild 1 oder 2 oder 3?
margin left/right bei ftui-row funktioniert nicht.
mit padding könntest du es lösen

[grossmaggul]

Ich würde Bild 3 erwarten, denn ich gebe durch die vier Werte doch "Top,Right,Bottom,Left" an oder sehe ich das falsch?
Also würde ich einen Rand beim Kind Objekt an allen vier Kanten bezogen auf das Elternobjekt erwarten.

[mr_petz]

dann so.

Code Auswählen Erweitern

<ftui-grid-tile row="1" col="2" height="3" width="5" shape="round" class="semitransparent">
            <ftui-row color="blue" padding="50px">
                <ftui-column color="red">
                    Dingens
                </ftui-column>
            </ftui-row>
      
</ftui-grid-tile>

wenn man padding="50px" angibt, zählt es für ringsherum.
Warum jetzt margin rechts/links nicht geht, habe ich nicht weier verfolgt.
ich habe nur gesehen dass es rechts und links überschaut.

[grossmaggul]

Es ging mir jetzt in erster Linie gar nicht darum eine Alternative zu finden, sondern um die Frage, ob das so gewollt ist oder ein Bug.

[mr_petz]

wenn ich im row die 50px in der Höhe abziehe geht es.

Code Auswählen Erweitern

<ftui-grid-tile row="1" col="2" height="3" width="5" shape="round" class="semitransparent">
            <ftui-row color="blue">
                <ftui-column color="red" margin="0 50px 0 50px" height="111px">
                    Dingens
                </ftui-column>
            </ftui-row>
</ftui-grid-tile>

irgendwie erkennt er die Höhe von column nicht oderso.

ps. bei einer richtigen Tabelle wirkt margin auch nicht.

[cotecmania]

Ich benötige in einem ftui-chart-data Textausgaben mit "label", möchte die Daten selbst aber nicht grafisch anzeigen.
Wenn ich "hidden" verwende ist der Text aber durchgestrichen.

Wie kann ich also z.B. $last oder $min als Text oben in der Legende anzeigen, die Messwerte selbst aber nicht als Linie etc. anzeigen ...

Ich möchte kein separates eigenständiges "Label" verwenden, da beim tageweise Blättern im Chart z.B. die Textausgaben entsprechend angepasst werden sollen

[FischFuss]

Hallo Leute,
ich habe mir nun auch - mit Hilfe eines Chat-bots, da ich überhaupt keine Ahnung von Webdesign habe - zusammengebaut. Ich habe jetzt alles zusammengestell und es sieht super aus... bis auf dieses eine (2x4)Tile. Es soll einen Dimmer darstellen, auf der linken Seite ein Icon zum ein- und ausschalten und rechts daneben einen horizontalen slider.
Leider bekomme ich Icon und slider nicht nebeneinander, sondern nur übereinander. (siehe Bild)
Hier der ChatBot generierte Code;

Code Auswählen Erweitern

       <!-- Dimmer Licht Bad -->
       <ftui-grid-tile row="3" col="10" height="2" width="4" shape="round">
        <ftui-label size="3" height="0em">Licht Bad</ftui-label>

         <!-- Flex-Container: Verhindert Überlappung -->
         <div class="hbox items-center justify-space-around" style="height: 40%; width: 50%;">
   
           <!-- Linke Spalte: Icon (ca. 30% Breite) -->
           <div class="vbox width-30">
             <ftui-button [(value)]="z2t_D601"
                               fill="none"
                               size="large"
                               class="cell">
                     <ftui-icon [name]="z2t_D601 | map('on: lightbulb-on, off: lightbulb')"
                               [color]="z2t_D601 | map('on: orange, off: white')"
                               size="5">
                    </ftui-icon>
                  </ftui-button>
           </div>

           <!-- Rechte Spalte: Slider (ca. 60% Breite) -->
           <div class="vbox width-60">
             <ftui-slider [value]="z2t_D601:Dimmer"
                          (value)="z2t_D601 Dimmer"
                          min="100"
                          max="1000"
                          step="10">
             </ftui-slider>
           </div>

         </div>
       </ftui-grid-tile>

Ich hoffe jemand von Euch kann den code so verändern, dass das Icon links ist und der Slider rechts daneben... ich raff das einfach nicht (Und ZWEI verschiedene Chatbots offensichtlich auch nicht).
Vielen Dank schonmal für Eure Hilfe!