Does anyone know if it’s possible/how to make these action buttons all the same size?
Hi Christina,
I’m not sure you can do anything about those as they grow to the size of the text, can you tell me what you controlling with those buttons? It may be you can use another component type which is more amenable to being the same size to achieve the same outcome.
Best
Helen
Hi Helen, I’m using the action button to: (1) Show hidden articles, (2) Navigate to article, and (3) Hide articles - like a menu. But this menu falls after a topic introduction. I’ll DM a preview.
1 Like
Hi Christina,
So one easy cheaty way to make it work is to go to your Article Style, then “Component”, then change the Component Background Colour to match your buttons.
I have done it here, but have made the colour slightly different so you can see the difference. Obviously, make it the same colour as your buttons! You may also want to make it so that JUST the button text changes colour on hover and not the background, otherwise there will be an obvious difference.
ONE CAVEAT - If you have used the same article style elsewhere in this course or other courses using the theme, then the components in it will also have pink backgrounds, so to negate this, you can make an exact copy of your article style then just chage that one thing and call it something like PINK BUTTONS and then just use that when youi need to expand buttons like this? Let me know if you need help applying styles from other article styles to a new one.
Helen
2 Likes
You superstar, thanks Helen! Buttons are all standardised and just text changes on hover. Now if there’s also a way to center align the text I’ll go buy a lottery ticket 
1 Like
Horizontally or vertically?! 
OK! Having a good look into that now for you.
My first thought would be to make the images of the checboxes smaller but let’s see if we can change the alignment of the text first…
1 Like
Sorry to report no lottery ticket this time (although don’t let it stop you buying one if you feel lucky!)
So it seems that the addition of an image in the button forces the text to be vertically top aligned, it is only with an icon instead that the alignment is centred.
Due to the development of New Evolve it’s unlikely this will be fixed (also because of the alignment of other people’s buttons being thrown off if the code was changed).
So I offer apologies and a few alternatives!
- Make your images smaller to make the difference less pronounced
- Make your text bigger in a way that it goes over 2 lines if possible (Style > Button > Text Appearance - I found 18px works if you add something to the Policies and Procedures title, or 19 works if not. Also play with line height and font weight to make it look as nice as possible)
- Switch your image for the empty checkbox icon (or any other icon) - sadly it loses the checked state (which is great, btw!)
Ah ha, I suspected it might be linked to the image! Thanks for checking, now I know it’s not possible and why I can accept it. It’s a design annoyance but I can live with it! I’ll play around with your suggestions around image sizes to see if it improves visually.
1 Like