How to make uneditable/readonly class in CSS(SCSS, JS)? - css

I saw not editable class styles on the site on chat pane.
And the classes themselves were dynamically changing.
How to make same?

Related

Class inherit other css styling - ng-deep problem

I have a problem, a button that belongs to an InfoWindow component. The button isn't created in the HTML part of the code but is called whenever the card component is open. I use this InfoCard in two places of the application, and in each component, I change the position of the button using ::ng-deep, because without it the changes won't be applied. The problem is whenever I change from one page to another, the component child1 inherits the child2 CSS of the button, and the same way when I check child1 first. I thought about adding a class to each button and changing in the CSS the call of classes .class1.button and .class2.button, but the problem is the button isn't displayed until I click in the showInfo button to display the card, so in typescript the class is displayed none, and I can't add a class to a class with display none.
Any help on how I can solve that?
The problem is rather difficult to understand for me given your description. However, you might take a look at the following docs. E.g. :host-context can be used to differentiate style application based on the context, e.g. the presence of some class in some ancestor component - assuming you apply some StyleEncapsulation.

Can't change encapsulated class in angular

Angular creates a div with a class container and put inside my component html. Is it possible to change that class to a container-fluid ? I read that angular use encapsulation but im not sure where can I find that div and if its even possible to change it's class.
you can find the html file who has that div in src/app/app.component.html check it and change the class that you want. hope that help

Open accordeon pane in Materialize CSS based on screensize

In materialize CSS, I can open a pane by adding a class active to the one I want opened. Is there also a way to let this be dependent of the current grid breakpoint? For instance using something like active-lg?
Otherwise, is there an option through javascript to get the current breakpoint (S/M/L/XL) from materialize CSS?

Dynamically change QStyle at runtime?

I want to tweak the existing style at runtime, specifically QStyle::PM_ToolBarIconSize. Can this be done? As far as I can tell, you can only inherit QStyle and override pixelMetric().
Edit 1: In the specific case of QStyle::PM_ToolBarIconSize, I could use QToolBar::setIconSize, but that would set the icon size for just a single toolbar instance. I want to change the underlying style hint to affect all toolbars everywhere with one fell swoop. And QStyle::PM_ToolBarIconSize may not be the only style I want to tweak, it's just the first one I'm looking at that just so happens to have a "change this instance's icon size" function.
Edit 2: I can't just make a new style subclass because the current style is already a custom style based on style sheets. There are several styles that a user can choose from. I don't want to create a bunch of new styles just so I can tweak a couple of toolbar icon or menu height size settings.
This is the exact purpose of QProxyStyle.
Why not overriding QStyle then? Your subclass would return an icon size (via pixelMetric) which depends on a settable parameter of your QStyle.
As Qt does not have a dynamic QStyle mechanism, it is better to create a new style instance with the changed icon size, then set it to the QApplication, rather than altering the current style.

Flex combobox custom icon

Trying to set the up and down state icons of a Flex Combobox to images. I see the property for changing the color of the icon, but no property to skin it. How can I do this?
The "properties" are actually styles on ComboBase: upSkin, downSkin, overSkin, disabledSkin.
The default is ComboBoxArrowSkin--take a look at the source code to get more details about overriding or customizing it.

Resources