Development

iOS meditation shortcut Scriptable Todoist widget that selects a top task from a filter Using Google API (gapi) in Chrome Extensions Automatically prepend issue tag to commit message Linting only changed files with Gulp.js Website visual diffing Simple MobX Simple Redux base64 encoder for node-sass Easy REST API data validation using Django Forms

Navbar on pure CSS

Elements in navigation bar can have 2 states:

  • Inactive
  • Active

There are 3 different arrows between these states (there are 4 but we’re using only 3):

  • inactive-inactive navigation-bar-1
  • active-inactive navigation-bar-2
  • active-active navigation-bar-3

In order not to use z-index I set elements in opposite order.