day8 / re-com

A ClojureScript library of reusable components for Reagent
https://re-com.day8.com.au
MIT License
796 stars 147 forks source link

Accessibility Question - using larger zmdi icons #186

Open lazylazylazy opened 5 years ago

lazylazylazy commented 5 years ago

Is it possible to use larger material design icons?

I'm currently using re-com to prototype a small application for older users that sometimes prefer larger icons. However using something like :md-icon-name "zmdi-icon-name zmdi-hc-5x" either has no effect, or, if added as a class moves the icon outside of the button. Regular and Larger icon buttons use the same size icon, what do I need to add/edit to utilise the larger icons?

Many Thanks

MawiraIke commented 2 years ago

Currently re-com supports using the :size parameter to change the size. The supported options are :larger, :regular and :smaller. The default size is :regular. i.e msedge_kwQDwLo2VV Using a class name beside the name like "zmdi-plus zmdi-hc-5x" makes the icon change it's size but the size of the button is capped by re-com's rc-md-icon-button default style i.e msedge_Evwf3jZOIe You can override the button's default size by passing style or class as follows

[md-icon-button :src (at)
 :md-icon-name "zmdi-plus zmdi-hc-2x"
 :emphasise?   true
 :tooltip      "This button has :emphasise? set to true"
 :on-click     #()
 :style        {:height "50px"}]