You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
- To fork, hit the 'fork' button in the top right corner of this page on Github.
13
13
Now you should be on your own Github repository - you'll know this because your name should now be in the repo name at the top of the Github page.
14
14
- To clone, click the green button that says 'Code' on that page.
15
15
Now the code is on your own machine (this happened when you cloned), AND it's linked to your own Karma repository on Github (which was created when you forked).
16
16
17
+
# Instructions
18
+
## Level 1
17
19
-**Edit `index.html` and `style.css`** to re-create the design above.
18
20
- Remember, use semantic HTML to re-create the structure, and style each element using CSS to make a perfect copy of the above image.
19
21
- All the images and icons you need can be found in the `img` folder, and the font 'Roboto' is already loaded into the project.
20
-
22
+
-**Only create the Desktop design** for now.
23
+
24
+
## Level 2
25
+
- Go to the folder named 'level 2' and find the updated designs there.
26
+
- Add the new design block in your `index.html`
27
+
- Create a new page called `order.html` and re-create the design for the Order form page (find this in the Level 2 folder as well)
28
+
- For the Order page styles, you can keep using the same `style.css` file and add your Order page styles in there. Make sure the stylesheet is imported in the `<head>` of `order.html`.
29
+
- Connect the 2 pages by making the homepage's "Get Karma today" button navigate to the Order page.
30
+
31
+
## Level 3
32
+
Now let's make this website responsive!
33
+
- Use the techniques you've learned in class to make both the homepage and the Order page look good on mobile.
34
+
- You'll find the mobile designs inside the Level 3 folder.
35
+
- Use 1 or 2 breakpoints:
36
+
- 768px
37
+
38
+
### Submitting your work
21
39
-**Commit and push your code often** so you get into the habit and you avoid losing any code that you write if your machine crashes for example.
22
40
- Once you're ready to submit your homework for review, do a final push and **create a Pull Request**. If you're unsure how to do this, [have a look here](https://syllabus.codeyourfuture.io/git/cheatsheet/#i-want-to-send-my-code-to-volunteers-pushing).
0 commit comments