NEWS
CSS Training
-
Du musst bin deinem Schalter in Ränder noch den Wert eingeben für True oder False.In dem unten angehängtem Code istballes drin.Du musst nur in das Feld mit dem XXXXX deinen Schalter angeben.
{wert:XXXXXXXXXXXXXXX;wert == "true" ? "#17e83b": ""}
-
Warum wiederholst du bei container_radius immer alles?
reicht da nicht eine container klasse und 3 oder 4 radius klassen, die nur den radius jeweils definieren?
bei custom-radio/glow auch.container_radius{ color: white; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.11), 0 2px 2px rgba(0, 0, 0, 0.11), 0 4px 4px rgba(0, 0, 0, 0.11), 0 6px 8px rgba(0, 0, 0, 0.11), 0 8px 16px rgba(0, 0, 0, 0.11), 0 -6px 8px rgba(255, 255, 255, 0.11), 0 -8px 16px rgba(255, 255, 255, 0.11); border: 0.5px solid #29323C; } .container_radius10px { border-radius: 30px; } .container_radius30px { border-radius: 30px; }als css klasse kann man dann die beiden kombinieren
<div class="container_radius container_radius10px"></div> <div class="container_radius container_radius30px"></div>und die Namen noch kürzen
das macht css etwas pflegeleichter und man muss die selben parameter bei Änderung nicht an mehreren Stellen pflegen
@oliverio Ja mach ich eigendlich auch. Ist nur etwas einfacher zu verstehen wenn sich ein Neuling damit beschäftigt.
-
@enrico-fischer
Beim linken Schalter
"Beispiel: Widget = Material bool Switch_____CSS Class:custom-radio_radius30px_____"
sehe ich auch keine Auswirkungen bei der Rand-Farbe (In deinem Demo-Video ebenfalls nicht).
:thinking_face:Nichts desto trotz - sehr schön gemacht, vielen Dank!
-
-
@enrico-fischer
Beim linken Schalter
"Beispiel: Widget = Material bool Switch_____CSS Class:custom-radio_radius30px_____"
sehe ich auch keine Auswirkungen bei der Rand-Farbe (In deinem Demo-Video ebenfalls nicht).
:thinking_face:Nichts desto trotz - sehr schön gemacht, vielen Dank!
@foodfighter beim linken ist der grüne rand auch nicht drin.
-
@foodfighter beim linken ist der grüne rand auch nicht drin.
@enrico-fischer
Ich habe das Projekt extra nochmal frisch importiert.
links ist der grüne Rand auch drin
edit:
Ich hatte die Hoffnung, dass der ausgewaschene Rand dadurch die Farbe ändern würde :D -
@enrico-fischer
Ich habe das Projekt extra nochmal frisch importiert.
links ist der grüne Rand auch drinedit:
Ich hatte die Hoffnung, dass der ausgewaschene Rand dadurch die Farbe ändern würde :Dhast Recht.Mach bei Weite 1 und bei style Solid dann geht es wenn du deinen Adapter eingetragen hast
-
hast Recht.Mach bei Weite 1 und bei style Solid dann geht es wenn du deinen Adapter eingetragen hast
@enrico-fischer
danke -
Hi. Danke für dein Training.
Bin noch voll der noob was CSS angeht.Verstehe deine CSS soweit, aber ich würde gerne diesen Glow bei bei einem Widget haben wenn dies Aktiv ist. Nur da frage ich mich, was trage ich wo ein...
Könntest du/ihr mir dabei behilflich sein?
-
Hi. Danke für dein Training.
Bin noch voll der noob was CSS angeht.Verstehe deine CSS soweit, aber ich würde gerne diesen Glow bei bei einem Widget haben wenn dies Aktiv ist. Nur da frage ich mich, was trage ich wo ein...
Könntest du/ihr mir dabei behilflich sein?
-
@sebwirtz
Ich befasse mich auch gerade NEU mit dem Thema.
Zuerst befüllst du den CSS Reiter in deinem Projekt mit dem CSS Code.
Danach markierst Du ein Widget und vergibst in der CSS Klasse einen Verweis zu dem CSS Code.
Viele Grüße
-
@revobobo
Das habe ich alles gemacht. Aber das ändert mein Widget immer. Möchte gerne das der "glow" nur im aktiv bzw. True Fall erscheint.@sebwirtz sagte in CSS Training:
Möchte gerne das der "glow" nur im aktiv bzw. True Fall erscheint.
Das habe ich dir hier beschrieben , wo du dazu ein Thread erstellt hast zu deiner Frage :
https://forum.iobroker.net/topic/51563/widget-mit-animiertem-schatten-rand-css?loggedin=true
-
@sebwirtz
Ich befasse mich auch gerade NEU mit dem Thema.
Zuerst befüllst du den CSS Reiter in deinem Projekt mit dem CSS Code.
Danach markierst Du ein Widget und vergibst in der CSS Klasse einen Verweis zu dem CSS Code.
Viele Grüße
-
@revobobo hallo, gibt es ein widget oder css code für den tollen on/off switch?
LG
@juergen2304 said in CSS Training:
@revobobo hallo, gibt es ein widget oder css code für den tollen on/off switch?
LG
Ganz oben im ersten Post ist alles drin.
Support us
564
Online32.5k
Benutzer81.7k
Themen1.3m
Beiträge