I'm following the Instructions here to incorporate the material design icons in my NW.js app. The problem is, all the icons show up as text. e.g. if I say
<md-icon aria-label="Menu" class="material-icons">menu</md-icon>
The above will show "menu" text in the button. Am I using it all wrong? How can I use the maetrial design icons in my project?
Related
I am trying to build an image selector in my app using Material UI and I want to build a menu where a user can select an image and drag it over to the canvas. The issue is that Popover/Menu has a background that covers the screen and doesn't allow the drop to happen. Is there a better component for this or an option to remove the background but still allow Popover/Menu to work?
I'm having an issue in which my CarouselCaption made via Reactstrap doesn't show up on my phone. After some research, it looks like this is because of the classes d-none d-md-block. How do I fix this issue using the Reactstrap module?
I'm working with Tutorial App of 2sxc ;"Tutorial Custom Icon Font and Picker",and using font awesome.
The icon picker shows lots of fonts but one particular one "fa-graduation-cap" is just not showing up
http://fontawesome.io/icon/graduation-cap/
I've looked into the fontawesome css file and its mentioned there, but in font picker search it just doesn't show up.
Can you help me guide to a particular file so it starts showing?
Thanks in advance
There seems to be a bug, after looking into FontAwesome CSS file if multiple classes are defined for an icon then the Icon Picker will only get the first css class.
Example in terms of Graduation Cap icon in the css it was listed as
.fa-mortar-board:before,
.fa-graduation-cap:before {
content: "\f19d";
}
Hence the icon picker was only listing the icon with Mortar Board name and skipping Graduation cap.
2sxc can you kindly fix this in your angular js code so search picks up all the class names?
I am using Angularjs and bootstrap for my application. I have multiple sections in my page and each sections has multiple columns. I have used bootstrap grid to show the list of items for tablet and desktops ranges and used "row" for each of my sections and then col- class. Due to default bootstrap grid css, it shows one column display at mobile breakpoints for each sections.
However we want only at mobile breakpoint it should display work as accordion control.
I don't want to use css to hide the markup for tablets and desktop and show mobile markup for accordion. I want to use same markup for all of my breakpoints.
I have gone through the bootstrap accordion control also angular-ui project accordion control, however both require new HTML markup.
How can I use same bootstrap grid based markup to show accordion control at mobile breakpoints. Please also note; I tried to use ":target" css properties however it doesn't seems working fine with angular.
Please also note; I am using single page application and HTML5(true) router.
Please advice.
I was looking and found blog by Mary Lou which seems good solution to implement accordion using css only.
Accordion using CSS Only
I need to slow down the transition for my slide slow in the Andromeda theme. I have searched far and wide, and can't seem to find where to do this.
I believe Andromeda uses the Nivo slider, and was included in the theme module.
Using Drupal's Admin menu, navigate to Structure > Views. On the View list page, click on the Edit link for the Image Slideshow. On the Image Slideshow Edit page (admin/structure/views/view/image_slideshow/edit), click on the Settings link for Format: Views Nivo Slider.
On the Settings pop-up, edit the Animation Speed value to slow down the slide transition.