ng-materials md-select change style to look like bootstrap dropdown - css

I am using angularjs and ng-material in my project. I want to make md-select dropdown look like bootstrap dropdown. Attached the dropdown link for the Reference.. I have added animations and it working fine but the prob is when the dropdown is closing.. white backgorund is shown when the dropwdown is closing. Link is in comments. Any help will be helpful.

Related

I would like to make the drop down menu and the mobile menu transparent , I use a theme called simple

I am using a theme for my wordpress website called simple ,I created a main_navigation which first links to a page and then it has sub menu elements which link to the individual parts of the static page.
All these parts of the menu are in perfect shape they link to the corresponding page and everything works fine.The problem i am facing is when i try to change the drop down menu's background and mobile menu's background transparent.
so i used the main word press customizing option to change these menu to transparent and even tried hard code the css , but they did not work.
there is an issue with the theme simple , so to achieve transparent drop down only the values in the wordpress main customization should be tinkered with.

How do I change default color for first part of dropdown navbar in bootstrap?

I am looking to change the initial items color in bootstrap navbar drop-down. I got most of the parts of it fixed but sadly cannot figure out the initial part.
what it looks like before click
this is what I want the navbar to look like.
what it looks like when I click dropdown
this is what it looks like afterwords despite a lot of css manipulation so far. anyone know what I need to do to change that specific part?

Material Design Lite drawer breakpoint

I need to set the Material Design Lite drawer menu so that the hamburger menu is displayed permenantly. The menu must be shown only on click.
There is no documentation available about this. Thank you!
link
I'm going to be honest with you and say I'm not sure what your asking, however.
If you are referring to the hamburger not displaying at all assure that your mdl-layout has the mdl-js-layout
Did you add the menu at runtime? If so, assure that the dom is updated after the fact
//yourCodeThatModifiedTheElement
componentHandler.upgradeDom();
Or is the navigation not showing up at all? Certain breakpoints will hide the navigation in which case you can have the header fixed which will display on all screen sizes by adding mdl-layout--fixed-drawer to your mdl-layout

Hover Menu Issue on Ipad back and forth

I've been pulling my hair out trying to get my CSS hover menu to work properly on iPad. I have tried applying hover classes using javascript with the same result, so it must be in the css. The site also utilizes twitter bootstrap.
What happens currently is that on a tap, the dropdown/link hover state show for a split second, then the previous link dropdown/hover show, then it shows the correct one again and it remains open as it should.
EDIT: In case anyone else has this problem, update bootstrap (primarily the dropdown class) and you should be fine.
Updated bootstrap, primarily the dropdown class javascript.

Style checkbox blue hover in Twitter Boostrap

I can't seem to target the blue hover background of the checkboxes in Twitter Bootstrap. My project is in local dev but just look at any of the checkboxes on this page http://twitter.github.io/bootstrap/base-css.html#forms - When I use Firebug to set them to hover they dont operate like normal hovers. I have tried Chrome dev tools also. I have also just tried styling them using
input[type="checkbox"] {
}
to target. I've tried affecting background-color and box-shadow (inset) and nothing seems to get rid of the blue.
Has anyone any experience of this?
I am not asking how to style checkboxes and if that answer contains and answer for me apologies and please point it out. What I am asking is specific to Bootstrap. I am asking which attribute ( in bootsrap) the blue hue comes from.
There is no Twitter Bootstrap attribute for this. It's just browser depended. Here, look at this simple checkbox. It have the same blue color on hover as it in Bootstrap.
<input type="checkbox"/>
http://jsfiddle.net/gjVm7/

Resources