It's a fun game to learn and practice CSS selectors.
To play, visit flukeout.github.io or cssdiner.com
Aug 25,2016
- Added Twitter, Facebook and Email share actions
- Tracking clicks with GA Events
- Made the level menu and editor area scroll independently
- Using custom jQuery scroll library
Aug 18,2016
- Started using
cssdiner.comto redirect toflukeout.github.io
Aug 12,2016
- Added checkmarks to completed levels in level menu and header
Aug 4,2016
- Began tracking progress and correct guesses with GA Events
Please file issues and PRs in the css-diner repo.
Here's the repo structure, it's a bit confusing...
- Currently, all of the working code (including issues, PRs and in-progress branches) is hosted in the css-diner repo
- The lastest version of the code is on the
developbranch
- The lastest version of the code is on the
- The live version is published from the flukeout.github.io repo
- Live version lives on the
masterbranch
- Live version lives on the
This is more of a note to myself in case I forget, to deploy the latest version, I'll have to push to the master branch on the flukeout.github.io repo from the latest develop branch.
Potential Features & Improvements
- Lots of people have trouble with level 19, how should I address this?
- Create levels for attribute selectors
- Will probably add attributes like
customer='bob'and place a little nametag by those dishes - Also some great ideas in this issue
- Will probably add attributes like
- Figure out how to tackle the
.tableelement- Including it in the selector string makes the selectors invalid, but it shouldn't
- Investigate the order of stacked oranges in the markup, some users think it's counter intuitive
- Block attempts to use comma between selectors
- Only pass each level if that level's selector is used
- Make it easier to navigate between levels
- Number all of the levels in the menu
- Add UI to Tweet about finishing all of the levels
- Add additional challenges per Selector
- Some repetition per level would be good