Видео курса

  • Урок 1. 00:05:26
    What is this course about?
  • Урок 2. 00:00:33
    What is Sass anyway?
  • Урок 3. 00:01:31
    What software do you need?
  • Урок 4. 00:02:25
    Installing ruby (Windows users only)
  • Урок 5. 00:03:42
    Installing Sass
  • Урок 6. 00:03:36
    Watching folders to compile Sass to CSS
  • Урок 7. 00:02:31
    Output style options
  • Урок 8. 00:01:55
    What are source maps?
  • Урок 9. 00:02:23
    Command line alternatives (free and premium options)
  • Урок 10. 00:01:41
    Sass vs SCSS - two different ways of writting Sass
  • Урок 11. 00:03:00
    CSS vs Sass comments
  • Урок 12. 00:02:47
    Nesting selectors
  • Урок 13. 00:07:23
    SCSS vs Sass nesting
  • Урок 14. 00:02:13
    Nesting and the ampersand (&)
  • Урок 15. 00:03:49
    Nesting properties
  • Урок 16. 00:03:17
    Time for a challenge!
  • Урок 17. 00:02:26
    What are variables?
  • Урок 18. 00:02:26
    Variable inseption (variables inside variables)
  • Урок 19. 00:04:04
    Variables and the cascade
  • Урок 20. 00:02:18
    Naming variables
  • Урок 21. 00:00:58
    It's challenge time!
  • Урок 22. 00:06:01
    Introduction to Operators
  • Урок 23. 00:10:27
    Operators - a use case
  • Урок 24. 00:30:50
    Pricing Table - Intro
  • Урок 25. 00:03:19
    Writing the markup
  • Урок 26. 00:01:27
    Setting up the variables
  • Урок 27. 00:01:14
    Styling it up
  • Урок 28. 00:01:46
    An introduction to Extends
  • Урок 29. 00:03:38
    Placeholders
  • Урок 30. 00:03:07
    Don't forget about the other stuff you can do
  • Урок 31. 00:03:54
    Problems with extends - 1
  • Урок 32. 00:02:35
    Problems with extends - 2
  • Урок 33. 00:02:37
    Introduction to Mixins
  • Урок 34. 00:03:33
    Selectors inside mixins
  • Урок 35. 00:02:20
    Mixin arguments part one
  • Урок 36. 00:05:20
    Mixin arguments part two: optional arguments
  • Урок 37. 00:01:52
    Mixin arguments part three: more ways to work faster
  • Урок 38. 00:06:45
    Mixin arguments part four: keeping things in the right order
  • Урок 39. 00:05:05
    Mixin Challenge - Introduction
  • Урок 40. 00:02:45
    Introduction to Functions
  • Урок 41. 00:04:04
    Some of my favourite Sass functions
  • Урок 42. 00:08:12
    The Markup
  • Урок 43. 00:06:32
    Getting Sass set up and running
  • Урок 44. 00:05:52
    Settin' up the variables
  • Урок 45. 00:07:13
    Creating the mixins
  • Урок 46. 00:00:56
    Styling the typography
  • Урок 47. 00:01:18
    Styling the buttons
  • Урок 48. 00:00:54
    Finishing touches
  • Урок 49. 00:00:58
    Introduction to Lists
  • Урок 50. 00:02:37
    List lengths
  • Урок 51. 00:02:06
    The different types of lists
  • Урок 52. 00:00:36
    Accessing specific list items
  • Урок 53. 00:03:06
    The different ways to write lists
  • Урок 54. 00:03:40
    What is interpolation?
  • Урок 55. 00:01:37
    Interpolation and math
  • Урок 56. 00:01:47
    A quick refresher on Mixins
  • Урок 57. 00:04:46
    A look at variable arguments
  • Урок 58. 00:01:51
    Staying organized with variables
  • Урок 59. 00:02:37
    Variable arguments with @include
  • Урок 60. 00:04:52
    Variable arguments with @include - part two
  • Урок 61. 00:03:47
    Mixin challenge - part one.mp4
  • Урок 62. 00:01:52
    Mixin challenge - part two.mp4
  • Урок 63. 00:01:47
    A look at @content
  • Урок 64. 00:00:38
    Using @content to make awesome media query mixins
  • Урок 65. 00:01:02
    Adding a custom size media query
  • Урок 66. 00:01:09
    Intro to Sass @for
  • Урок 67. 00:01:51
    Using the $i variable
  • Урок 68. 00:01:57
    Using interpolation
  • Урок 69. 00:01:24
    Adding in some math
  • Урок 70. 00:00:49
    A little more math and a new variable
  • Урок 71. 00:03:27
    @for challenge
  • Урок 72. 00:03:27
    Introduction to @each
  • Урок 73. 00:03:49
    A more useful example of @each
  • Урок 74. 00:02:22
    Using nested lists
  • Урок 75. 00:00:55
    Intro to the @if directive
  • Урок 76. 00:02:36
    A more realistic example
  • Урок 77. 00:03:30
    @else directive intro
  • Урок 78. 00:02:55
    A more realistic look at @else
  • Урок 79. 00:03:30
    Using @if and @else to make a cool @mixin
  • Урок 80. 00:01:47
    Improving the mixin
  • Урок 81. 00:02:50
    Introduction to @if else
  • Урок 82. 00:03:13
    The if() function
  • Урок 83. 00:02:26
    Using the if function to write less code
  • Урок 84. 00:06:12
    Introduction to custom functions
  • Урок 85. 00:01:29
    Variable number of arguments
  • Урок 86. 00:01:05
    Dynamically set text color
  • Урок 87. 00:03:14
    Making the output look a little better
  • Урок 88. 00:00:24
    Refactor challenge.mp4
  • Урок 89. 00:04:00
    Refactor challenge - solution.mp4
  • Урок 90. 00:01:54
    Intro to debugging in Sass
  • Урок 91. 00:01:17
    The warning
  • Урок 92. 00:03:49
    Creating an error
  • Урок 93. 00:03:52
    Improving our error with interpolation
  • Урок 94. 00:02:09
    Introduction to Sass maps
  • Урок 95. 00:04:10
    How to access maps
  • Урок 96. 00:02:18
    Access maps made easier
  • Урок 97. 00:01:45
    Mapception
  • Урок 98. 00:04:26
    Accessing maps inside of other maps
  • Урок 99. 00:04:51
    Accessing maps inside of other maps made easier (plus a mini challenge)
  • Урок 100. 00:01:30
    Improving our media query mixin with a map
  • Урок 101. 00:06:29
    Maps and `@each`
  • Урок 102. 00:04:47
    Accessing maps with `@each` challenge
  • Урок 103. 00:02:08
    Accessing maps with `@each` solution
  • Урок 104. 00:02:55
    map-has-key()
  • Урок 105. 00:00:35
    A more realistic example of map-has-key()
  • Урок 106. 00:01:51
    Improving our media query mixin - challenge
  • Урок 107. 00:01:31
    The solution
  • Урок 108. 00:02:09
    A look at the type-of() function
  • Урок 109. 00:03:56
    Using type-of to improve our mq mixin even more! A challenge
  • Урок 110. 00:04:17
    And making it even better!
  • Урок 111. 00:03:23
    Introduction to partials
  • Урок 112. 00:09:05
    The 7-1 system and what I actually use (file organization)
  • Урок 113. 00:01:52
    Introduction to the project
  • Урок 114. 00:02:56
    A look at the files
  • Урок 115. 00:04:16
    The Markup - Navigation
  • Урок 116. 00:05:16
    The Markup - Home and About
  • Урок 117. 00:04:12
    The Markup - Facts and Meals
  • Урок 118. 00:04:02
    The Markup - Testimonial and Footer
  • Урок 119. 00:06:39
    First variables and mixins
  • Урок 120. 00:02:33
    Setting up a custom function
  • Урок 121. 00:01:47
    Adding an error to the function
  • Урок 122. 00:08:19
    Setting up the typography
  • Урок 123. 00:03:32
    Setting up the general layout
  • Урок 124. 00:04:32
    Styling the navigation
  • Урок 125. 00:03:09
    Styling up the home section layout
  • Урок 126. 00:04:49
    Stlying the About section, and some trouble shooting
  • Урок 127. 00:05:43
    Creating an underline pseudo element mixin
  • Урок 128. 00:07:41
    Styling the facts and meals sections
  • Урок 129. 00:10:40
    Styling the testimonial and footer, and fixing a mistake
  • Урок 130. 00:08:44
    Adding in a media query mixin
  • Урок 131. 00:08:55
    About section - large screen layout with grid
  • Урок 132. 00:07:38
    Creating a grid mixin
  • Урок 133. 00:02:29
    Fixing up the nav and about section
  • Урок 134. 00:04:08
    Fixing up the typography + closing thoughts

Материалы курса

К этому курсу прилагаются дополнительные материалы. Здесь вы можете скачать их.

Материалы к курсу