Materialize CSS From Scratch With 5 Projects

Video description

Master HTML 5 and the Materialize CSS Framework by Building 5 Real-World Responsive Material Design-Based Themes

About This Video

CSS and JavaScript components, Animations/transitions.
Build 5 beautiful and completely responsive, real-world themes from absolute scratch.

In Detail

The author has created a completely custom HTML learning environment for the first few sections of this course. Each lecture has an html page associated with …

Materialize CSS From Scratch With 5 Projects

Video description

Master HTML 5 and the Materialize CSS Framework by Building 5 Real-World Responsive Material Design-Based Themes

About This Video

CSS and JavaScript components, Animations/transitions.
Build 5 beautiful and completely responsive, real-world themes from absolute scratch.

In Detail

The author has created a completely custom HTML learning environment for the first few sections of this course. Each lecture has an html page associated with it and has a start state. As we move along through the lectures, you code along with him learning all that Materialize offers including CSS components, utilities, JS widgets and more. 5 Real Projects/Themes. We will create the following projects from scratch..Travelville - A travel agency website/theme (Carousel slider, autocomplete, scrolling navigation)Quazzu - Cloud hosting theme (SideNav, cards, CSS overlays)Madmin - Interactive admin theme (Working todo list, charts, preloader, counter script)BizLand - Business consultation theme with a full screen landing page (Scrollfire, Google maps integration)Galappear - Graphic design portfolio (Uses Sass and scrollfire for scroll animations)

Downloading the example code for this course: You can download the example code files for all Packt video courses you have purchased from your account at http://www.PacktPub.com. If you purchased this course elsewhere, you can visit http://www.PacktPub.com/support and register to have the files e-mailed directly to you.

Publisher resources

Download Example Code

Chapter 1 : Intro & Getting Started

Welcome To the Course 00:06:05

What Is Materialize & Why Use It? 00:04:33

Environment Setup 00:09:17

Materialize Sandbox Setup 00:06:52

Chapter 2 : CSS Components - Part 1

Typography & Alignment 00:10:10

Text & Background Colors 00:08:20

Buttons & Icons 00:10:39

Floating & Fixed Action Buttons 00:13:04

Navbar 00:15:33

Collections & Badges 00:12:31

The Grid System 00:11:22

Chapter 3 : CSS Components - Part 2

Cards 00:21:30

Breadcrumb & Footer 00:08:58

Basic Form & Input Controls 00:14:40

Fancy Form & Input Controls 00:14:32

Tables & Media 00:05:43

Chips & Pagination 00:10:05

Preloaders 00:04:40

Chapter 4 : Interactive Components - Part 1

Carousel 00:08:04

Collapsible 00:05:32

Feature Discovery 00:06:52

Dialogs (Toasts & Tooltips) 00:09:01

Material Box & Slider 00:07:02

Modals 00:09:01

Chapter 5 : Interactive Components - Part 2

Parallax 00:02:58

Side Navigation 00:08:42

PushPin 00:08:56

ScrollSpy Nav Scrolling 00:04:32

Tabs 00:07:37

Chapter 6 : Project 1 – Travelville

Project Intro 00:02:15

Navbar & Sidenav 00:09:04

Image Slider 00:07:25

Search & Icon Boxes 00:11:15

Popular Places & Gallery 00:14:27

Contact Section & ScrollSpy 00:12:07

Chapter 7 : Project 2 – Quazzu

Project Intro 00:02:43

Navbar & Showcase 00:15:11

Boxes, About & Overlay 00:14:05

Podcast Section & Testimonials Carousel 00:14:25

Footer & Login Modal 00:08:06

Solutions Page 00:15:44

Signup Page 00:09:40

Chapter 8 : Project 3 – Madmin

Project Intro 00:03:39

Navbar & Sidenav 00:12:15

Stat Counters & Preloader 00:15:11

Display Chart & Recent Comments 00:12:40