FHEM Forum

FHEM => Frontends => TabletUI => Thema gestartet von: Thyraz am 27 Februar 2016, 23:46:58

Titel: CSS Farb-Anpassungen Slider Widget
Beitrag von: Thyraz am 27 Februar 2016, 23:46:58
Hallo zusammen,

ist es irgendwie möglich die Farben vom Slider Widget anzupassen?
Hab mal mit Chrome Entwicklertools reingespickt und gesehen, dass die Werte aus powerange.min.css kommen.

Habe dann versucht die Werte mit meiner Custom CSS zu überschreiben,
aber die css Datei des Sliders scheint später geladen zu werden als meine Custom CSS (platziert hinter den restlichen CSS Aufrufen in der index.html wie in der sample index.html gezeigt.

Wenn ich direkt die powerange.min.css bearbeite klappt es einwandfrei, darf ich dann aber wahrscheinlich nach jedem Update neu machen. ;)

(http://www.dropbox.com/s/g84gmyuu3915wc2/TabletUISlider2.png?dl=1)
Titel: Antw:CSS Farb-Anpassungen Slider Widget
Beitrag von: roman1528 am 28 Februar 2016, 08:03:51
Moin.

Wenn du es in deine *custum.css verpackst setz ein

!important

dahinter. Dann klappt es auch mit den Nachbarn  :P

Grüße^^
Titel: Antw:CSS Farb-Anpassungen Slider Widget
Beitrag von: setstate am 28 Februar 2016, 09:13:05
Das Color Handling war beim Slider noch nicht so optimal. Ich habe das mal verbessert. Man kann die Farbe jetzt ändern mit

<div data-type="slider" data-device="dummy1" data-color="#dd3355" data-background-color="#aa33ff" class="tap"></div>


oder

<div data-type="slider" data-device="dummy1" class="blue tap"></div>

oder mit einem Color-Schema:

<link rel="stylesheet" href="/fhem/tablet/css/fhem-green-ui.css" />

oder, wie ihr es schon getan habt. Überschreibungen in der

<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
Titel: Antw:CSS Farb-Anpassungen Slider Widget
Beitrag von: zap am 28 Februar 2016, 11:27:41
Wenn ich in der -user.css nur einige Eigenschaften einer Klasse aus der -ui.css neu definiere, werden dann nur die neu definierten überschrieben oder die komplette Klasse?

Beispiel css-Datei 1:

.cell {
    margin:10px 10px !important;
    width: auto;
    text-align: center;
    vertical-align: middle;
}

Dann in css-Datei 2:

.cell { margin: 0; }

"Überleben" das die anderen Attribute aus CSS-Datei 1?

Titel: Antw:CSS Farb-Anpassungen Slider Widget
Beitrag von: Thyraz am 28 Februar 2016, 12:34:50
Danke euch allen. :)

@zap
Ja, die alte Datei wird ja dennoch geladen.
Dein Wert überschreibt also nur den spezifischen vorher geladenen.
Titel: Antw:CSS Farb-Anpassungen Slider Widget
Beitrag von: kvo1 am 28 Februar 2016, 18:26:48
ZitatDas Color Handling war beim Slider noch nicht so optimal. Ich habe das mal verbessert. Man kann die Farbe jetzt ändern mit
Hi setstate,

funktioniert wie beschrieben, danke !