Hey there! Brian Dys here — I’m a visual and visceral person at heart. Ever since my mom lent me her old film camera, I fell in love with photography. All of my creative musings were exemplified by my second brain, the computer. This journey is a topsy-turvy ride of creative pursuits — from electronic music to UX design.
I enjoy every dull and wild moments of it — yes, this life of mine that I share with a woman named Jaycelle and a boy named Bryce. Take a peek into my kaleidoscope!
What benefit do we get in having a globalclass located higher in the DOM tree? It lets us control different parts of the UI depending on the site’s or app’s UI Type or UI State.
It is important to reserve the highest element you can put a class on – which is html (for pertinent class names), thus, the second highest element we could attach a class attribute to is body.
Going back to our example, we would use the following UI State class to define the state of the search form:
The body class, in words, translates to “The UI State of the Search Form is Active”.
Now, whenever the search form is active, you can already manipulate the main navigation based on that state.