I'm trying to change the color of the text when I type in the dcc.dropdown in my dash application.
The color of the elements of the dropdown is fine but the text input looks like is on the default one.
Any help?
Thank you.
dropdown input text
Something like this should do the trick. Just need to specify the color option in the style argument. Can choose whatever color you like - here's a list of CSS colors you can choose: https://www.w3schools.com/cssref/css_colors.asp
dcc.Dropdown(id='dd',
style={'color': 'black'},
options=[{'label':i,'value':i} for i in choices],
value=choices[0]
)
I know this was asked a while ago but I came across the same issue and couldn't find an answer anywhere. You can resolve this issue in the CSS:
.Select input{
color:white;
}
Related
I want to use angular material for contact form but I have problem to change styles of input fields and placeholders or labels when is not on focus. I made codepen and if you look there placeholders are grey. I want them to be green, change fonts to any other, and to make good position for them using padding or everything else.
I try solution as
md-input-container.md-default-theme label,
md-input-container.md-default-theme .md-placeholder {
color: #FDFE67 !important;
}
but nothing happened. I can't figure out how to change this and I didn't find any solution on internet.
Can anyone helps me?
Thanks in advance
I added this piece of code there and it works
md-input-container.md-icon-float>label
{
color: green
}
Demo: http://codepen.io/muzic12freakzz/pen/apKEOm
This is just a starting point. You can add more styles to it.
I installed triggered scrollbox and it's working but text box where you have to write your e-mail has white background and white font(font for whole theme is white). SO i would like to change it to any other color.
Thing is that i can't acces CSS to change it so i have to do it somehow in HTML but i don't know how.
This is the code:
[gravityform id="9" title="true" description="true"]
So question is how can I modify this gravity form code that change color of font?!
Vital information: other solutions can't help(CSS, etc.) bcs wordpress there is bought and it's pretty limited so i'm looking for a solution in HTML that can be implemented particulary in this line code.
You can set styles for input element in your HTML like this:
<input style="color: pink !important; background-color: black !important">
May be you need (may be not) to add !important to your styles to overwrite existing ones.
You can install plugin for custom css and add your custom css there to overide gravity form css.
Here is one simple plugin to do that: Cssor
Write the below css in your style.css
input{
color: #000; // if it is not applying, use ! important
}
It works for all input boxes
I have literally no html/css experience and hence I solicit your help with the following.
I am using a shiny dashboard with a default sidebar. I tried to change the background color and the font color of the sidebar using the following line of code inside the dashboardBody:
tags$head(tags$style(HTML('.skin-black .main-sidebar {color: #000000; background-color: #FFB6C1;}')))
What happened was that the new sidebar has a background color of #FFB6C1, which I intended to. But the font color in the sidebar didn't change into black and it is still white! Any suggestion?
Thanks a lot
San
I came across an example that helped me solving the issue. http://journocode.com/2016/04/04/r-first-web-application-shiny/
Accordingly, the problem was solved by used:
label = HTML('<p style="color:black;">Maximum number of suggestions</p>')
in order to depict the color of the label in black instead of white color obtained when using only:
label = "Maximum number of suggestions"
Of course both were arguments of the selectInput object.
Thanks KH for the help and of course thanks MARIE-LOUISE TIMCKE for your amazing post.
Ciao
Your CSS selector may not be targeting text elements, rather a sidebar div. Assuming your text elements are under the .main-sidebar class, this should/may work. Just replace ELEMENT with whatever HTML tag your text is enclused in, like
.skin-black .main-sidebar ELEMENT {
color: #000000;
.skin-black .main-sidebar {
background-color: #FFB6C1;
}
Whitespace does not matter.
Similar to #Kasper's answer, but to directly embed into shiny code:
dashboardBody(
tags$head(
#in line styling
tags$style(HTML(
#siderbar background
'.skin-blue .main-sidebar {
background-color: white;}',
#siderbar text color
'.skin-blue .main-sidebar .sidebar{
color: #red;}'
)
)
)
Note that
although it changes the style of sidebar, the code is within dashboardBody().
depending on your current dashboard skin color, you need to change the ".skin-blue" (blue is default) to e.g. ".skin-black" as needed
for changing font color, it is essential to have ".sidebar" after ".main-sidebar". ".sidebar" basically is the ELEMENT mentioned by #Kasper. (To locate such elements, use Developer tools in your chrome browser, and inspect everything until you can locate the precise block of html code, and use the ELEMENTs after "class=" for this purpose.)
I'm wondering if it's possible to change the default blue color of a selector list.
Here's an image illustrating what I'm talking about:
Where the S is highlighted, is it possible to change that background color (the color of the selected size only) to something else? I tried using
select:active {
background-color:#abd5cd;
}
But that only shows the color when you actually click on the selector box.
Thanks for any help!
Option 1: Change the dropdown into an unordered list using jQuery as seen here
Option 2: Using select2 or choosen to modify the list with jQuery.
I don't believe that it can be modified directly with CSS.
My control buttons can have text in a number of different colors. However the current buttons need to have text that does not show. For this I add a class called current I realize I could change the colors but is there any property or way to retain color and make a character not visible?
use color: transparent; or visibility:hidden;
Use visibility:hidden; to get what you are looking for.
Fiddle