Development Work

Natours WordPress Theme

Jameel Evans  |  November 4, 2019

Share  

This project shows examples of advanced usage of CSS and SASS. This WordPress theme features navigation and popups animations made of pure CSS. In this project I utilize many examples of the lesser-known CSS declarations that helps create next generation websites, with feature queries for browsers that are behind on the innovation curve.

Workflow

For this project I used Local by Flywheel to quickly spin up a local WordPress environment, along with NPM and WPGulp. WPGulp helps with:

  • Sass to CSS conversion
  • JS concatenation
  • Watch files for changes

CSS

I used most of the newest CSS features to create an all CSS navigation and CSS popup that uses the super useful checkbox hack. On most of the elements you’ll notice a slant-like design that breaks up the boxy layout look. I even put to use background gradients on images, videos and headers to bring everything to life.

See live
Natours Project
Natours Wordpress Project

Sharing is caring  

Share Pin

Like it? Share It

X
Top