SuperHi FM

Search:

Catalog Cart About Sign in

Advanced CSS + Javascript

Good Times

Chapter 04

Good Times

Links + downloads

Chapter resources

Chapter URL

Videos

Lesson 01

Project introduction

Lesson 02

Adding our initial HTML

Lesson 03

Adding our custom fonts

Lesson 04

Styling up our intro section

Lesson 05

About em and rem units

Lesson 06

Applying stroke to our heading text

Lesson 07

Styling up our call to action button

Lesson 08

An introduction to basscss

Lesson 09

Responsive 12 column grids using basscss

Lesson 10

Adding our about section and heading variation

Lesson 11

Using variables in our CSS

Lesson 12

Responsive spacing using helper classes

Lesson 13

Styling our speakers section and blockquote

Lesson 14

Showing and revealing our fixed header on scroll

Lesson 15

Horizontal scrolling elements and custom scrollbars

Lesson 16

Vertical text using CSS writing-mode

Lesson 17

Styling our register section using CSS grid

Lesson 18

Adding our final images section and footer

Lesson 19

Parallax tilt hover effect for our images

Lesson 20

Fading images in on scroll

Lesson 21

Revealing our payment form using transforms

Lesson 22

An introduction to Stripe for payments

Lesson 23

A breakdown of Stripe’s payment flow

Lesson 24

Using Stripe’s code for our checkout form

Lesson 25

Sending the order to our server using fetch

Lesson 26

Creating messages for successful payments

Lesson 27

Adding an animated loading state to our form

Lesson 28

Adding styles to make our page fully responsive

Lesson 29

Project summary

SuperHi FM

Want some ambient music in the background? Play our radio station!

Super Shapes

Back: Chapter 03

Super Shapes

Feeling stuck?

Don’t worry, we are here to help you with:

Speedy help from one of our team members
Detailed, relevant solutions
Direct access to peer support through Discord!

Remember, there’s no such thing as a silly question, so don’t hesitate to reach out, we love hearing from you!

© 2024 SuperHi, Inc.

Learn

All courses Code Design Project management SuperHi Editor

Company

About Student work SuperHi for Business NEW Careers Newsletter

Support

Return policy Terms of use Discrimination policy Code of conduct Contact us

Good Times is a one day design event in Melbourne. The site uses responsive 12 column grid layouts, typographic effects, scrolling animations, parallax tilts, horizontal scrolling and Stripe for accepting payments from event attendees.

Private notes

A place for you to post notes about anything on this page. Only you can view your notes.

Sign in to save notes