Skip to content

Commit 2eafd55

Browse files
authored
Merge pull request CodeYourFuture#322 from CodeYourFuture/syllabus/instructions-clarifications
Adds tasks and designs, and splits these into folders
2 parents dbb181b + 4354b0b commit 2eafd55

15 files changed

+68
-8
lines changed

HOW_TO_MARK.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ https://github.com/CodeYourFuture/JavaScript-Core-1-Coursework-Week1-Solution
2424

2525
### 1.2) Using the Solutions Repo
2626

27-
In these repositories you will find solutions to each weeks coursework. These solutions are example answers and will not be the exact solution that students give. You should use it to inform your feedback of the coursework.
27+
In these repositories you will find solutions to each week's coursework. These solutions are example answers and will not be the exact solution that students give. You should use it to inform your feedback of the coursework.
2828

2929
Additionally, you will find marking guides in these places
3030

@@ -48,7 +48,7 @@ https://syllabus.codeyourfuture.io/guides/marking-guide
4848

4949
This guide should be used when you see a student making a common mistake so instead of writing out a reply you can send them to the a good resource.
5050

51-
For example, if the student is leaving in lots of comments out code you could write
51+
For example, if the student is leaving in lots of commented out code you could write
5252

5353
```txt
5454
Great work so far!

Karma - mobile design.png

-225 KB
Binary file not shown.

README.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,24 +2,24 @@
22

33
The aim of this exercise is to create a page that looks just like this one:
44

5+
![Karma desktop design](./homepage-desktop.png)
56

6-
![alt text](./Karma%20-%20desktop%20design.png "Karma desktop design")
7-
8-
9-
### Tasks
7+
### Set up
108

119
- **Fork and clone** this repo.
1210
- To fork, hit the 'fork' button in the top right corner of this page on Github.
1311
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.
1412
- To clone, click the green button that says 'Code' on that page.
1513
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).
1614

17-
- Before you start coding, **create a new branch** following this format `your-class-name/your-name`, for example: `london-class-7/adam-smith`. Your branch name should be all lowercase, with no spaces.
15+
# Instructions
1816

1917
- **Edit `index.html` and `style.css`** to re-create the design above.
2018
- Remember, use semantic HTML to re-create the structure, and style each element using CSS to make a perfect copy of the above image.
2119
- 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+
- **Only create the desktop design** for now.
2221

23-
- **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+
### Submitting your work
23+
- **Commit and push your code often** (for example every half an hour)so you get into the habit and you avoid losing any code that you write if your machine crashes for example.
2424
- 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).
2525

-1.29 MB
Binary file not shown.

level-2/README.md

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
# karma-clone
2+
## Level 2
3+
The aim of this exercise is to:
4+
- add a new section to the homepage
5+
- create a new 'store' page with an order form
6+
- connect the 2 pages together by adding navigation
7+
8+
# Instructions
9+
10+
- You'll find the designs inside the 'level-2' folder.
11+
- Add the new section in your `index.html`
12+
- Create a new page called `store.html` and re-create the design for the store page (the design is `level-2/store-desktop.png`)
13+
- For the store page styles, you can keep using the same `style.css` file and add your store page styles in there.
14+
You could also create a specific `store.css` file, but make sure you don't repeat the CSS already in `style.css`!
15+
- Connect the 2 pages by:
16+
- making the homepage's "Get Karma today" button navigate to the store page.
17+
- making the header navigation "Store" link navigate to the store page, and the "Meet Karma" link navigate to the homepage.
18+
19+
### Stretch goal
20+
21+
**Custom radio buttons and checkbox**
22+
23+
The 2 radio buttons and the checkbox in the store page design are tricky to style and will require you to do a little research. Focus on the rest of the form and layout first, and leave these until the end as a stretch goal.
24+
25+
## Submitting your work
26+
- Remember to **commit and push your code often**
27+
- 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).
28+
**Note:** If you've added your level 2 code to the same branch, then it will just update your previous Pull Request and you won't need a new PR.
29+
30+
## Designs
31+
32+
![Homepage extended design](./homepage-desktop-extended.png)
33+
34+
![Store design](./store-desktop.png)
35+

level-2/checkmark.svg

Lines changed: 3 additions & 0 deletions
Loading
1.29 MB
Loading

level-2/store-desktop.png

779 KB
Loading

0 commit comments

Comments
 (0)