Skip to content

Instantly share code, notes, and snippets.

@Meshiest
Last active November 16, 2017 20:59
Show Gist options
  • Save Meshiest/f70d58c8d9298eeb3e39d4464f19391a to your computer and use it in GitHub Desktop.
Save Meshiest/f70d58c8d9298eeb3e39d4464f19391a to your computer and use it in GitHub Desktop.

Homework 2 Rubric

An automatic grader for this assignment can be found here. This grader does not account for penalties.

Specification

  • The document should render properly on Chrome
  • 10pt Base grade:
    • 5pt - The student submits any form of css
    • 5pt - Valid CSS is submitted
  • Make sure all penalties (even if they're not counted), are mentioned. This could involve writing "Extra Semicolon" or "Invalid Syntax" many times.

Penalties

  • 0pt overall - Empty CSS document or a missing submission
  • -20pt - Submitting multiple files
    • +10pt - If a student submits HTML with proper HTML media queries (<link media="max-width: 400px" ...> etc). This penalty will be reduced because while it is a valid practice, the student did not follow the instructions.

    • If a student does do this, a solution may be to wrap the files like so: (or move the media="..." queries to @media CSS queries

      @media screen and (max-width: 400px) {
        /* contents of mobile css */
      }
      @media screen and (min-width: 400px) and (max-width: 800px) {
        /* contents of tablet css */
      }
      @media screen and (min-width: 800px) {
        /* contents of desktop css */
      }
      
    • Please leave students a kind message saying as many of the following that apply:

      • "A single CSS file submission was specified by the instructions"
      • "The instructions specified not to edit the HTML"
  • -5pt each, -15pt max - Forgetting unit (px) on non-zero values (Spec), Syntax errors, Properties missing values (color:, or margin:), missing parentheses, extra semicolons, random non-css symbols, etc. (the grader will show you errors). Make sure you try to correct the error so you can determine how many errors there are. Please leave a note for each error!

60% Mandatory Requirements

  • 20pt - At least two @media queries using min-width/max-width
  • 6pt - Profile background-color
  • 6pt - All h1,h2,h3 not bold
  • 8pt - header border-bottom or text-decoration: underline
  • 10pt - width and height of large profile on desktop=300px, tablet=150px
  • 10pt - text-align: center of headers on tablet/mobile

30% Loose Requirements: (Only 3 of 6 needed, 10pt each)

  • line-height not normal on mobile
  • image opacity not 1 on offline
  • border-radius: 50% on mobile and tablet images
  • display: flex with align-items: center or justify-content: center
  • flex-wrap or flex-flow
  • text-align: justify
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment