Super Flexbox

About this Project

TLDR;
Super Flexbox is a small glossary of the CSS Flexbox layout method, inspired by "you know which game" and mostly by my personal need of learning more about CSS Layouts.

The project started as series of small experiments and grew into a library of the flexbox properties with examples and animations, at the begining I wanted to learn more about layout possibilities the flexbox properties had offer, suddenly it became a full HTML, CSS, JS project.

The functionality relies on DOM manipulation, and using objects and arrays to store the properties for the containers and the blocks.

I stablished a time limit of two weeks to make it work, since I had made the little tests before starting a whole project emerything started smoothly, the first part of this lexicon was to apply my fisrt process on the parent container, everything went south after I tried to use the same system on the CSS porperties for the children, I had to rewrite funcitons and started to repeat myself, something against the old wirtten law, but I found it easier for me and decided to keep going since the time to develope this was thight.

You can check my code at codeberg.org, I'm a newby so if you want to have a laugh is fine, but if you have some contructive criticism I will really appreciate that.

I took the Zero to Mastery JavaScript Web Projects, so this is my graduation project.



Resources used to made this Project

Flexbox

The basic Concepts from Mozilla.
The best explanation of Flexbox online CSS-Tricks.
CSS Flexbox Crash Courseon the FCC YT channel.

Sound Effects

Author Deva from Open Game Art,
or in Soundcloud noshades.

Icons

Material Design Icons.