Ich möchte in meiner vertikalen Navigationsleiste am untersten Rand Uhrzeit und Datum einblenden.
Kann ich das mit Class erreichen?
Das Menue sieht folgendermassen aus:
<html>
<body>
<div class="sheet">
<div class="row">
<div class="cell top-align">
<div data-type="pagetab" data-url="home.html" data-icon="fa-home" data-on-background-color="#aa6900" class="cell big top-space-3x"></div>
<div data-type="pagetab" data-url="outside.html" data-icon="fa-tree" data-on-background-color="#aa6900" class="cell big top-space-3x"></di$
<div data-type="pagetab" data-url="lan.html" data-icon="fa-cloud" data-on-background-color="#aa6900" class="cell big top-space-3x"></div>
<div data-type="pagetab" data-url="sensors.html" data-icon="ftui-door" data-on-background-color="#aa6900" class="cell big top-space-3x"></$
<div data-type="pagetab" data-url="webcam.html" data-icon="fa-video-camera" data-on-background-color="#aa6900" class="cell big top-space-3$
<div data-type="pagetab" data-url="system.html" data-icon="fa-server" data-on-background-color="#aa6900" class="cell big top-space-3x"></d$
</div>
</div>
</div>
<div data-type="clock" data-format="l" class="items-bottom"></div>
<div data-type="clock"
data-format="d-m-Y"></div>
<div data-type="analogclock">
</div>
<div data-type="clock"
data-format="H:i:s"></div>
</body>
</html
class="items-bottom" bringt offenbar nichts.
Einfach eine neue Reihe wäre keine Option?
...werde das wohl so tun
Zitat von: drhirn am 11 Februar 2019, 13:26:47
Einfach eine neue Reihe wäre keine Option?
... ich dachte halt es ginge einfacher ... ;D
Es gäbe schon andere Möglichkeiten auch. Aber einfacher sind die nicht ;)
Jetzt muss ich doch nochmals nachfragen weil ich nicht unbedingt von pagetab auf pagebutton umsteigen möchte.
Offenbar wird bei pagetab automatisch der ganze linke Rand mit der Navigationsleiste gefüllt.
Wie kann ich dann noch unten eine weitere Reihe einfügen?
Moin.
.unten {
position: absolute;
top: calc(100% - 70px) !important;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
white-space: nowrap;
}
So zeige ich bei mir das Datum ganz unten an.
In die fhem-tablet-ui-user.css eintragen und biisl mit den Werten bei top: und left: rumspielen.
Und natürlich:
<div data-type="clock" ........ class="unten"></div>
Grüße^^