Random Quote Machine - floating buttons

Random Quote Machine - floating buttons



So, I’ve made extra progress in my Random Quote Machine: https://zelite.github.io/Random-Quote-Machine/


I’m using the milligram framework: https://milligram.github.io/

I tried using the framework float classes to align the buttons. I want the twitter on the left and the others on the right.

However, after applying the classes, the order of the right buttons gets switched and all the buttons jump out of parent div.

I know this is somehow related to the floats and some messing around with overflows is needed.

Can someone point me in the right direction to fix this?


So, I created a div where I put the buttons inside and used the “clearfix” class on the parent div. This seemed to solve the jumping out button.

I finalized the project. Check it out a provide feedback please :slight_smile:

One thing that I have not implemented, but would like to do, is provide sort of a “toast notification” when the text is copied.

I’m using the https://clipboardjs.com/ library for the copy button. But Safari does not fully support this. That’s way they recomend:

That means you can show a tooltip saying Copied! when success event is called and Press Ctrl+C to copy when error event is called because the text is already selected.

Anyone have any suggestion how to implement this?