In my jSF 2.0-PrimeFaces application I am using component and I need to change the color of the text in the component.
The sample can be found at here
how to change text color of JSF 2-PrimeFaces component?
From primefaces documentation:
There’s only one css style class applying watermark which is ‘.ui-watermark’, you can override this
class to bring in your own style. Note that this style class is not applied when watermark uses html5
placeholder if available.
PrimeFaces Userʼs Guide page:433
Primefaces uses jquery's watermark. Check here for more information.
try this:
input::-webkit-input-placeholder {
color: red !important;
}
Note: That the above only works in some browsers as mentioned in the link. I tested it on chrome and IE7, it is working in Google Chrome but not in Internet Explorer
Related
Using a "dark" theme such as UI Darkness, Le Frog or Dark Hive with jQueryUI 1.12.1, the new CheckboxRadio widget has an invisible white-on-white tick. You can see this on Themeroller. The problem occurs because the tick follows the "Clickable: default state > icon" colour while the tickbox background is "Clickable: active state > text", and dark backgrounds usually set both these things to a light colour.
The tick would be visible if it was in the "Clickable: active state > icon" colour which, IMHO, is what the designers intended. However, the CSS rule precedence isn't quite right - it is for active buttons, but not for active non-buttons that are using "ui-button" styling.
A demo of the fault and my proposed fix is available on JSfiddle. Essentially they need to add this:
.ui-button.ui-state-active .ui-icon {
background-image: url("images/ui-icons_222222_256x240.png");
}
though my demo has the absolute path.
I hope this post saves you some head-scratching as to why your CheckboxRadio isn't working the way you were expecting.
I've reported the problem on the jQueryUI bug tracker (#15155), though at the time of writing they haven't picked it up. Is this the right place for "theme" issues?
I have just created new ASP.NET MVC 5 application which uses by default Bootstrap 3.0. Please tell me why all glyphs icons which I use and action links are blue. You can see this in attached image. I didn't change anything in bootstap.css or any other .css file. Shouldn't it be black by default? How to repair this?
The glyphicons are probably inside of some link tags styled with a blue color and since the glyphicons are simply normal text (just a different font), they inherit the color of their parent element.
If you want them to be black everywhere you could add some css like:
.glyphicon {
color: #000;
}
i am trying to override the opacity of ui-disabled in my app to have a not focusable textfield with white text that i can change per js (<disabled="true">).
i don't know if it will work on all browsers with the opacity set to 1
or how to use the suggestion on this page exactly (on mobileinit or as a css-file and how about the semantics):
http://jquerymobile.com/demos/1.2.0/docs/api/themes.html
You can override jQuery Mobile's CSS with your own. Include a stylesheet after jqm's in your html, or use a style=... attribute on your html tag — either will override the default. Hence the Cascading in Cascading Style Sheets.
I highly recommend using the developer tools built into most browsers. In Chrome, for example, right-click anything in a web page and select Inspect Element. It will show you the computed CSS for the element, including which styles came from which CSS file, which were overridden by other stylesheets, etc. You can even edit the styles in the tool and see what changes would look like.
Here you can see the stylesheet f.css overrides several properties from the jqm stylesheet, which sets them in several places and overrides itself with various classes:
I'm trying to apply jQuery UI Selectable to a portion of my website. However, I do not see either the selection box while dragging the mouse, nor does the color of selected li elements change.
So to understand the problem, I went back to the source:
http://jqueryui.com/demos/selectable/
I see (using IE9 developer tools) that a style .ui-selected is applied to selected elements. Using Trace Styles, IE shows that background-color is originally defined in jquery-ui.css but overridden (ultimately) by #selectable .ui-selected. However, IE does not show the source of #selectable .ui-selected. Searching the jQuery UI style sheet I reference, jquery-ui-1.8.18.custom.css, finds no mention of ui-selected, nor do I find it in jquery.ui.selectable.css.
Where exactly is the demo page getting the CSS for the background color?
I found one of the other jQueryUI demos defines the style for those classes in a custom style sheet, so I ended up following that lead.
http://jqueryui.com/demos/selectable/#serialize
It seems odd that those styles are not part of jQueryUI Themeroller. Perhaps that will change in the future.
I'm using a jQuery UI Theme, which is predominantly white text on a black background. I'm using a <fieldset> with a <legend> and the text of the latter is being display in black on a black background (black being the browser's default font colour).
I've tried applying various jQuery UI Theme CSS classes to the legend (e.g. "ui-widget-content"), but I get too much extra baggage, such as borders and backgrounds, when I just want the text to be white.
Before anyone says "why don't you just make the text white?", I should state that I have switchable themes, so it has to get the colour from the theme's stylesheet.
I know that I can use jQuery to apply the CSS class to all legends, when I know which one I want, thus:
$("legend").addClass("???");
Any help would be greatly appreciated.
I solved the problem by using jQuery to set the <legend> colour to be the same as that of an element with a CSS class of ui-widget-content.
$("legend").css("color", $(".ui-widget-content").css("color"));
Obviously, this depends on there actually being an element with that class present. For my purposes, I know there always will be.