Style the paragraphs
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid blanditiis consequuntur dolorem, ex hic in magni rem ullam! Deleniti obcaecati tempora veritatis voluptates voluptatibus. Consequuntur nostrum sapiente voluptatibus! In, unde!
Adipisci aspernatur cumque distinctio error numquam officiis, perferendis provident quaerat ratione suscipit? Asperiores atque autem blanditiis deserunt doloremque dolorum, eaque eum eveniet, exercitationem fugit id ipsum laborum laudantium maiores mollitia necessitatibus nemo odit pariatur repellendus soluta suscipit temporibus veniam. Fuga, repellendus, voluptatibus.
Ab error eum quas rem soluta? Accusamus accusantium amet consequuntur cumque delectus doloribus eaque enim excepturi facere fugiat labore maiores nemo non obcaecati porro quae reprehenderit, vitae voluptatibus. Esse ipsum sequi voluptates?
- Add the necessary event listeners to the input elements to style the paragraphs in
div#paragraphs
- If you select a font, the resulting font-family (with fallback font) should be applied to these paragraphs
(Make sure that after reloading the page, the correct font-family, i.e. Arial, is applied without adding additional CSS) - When selecting a font size, it should be applied to the paragraphs
- When ticking the checkbox 'Bold', the paragraphs are shown in bold. Likewise for the checkbox 'Italic'.
- When you click the button 'Dark theme', the background color of the paragraphs (and the enclosing
div#paragraphs
) becomes#111
, and the color becomes#f8f8f8
. The text on the button changes to 'Light theme'.
When the button (now with text 'Light theme') is clicked again, the background color and color of these paragraphs are reset to the original values, i.e.,#f8f8f8
and#111
respectively. The text on the button is changed back to 'Dark theme'.
- If you select a font, the resulting font-family (with fallback font) should be applied to these paragraphs