1. How to Create a Complete DNN Theme Using CSS Grid and Flexbox - Introduction, Media Queries, Typography
Jul 01, 2017
We've learned a lot about cutting edge DNN theme development over the past 6 months or so, so in this tutorial, we put our skills into practice and develop a complete, modern DNN theme using elements from several previous tutorials.
We begin the tutorial by "responsifying" the CSS grid theme we developed in the last tutorial. We will then augment this theme with the responsive flexbox menu system we developed back in October, and then implement the good practice typography that we learned about in August.
To top this off we will be adding the vital DNN skin objects such as the site logo, the login/logout links and we will then perform any required tweaks to prepare the final product.
This video contains:
- Theme plan
- How to "responsify" the CSS Grid theme
- Adding CSS media queries
- Applying the CSS grid to only tablets and above
- Importing the typography and menu CSS from the flexbox theme