anyone please help me, I use spectrum color picker in popup modal, but the spectrum color picker is behind of popup modal, I want color picker in front of popup modal. I use z-index but not working, I define z-index: 9999999 !important;, but after build project use gulp build, value of z-index to be z-index: 9 !important;, I use angularJS.
How to solve this problem ?
thanks.
I'm going to make a guess and assume that you're using cssnano to minify your CSS. There's a little configuration option that you should set to true to avoid z-index rebasing: http://cssnano.co/options/#optionssafe-bool.
In your gulpfile.js, you need to set this option, like so: cssnano({safe: true}).
Related
As i am new to drupal 8 , i couldn't able to find the CSS code written for the particular grid in drupal 8
Once logged in then click on class Export a gridview will appear.
I needed a slight adjustment to the last row elements which i have highlighted below.
I need to remove the light blue background color and make the font style black.
BUt i cannot able to trace the location of the css / html file to make the neccessary changes.
Is it possible to change the button color? or is it a inbuilt functionality where we cannot make any changes?
Any help Appreciated
I wrote a chrome extension, and it works properly.
My extension is nothing more than a counter. At the moment, I have to click on the extension icon to see the counter result.
I'd like to have it printed in the bar instead of having to click on an icon to see the result. Is it possible?
I wasn't able to find anything on that, so any help will be really appreciated.
Sorry for not posting here any code, but i don't really think it's necessary for this question.
thanks
The easiest way to do it is to use badges next to the icon.
That's how they look:
To set a badge for your extension's icon (assuming it's a Browser Action):
chrome.browserAction.setBadgeText({text: "1"});
chrome.browserAction.setBadgeBackgroundColor({color: [255, 255, 0, 255]}); // RGBA array
chrome.browserAction.setBadgeBackgroundColor({color: "#FFFF00"}); // CSS value
This can also be done per-tab; see the documentation for more info.
If you really want to change your icon, you can draw whatever you want on a <canvas> element and update your icon with chrome.browserAction.setIcon() using imageData format. Here's an example.
I'm interested to know, How can I change the background color through programming in WP8 App. When I navigate between the pages in my app, the background color that appears is visible at the moment of swiping pages which is either white or black(depends on theme)
Today I had downloaded Imagefusion app from the Store, where background color you see while navigating between pages is light beige, but not white/black. Do you know how can I change the background color of the app layout? Thank you.
I'm using c#, visual studio 2013.
you must be having Grid at top most layer say gridRoot
then, If you want to change its background color programmatically then use:
gridRoot.Background = new SolidColorBrush( Colors.YourColor);
As you haven't set background color to Grid, it shows default color i.e. your theme color.
http://social.msdn.microsoft.com/Forums/en-US/e0fddd42-ecb9-4a2b-b5e5-10f464cdf3e6/change-background-other-than-dark-or-light-in-app?forum=wpdevelop
Here is the easiest way that fits my expectations. I guess this method also works. Thank you very much for your help.
I am facing a problem, I have an observable collection which is hiding/showing the button and changing the text as well according to situation. Everything is working fine.
But now I want to change the background color and foreground color of the button from the code behind at runtime OR I want to set the Style from the code behind. Is it possible or if possible then how?
I tried to create a Style Property in my observable collection and tried to set, but it didn't work, please help me what and where I am going wrong ?
style from code behind can be set easily like this
Note: I am supposing that the style is being created in page resources.
btn.Style = (Style)this.Resources["Style Name"];
On this fiddle http://jsfiddle.net/mjmitche/qVdEy/6/, you can see that the alignment of the text inside the popover is perfect, however, when I put the exact same css/js/html on my site, the text is larger than the container!
I'm trying to figure out what is happening using firebug, but I have to move my cursor off the popover to use firebug, and then the firebug disappears. I can't figure out what settings in my code is changing the presentation. The popovers are created using Twitter Bootstrap.js (you can see the resources in the fiddle)
Nobody really answered the question "How to debug a popover" ::: Simply set the popover to open on load >> $('#element').popover('show')
What I do is kind of weird and only seems to work in Chrome, not Firebug.
The steps are:
Open the Chrome inspector in a new window
Make sure part of the inspector is overtop of the button you're
trying to activate (which is in the background window
Activate the browser window and hover over the button (this activates the popup), now hit
alt+tab (cmd+` on OSX) to switch to the inspector window.
This will not trigger the mouseOut event and leave your popup
attached to the DOM body node! Since you're already in the inspector
you can navigate to it and see the css problem.
Well after looking at the popover CSS, it seems there is no explicitly defined font-size: http://twitter.github.com/bootstrap/1.4.0/bootstrap.min.css (Just do a find on "popover" and look through the CSS)
Perhaps try adding the following CSS and tweaking it from there:
.popover, .popover h3.title, .popover .content { font-size: 14px; }
Hope that helps :)
This is the kind of thing I created my new HTML box visualizer tool for. Check it out!
HTML Box Visualizer - GitHub
open devtools of the browser, then set a breakpoint of Mouse Click. Just Click the target of popover panel and U will see the opening popover. Just debug it like other normal DOM block