By: Codie Whitaker
-
Random Quote Fetching: Fetches quotes from a freeCodeCamp REST API, and randomly selects from retrieved quotes.
-
Random Color Changing: Randomly selects a color from predefined list upon quote change and makes it the theme color.
-
Animated Lips: I created a set of lips in Adobe Illustrator which I imported into the HTML and manipulated with CSS. The mouth "opens" and "closes" each time the button is hit for a new quote.
-
Hidden Quote Box: In order to see the quote, you have to click a bouncing quotation mark inside of the mouth. I did this to make the mouth more easily visible. When the quote box becomes visible, the lips fade slightly. To make the quote box hidden again, you just click anywhere in the box..
-
Dynamic Share Links: Within the toggle-able quote box are two social media links for sharing the current quote. The href value for these are set each time a new quote is set, so it will share the correct quote. (I hope)