Ich schreibe gerade ein Backend-Plugin und möchte die Höhe einer Komponente (ein Button) zur Laufzeit ändern. Der Komponente wird über das Stylesheet ext-all.css eine Höhe mit dem !important-Keyword zugewiesen.
Versuche ich, die vom Stylesheet vorgegebene Höhe per ExtJS zu überschreiben, indem ich bei der Stylezuweisung (z.B. mit der setHeight-Methode) ebenfalls das !important-Keyword verwende, wird die Änderung nicht vom System übernommen. Lasse ich das !important-Keyword weg, wird der Inline-Style angewendet, aber natürlich vom Stylesheet-Wert überschrieben.
Als Workaround binde ich ein zusätzliches Stylesheet ein, das den height-Wert mittels auto !important zurücksetzt, sodass ich bei der Stylezuweisung über ExtJS auf das !important-Keyword verzichten kann. Sicherlich keine ideale Lösung.
Wie kann ich denn eine !important CSS-Eigenschaft per ExtJS überschreiben?
wie ich dein Problem verstehe brauchst du dafür kein extjs, das funktioniert auch ganz simple mit normalem javascript.
Danke für den Tipp! Das hatte ich auch versucht.
Das Problem ist nicht, dass ich unbedingt ExtJS verwenden möchte, um die CSS-Eigenschaft zu überschreiben. Das Problem ist, dass der JS-Code nicht wie notiert im Frontend landet; z.B. werden vor dem Einlesen des View-Codes die Tabulatoren entfernt.
Ich vermute, dass Shopware den JS-Code auch in darauffolgenden Verarbeitungsschritten „durch den Wolf dreht“, bevor das JavaScript auf das DOM angewendet wird. Und bei diesen Verarbeitungsschritten fliegt wohl das !important-Keyword raus.
Das ist aber nur eine Theorie. Ich habe mich noch nicht sondernlich mit den Innereien von Shopware befasst.