Advertisement
HTML/CSS

SASS and Compass for Web Designers: Finishing Off

by

The end is in sight! Our Creative Portfolio web page is almost finished. In these final two screencasts we'll look at cleaning up our SCSS file structure, styling the newsletter subscription form and the footer.


Newsletter Form

We'll start out by properly organizing the reusable elements within our SCSS file, after which we'll style the newsletter subscription form.

Alternatively Download the video, or subscribe to Webdesigntuts+ screencasts via YouTube!


The Footer

The final hurdle! We've already prepared a _footer.scss file, so let's crack on and style our footer.

Alternatively Download the video, or subscribe to Webdesigntuts+ screencasts via YouTube!


If you enjoyed this series and would like to refer back to the tutorials at any point, you can find all 8 videos featured as a playlist on YouTube. Two hours' learning - enjoy!

Related Posts
  • Web Design
    CMS
    Easier Tumblr Color Options With LESSTumblr 30 retina
    This really is the final video in what's been a massive series! In this lesson we'll see how LESS can improve our Tumblr theming workflow, specifically making color options more manageable.Read More…
  • Web Design
    CMS
    Introducing the Tumblr Static File Uploader and Theme GardenTumblr 29 retina
    In this bonus episode of Tumblr Theming 101, we'll take a look at two things. Firstly, we'll look at the static file uploader provided by Tumblr, which helps you manage any theme assets you need to host on Tumblr's CDN. Secondly, we'll look at the Tumblr theme marketplace; Theme Garden.Read More…
  • Web Design
    CMS
    Tumblr Appearance Options: Boolean OptionsTumblr 23 retina
    In this episode of Tumblr Theming 101 we'll add some Boolean Appearance Options to our theme. This will allow users, through checkboxes, to enable or disable certain features.Read More…
  • Web Design
    CMS
    Continuing With Our Tumblr Theme's CSSTumblr 15 retina
    In this part of our Tumblr theming series, we're going to continue with our theme's CSS. We'll be working directly on the live site, as a number of elements won't show up otherwise. Let's dig in!Read More…
  • Web Design
    CMS
    Styling Our Tumblr ThemeTumblr 13 retina
    Having finished the HTML markup for our theme, it's now time to begin playing with CSS. In this tutorial we'll gather everything we need to start styling; colors, typography details and so on.Read More…
  • Web Design
    CMS
    Creating the Tumblr Post Footer and Notes Tumblr 12 retina
    Let's kick off this tutorial by reviewing the Tumblr theme markup we've built already. Once that's done, we can continue by sorting out the footer and "Post Notes".Read More…