Anzu Dev Hub

Going forward with the CSS course. Animations are not just "aesthetic bling", they also have practical uses, such as CSS loaders. We tend to take a "loading wheel" for granted, but more often than not it is actually custom tailored and adds value to the user experience. With a thematic animated loader, the user is more likely to sit back and wait while the site loads rather than being confused and unsure if something is happening (Did I click? Is it working? Did it freeze? Better click again! etc) It was demonstrated with this animated crystal here: See the Pen Crystal Loader | Pure CSS by Mike Mangialardi ( @mikemang ) on CodePen . After the video there was "homework" to create your own thematic 100% css loader. Naturally, I looked into cats. Here is my result, using 2 scaling animations. It kind of looks like it's nodding, right? See the Pen Kitty Loader | Pure CSS by Anzelika ( @anzuj ) on CodePen . Another cool thing thi...

Trying to wrap my mind around "half completed things" and decided to go ahead with the tiny CSS image course I purchased a while back. A bit of fun coding is sometimes needed to get back into the groove! It gave the basics quite quickly, so I managed to do my own penguin after following the koala tutorial: See the Pen Penguin by Anzelika ( @anzuj ) on CodePen . What was really interesting though: Pug preprocessor. Essentially it means being able to write code much faster, so that instead of this HTML: <div class= "box" > <div class= "head" > <div class= "eyes" > </div> </div> </div> we can have this: .box .head .eyes Quite neat, right. It does mean however that you have to be very precise, since nesting depends on two spaces or a tab. For smaller projects such as these CSS images I guess it...