Moin.
Nun muss auch ich mich tatsächlich mal wieder zu Wort melden.
Habe mir gerade das Update gezogen und muss sagen dass der select-Widget-Handle jetzt richtig gut aussieht...
Dafür hat es aber mein gesamtes layout gesprengt!!! Zeilenabstände sind völlig aus der Spur!
Kannst du das irgendwie wieder hin biegen setstate???
Lade jetzt erstmal mein Backup >:(
Grüße^^
Hallo Roman da ich auch Auszüge aus deinem Layout nutze...
vielleicht liegt es einfach nur an den Höhen... gib mal in deine user.css folgendes ein
/* Section Korrektur für die Höhen */
section {
padding-top: 10px;
padding-bottom: 10px;
line-height: 1.6em;
}
damit sieht es bei mir wieder gut aus
Zitat von: moonsorrox am 15 September 2017, 18:01:27
Hallo Roman da ich auch Auszüge aus deinem Layout nutze...
vielleicht liegt es einfach nur an den Höhen... gib mal in deine user.css folgendes ein
/* Section Korrektur für die Höhen */
section {
padding-top: 10px;
padding-bottom: 10px;
line-height: 1.6em;
}
damit sieht es bei mir wieder gut aus
DANKE! :-*
EDIT!Teillösung^^
Label-Widgets sind z.B. auch aus der Spur (Höhe,Abstand). Ich habe einfach keine Zeit und keine Lust nach jedem dritten Update die ganze FTUI neu zu designen....
Zitat von: moonsorrox am 15 September 2017, 18:01:27
Hallo Roman da ich auch Auszüge aus deinem Layout nutze...
vielleicht liegt es einfach nur an den Höhen... gib mal in deine user.css folgendes ein
/* Section Korrektur für die Höhen */
section {
padding-top: 10px;
padding-bottom: 10px;
line-height: 1.6em;
}
damit sieht es bei mir wieder gut aus
kenne ich irgendwo her :D
Ich habe mein Layout jetzt auch noch mal genau gecheckt und denke, es ist nur eine Teillösung, da bei mir auch noch einiges verschoben ist. Eine richtigen Lösungsansatz habe ich aber auch noch nicht. Macht ja wenig Sinn, alles was setstate baut wieder zu umgehen. ;)
Kann ich bestätigen. Letztes Update hat mir mal wieder alles zerschossen :-\
Lessons learned: Nur updaten, wenn ein frisches Backup bereit liegt ;D
schöne Grüße
Jo
Hallo, das Problem ist das mit der FTUI CSS versucht wird soviel wie möglich abzudecken.
Am einfachsten ist es wenn man ein fertiges Layout hat die FTUI css untern einem anderem Namen abzuspeichern und dann nur diese
im eigenen Layout einbinden. So kann es Updates geben ohne das das eigene Layout zerschossen wird.
Zu der vorgeschlagenen Lösung wird ich eher folgendes machen und in die fhem-tablet-ui-user.css eintragen
/* Section Korrektur für die Höhen */
section {
min-height: auto !important;
line-height: normal !important;
}
Auto funktioniert aber nur bei einer bestimmten Font-Größe.
Bei dem Beispiel zum Beispiel kann man das nicht benutzen
<body>
<main id="panel" class="">
<div class="">
<section>
<div class="col-2"></div>
<div class="col-40 left-align">Normal Size</div>
<div class="col-55 right-align" data-type="switch" data-device="dummy1"></div>
</section>
<section>
<div class="col-2"></div>
<div class="col-40 left-align">Normal Size</div>
<div class="col-55 right-align" data-type="select" data-device="AvReceiverZ2" data-list="inputList" data-delimiter="," data-get="input" data-set="input"></div>
</section>
</div>
<div class="xl">
<section>
<div class="col-2"></div>
<div class="col-40 left-align">Big Size</div>
<div class="col-55 right-align" data-type="switch" data-device="dummy1"></div>
</section>
<section>
<div class="col-2"></div>
<div class="col-40 left-align">Big Size</div>
<div class="col-55 right-align" data-type="switch" data-device="dummy1"></div>
</section>
<div class="xxl">
<section>
<div class="col-2"></div>
<div class="col-40 left-align">Bigger Size</div>
<div class="col-55 right-align" data-type="switch" data-device="dummy1"></div>
</section>
<section>
<div class="col-2"></div>
<div class="col-40 left-align">Bigger Size</div>
<div class="col-55 right-align" data-type="switch" data-device="dummy1"></div>
</section>
</div>
</div>
</main>
</body>
Wie sieht bei euch den der Teil zwischen den 'section' aus?
Bitte mal in dieses Beispiel von mir exemplarisch einsetzen, damit ich es testen kann
Hallo setstate,
folgender code wird bei mir nach dem Update anders dargestellt:
<!DOCTYPE html>
<html>
<head></head>
<body>
<div class="page" id="content2">
<section>
<div class="hbox items-space-between">
<div class="left-align left-space black">
<div class="bold large">Flur unten Ecklampe</div>
<div data-type="label" data-device="Flur_unten_Licht1" data-get="state" data-substitution="toDate().ddmm()" class="timestamp left-align inline"></div>
<div data-type="label" data-device="Flur_unten_Licht1" data-get="state" data-substitution="toDate().hhmm()" class="timestamp left-align inline"></div>
<div data-type="label" data-device="FuL01_AN_01" data-get="state" data-post-text="> " data-part="Next:\s(\d{2}:\d{2}).*" class="left-align inline gray"></div>
<div data-type="label" data-device="FuL01_AUS_01" data-get="state" data-post-text=";" data-part="Next:\s(\d{2}:\d{2}).*" class="left-narrow left-align inline gray"></div>
<div data-type="label" data-device="FuL01_AN_03" data-get="state" data-part="Next:\s(\d{2}:\d{2}).*" data-post-text="> " class="left-align inline gray"></div>
<div data-type="label" data-device="FuL01_AUS_02" data-get="state" data-part="Next:\s(\d{2}:\d{2}).*" class="left-narrow left-align inline gray"></div>
</div>
<div data-type="switch" data-icon="oa2-light_light" data-device="Flur_unten_Licht1" class="right-space"></div>
</div>
<div class="hbox items-space-between">
<div class="left-align left-space black">
<div class="bold large">Flur unten Decke</div>
<div data-type="label" data-device="Flur_unten_Decke" data-get="state" data-substitution="toDate().ddmm()" class="timestamp left-align inline"></div>
<div data-type="label" data-device="Flur_unten_Decke" data-get="state" data-substitution="toDate().hhmm()" class="timestamp left-align inline"></div>
</div>
<div data-type="switch" data-icon="oa2-light_ceiling_light" data-device="Flur_unten_Decke" class="right-space"></div>
</div>
<div class="hbox items-space-between">
<div class="left-align left-space black">
<div class="bold large">Flur oben Decke</div>
<div data-type="label" data-device="Flur_oben_Decke" data-get="state" data-substitution="toDate().ddmm()" class="timestamp left-align inline"></div>
<div data-type="label" data-device="Flur_oben_Decke" data-get="state" data-substitution="toDate().hhmm()" class="timestamp left-align inline"></div>
</div>
<div data-type="switch" data-icon="oa2-light_ceiling_light" data-device="Flur_oben_Decke" class="right-space"></div>
</div>
usw...
Vorher ist die 2b.png. Ursache muss in der fhem-tablet-ui.css bzw. fhem-tablet-ui.min.css liegen. Nach Austausch sieht es wieder aus wie vorher.
schöne Grüße
Jo
Es ist auch gedacht, pro Zeile (ein Button rechts) eine Section zu verbauen und nicht mehrere Zeilen innerhalb einer Section.
Ah ok, das war mir nicht bewusst. Kann ich denn die Striche zwischen den sections unterdrücken?
Schöne Grüße
Jo
<section> ganz weglassen, respektive durch <div> ersetzen