Changing background color of md-autocomplete - angularjs

I am trying to implement md-autocomplete using Angular Materials.
How do I change the background color to white?
Approach 1: I tried to use $mdThemingProvide but it is changing the background of the input box.
Approach 2: I also tried to change color of the form.
Both the approaches didn't work. You can see the code for both below.
What i want to do is to change the background of the md-autocomplete form to white.
How do I do this?
Codes:
Aprroach 1:
.config(function($mdThemingProvider) {
$mdThemingProvider.theme('default')
})
Approach 2:
<form ng-submit = "$event.preventDefault()" style="background:White;">
The output can be seen here.The arrow indicates the background whose color i want to change to white.

Related

How to remove borderColor of NativeBase TextArea?

I am a creating a screen where a user can input any text without constraints.
I tried using NativeBase TextArea and it should work. But when pressed, the border changes color. My expected behavior is that the TextArea's borders should never display any color.
Here is a screenshot of my screen:
Here is a code snippet in creating the textArea:
<TextArea
borderColor="transparent"
h={'98%'}
textAlignVertical="top"
placeholder="| Add Notes"
/>
I tried changing borderColor to 'transparent' but it seems like it is not what I am looking for. That property only changes the borderColor when it is not active.
Maybe there is a way to remove validation of the textArea so that borderColor will not update? Or is there a more suitable property for this kind of feature?
did u try
borderWidth:0,
not sure if it can work tho

How to remove these blue bars/borders in checkbox in Kendo

I am creating a treeview using
kendo.data.HierarchicalDataSource
I want to remove these highlighted border. It is there only when using treeview.
Thanks.
Try overwriting the following style using !important. I overwritten it with red color, you can change it to any color of your choice.
.k-state-selected,
.k-state-selected:link,
.k-state-selected:visited,
.k-tool.k-state-selected
{
color : #ffff;
background-color:#ff0000!important;
}
Sample dojo

How do I set the color of the radio button's control?

How do I set the color of the radio button's control? No matter what color I specify in the style, it draws the outer circle and inner bullet in black. I want it to draw in in white on a black background to match my theme, but it always draws in black. (I'm actually doing this in a Multi-Button, setting the color of the Emblem UIID.)
I tried the first suggestion, to define the constants. That didn't work. Here's what happened.
I tried it two ways. First I defined just the radioSelectedImage and radioUnselectedImage. When that didn't work, I added both the radio*DisImage values, but it did the same thing. The selected and unselected images worked fine, but as soon as I touched a radio button, it got the focus, and the button was drawn in black, which made it invisible against my black background.
I did find an approach that worked, but it required the use of two deprecated classes. Here's what I added to the init() method of my main class:
LookAndFeel lookAndFeel = UIManager.getInstance().getLookAndFeel();
if (lookAndFeel instanceof DefaultLookAndFeel) {
DefaultLookAndFeel defaultLookAndFeel = (DefaultLookAndFeel) lookAndFeel;
Image sel = theme.getImage("RadioButtonSelected.png");
Image unSel = theme.getImage("RadioButtonUnselected.png");
defaultLookAndFeel.setRadioButtonImages(sel, unSel, sel, unSel);
defaultLookAndFeel.setRadioButtonFocusImages(sel, unSel, sel, unSel);
}
The difference here is that I have a way to set the focus images. I can't do that using the constants, which is probably why it doesn't work. I'd really rather not use deprecated classes.
There are theme constants to allow you to add images to the radio button for unselected, selected, etc. Look here...
https://www.codenameone.com/manual/advanced-theming.html

how will i change the color of a font based on a value using angularjs directives?

I would like to create a directive that can change the font color of the text displayed on a span based on some value that is not displayed. I have an array:
$scope.due =[{somedate: "April.8.2010"}, {past:"yes"}];
If the value of "past " is yes, then the value inside the span: <span>{{somedue.date}}</span> will be color red, else if "past" is no, then font color is black. I am new with angularjs so i would appreciate it if you can suggest on how can i do this using angularjs.
You can use ng-class
<span ng-class="{red: past == 'yes', black: past == 'no'}">{{somedue.date}}</span>
where the classes red or black will be applied. You can style those via CSS to make the color red / black.
Example: http://jsfiddle.net/TheSharpieOne/NHS73/
Your data structure was odd in your example, it has been modified in mine to showcase ng-class.
Also: You could use true / false and not need to do a string comparison to 'yes'/'no'.

How to change the BarButtonItem back color?

I am currently working in the C# windows application with DevExpress controls.
Now I want to change back color of bar button item while loading the form.
I've tried following code:
barButton.Appearance.BackColor = Color.Red;
but the bar button back color not changed to red.
By default, bars use the skins to draw their content. In this case, all background colors are provided by specific skin elements, which cannot be changed. The only way to change a specific item's background color is to disable skins:
put the BarAndDockingController component onto a form, and assign it to the BarManager.Controller property. Set BarAndDockingController.PaintStyleName or LookAndFeel to any non-skin style(for example "Flat"). Then use the Bar.Appearance.BackColor property to set the desired color.
Alternatively, you can create your own custom barItem in a way similar to the one described in the How to change the background color of highlighted links KB article.

Resources