Skip to content

Instantly share code, notes, and snippets.

@Fischaela
Created November 20, 2017 12:44
Show Gist options
  • Save Fischaela/cc2858f27bcc52b28c18ce450ed203a6 to your computer and use it in GitHub Desktop.
Save Fischaela/cc2858f27bcc52b28c18ce450ed203a6 to your computer and use it in GitHub Desktop.
GirlsCourse 0.0.1 Retrospective

CSS

CSS Text Properties

  • font-style: italic;

CSS Layout Properties

  • transform-origin

CSS Misc

  • @import url("https://fonts.googleapis.com/css?family=Montserrat:300,400,400i,700");
  • $variable-name: variable-value(SCSS)
  • @media (min-width: 600px) {...}
  • Nested SCSS and CSS (see example 1)
  • element-selector, .class-selector, #id-selector, selector:focus

Examples

Example 1

// SCSS
parent-selector {
  ...
  
  child-selector {
    ...
  }
}

// CSS
parent-selector {...}
parent-selector child-selector {...}

Tasks

  • Play FlexboxFroggy
  • Play CSS Diner
  • Implement the dropdown menu from course 0.0.1 in website from course 0.0.0.
  • Style <section> from dropdown menu from course 0.0.1 with classes. Use five different class names in the HTML. Don't write styles (property: value) repeatebly.
  • Use media querys to style a mobile menu. Ask me for tips ;)

Links

Pens

Editors

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment