< -- CLICK AND DRAG BAR -- >

Responsive Design

You can drag the bar to resize the windows and test the responsiveness of the left window. This is intended to demonstrate responsive design using custom flexboxes. As you resize, you will see the elements in the left window realign based on the width. This is to simulate different resolutions, from high resolution monitors to low resolution smart phones.

<- click and drag.

Lights Out.

You can also play Lights Out! This is a game where your goal is to turn all of the lights off or on. Click the boxes to toggle the light on or off.

Dynamic Theme

These radio buttons change the color theme of the page dynamically.
This is accomplished using custom CSS variables and a JavaScript function.

This code is available on my Github.