diff --git a/en/code/wanted-complete/index.html b/en/code/wanted-complete/index.html new file mode 100644 index 0000000..00b4c2a --- /dev/null +++ b/en/code/wanted-complete/index.html @@ -0,0 +1,20 @@ + + + + + + + + +
+

Wanted!

+

Have you seen this robot?

+ +

Description: Height: 30cm, Colour: purple and orange, Arms: 4

+

If you have any information, please contact 6207 332 2310

+

Reward: £1,000,000

+
+ + + + \ No newline at end of file diff --git a/en/code/wanted-complete/project_config.yml b/en/code/wanted-complete/project_config.yml new file mode 100644 index 0000000..aba321b --- /dev/null +++ b/en/code/wanted-complete/project_config.yml @@ -0,0 +1,3 @@ +name: 'Wanted Complete' +identifier: 'wanted-complete' +type: 'html' \ No newline at end of file diff --git a/en/code/wanted-complete/robot.png b/en/code/wanted-complete/robot.png new file mode 100644 index 0000000..e1627fe Binary files /dev/null and b/en/code/wanted-complete/robot.png differ diff --git a/en/code/wanted-complete/style.css b/en/code/wanted-complete/style.css new file mode 100644 index 0000000..6955c16 --- /dev/null +++ b/en/code/wanted-complete/style.css @@ -0,0 +1,38 @@ +body { + background: lightblue; +} + +div { + text-align: center; + overflow: hidden; + border: 5px dotted red; + width: 300px; + background: yellow; +} + +img { + width: 100px; + border: 2px solid black; + padding: 10px; + background: white; + margin: 10px; +} + +h1 { + font-family: Impact; + font-size: 50pt; + text-decoration: underline overline; + margin: 10px; +} + +h3 { + font-family: Impact; + font-size: 18pt; + margin: 10px; +} + +p { + font-family: Arial; + font-size: 12pt; + margin: 20px; +} \ No newline at end of file diff --git a/en/code/wanted-starter/boy.png b/en/code/wanted-starter/boy.png new file mode 100644 index 0000000..f1a2c35 Binary files /dev/null and b/en/code/wanted-starter/boy.png differ diff --git a/en/code/wanted-starter/dinosaur.png b/en/code/wanted-starter/dinosaur.png new file mode 100644 index 0000000..a54d55d Binary files /dev/null and b/en/code/wanted-starter/dinosaur.png differ diff --git a/en/code/wanted-starter/girl.png b/en/code/wanted-starter/girl.png new file mode 100644 index 0000000..142992e Binary files /dev/null and b/en/code/wanted-starter/girl.png differ diff --git a/en/code/wanted-starter/index.html b/en/code/wanted-starter/index.html new file mode 100644 index 0000000..444de30 --- /dev/null +++ b/en/code/wanted-starter/index.html @@ -0,0 +1,19 @@ + + + + + + + + +
+

Wanted!

+

Have you seen this robot?

+ +

Description: Height: 30cm, Colour: purple and orange, Arms: 4

+

If you have any information, please contact 6207 332 2310

+
+ + + + \ No newline at end of file diff --git a/en/code/wanted-starter/project_config.yml b/en/code/wanted-starter/project_config.yml new file mode 100644 index 0000000..28323e3 --- /dev/null +++ b/en/code/wanted-starter/project_config.yml @@ -0,0 +1,3 @@ +name: 'Wanted Starter' +identifier: 'wanted-starter' +type: 'html' \ No newline at end of file diff --git a/en/code/wanted-starter/robot.png b/en/code/wanted-starter/robot.png new file mode 100644 index 0000000..e1627fe Binary files /dev/null and b/en/code/wanted-starter/robot.png differ diff --git a/en/code/wanted-starter/style.css b/en/code/wanted-starter/style.css new file mode 100644 index 0000000..944205f --- /dev/null +++ b/en/code/wanted-starter/style.css @@ -0,0 +1,6 @@ +div { + text-align: center; + overflow: hidden; + border: 2px solid black; + width: 300px; +} \ No newline at end of file diff --git a/en/meta.yml b/en/meta.yml index 99a94af..e32f9fb 100644 --- a/en/meta.yml +++ b/en/meta.yml @@ -8,16 +8,15 @@ copyedit: false curriculum: 1, design-1, programming-0, phys-comp-0, manufacture-0, community-0 title: Wanted! description: Learn how to make your own poster. -original_url: https://codeclubprojects.org/en-GB/webdev/wanted interests: art technologies: html-css-javascript site_areas: projects hardware: '' software: html-css-javascript version: 3.0.1 -last_tested: 2017-01-01 +last_tested: 2024-11-28 steps: -- title: Introduction +- title: What you will make - title: Styling your poster - title: 'Challenge: Improving your poster' - title: Styling images diff --git a/en/step_1.md b/en/step_1.md index 51560b5..3ed4c3f 100644 --- a/en/step_1.md +++ b/en/step_1.md @@ -1,90 +1,17 @@ -## Introduction +## What you will make -In this project, you'll learn how to make your own poster. +You'll learn how to make your own poster. -![screenshot](images/wanted-final.png) +--- print-only --- +![A wanted poster for a robot](images/wanted-final.png) -### Additional information for club leaders +--- /print-only --- -If you need to print this project, please use the [Printer friendly version](https://projects.raspberrypi.org/en/projects/wanted/print). +--- no-print --- + ---- collapse --- ---- -title: Club leader notes ---- +--- /no-print --- -## Introduction: -In this project, children will have an opportunity to write their own CSS. They will also edit and write CSS properties and selectors to make their own poster. -## Online Resources - -We recommend using [trinket](https://trinket.io/) to write HTML & CSS online. This project contains the following trinkets: - -+ ['Wanted' starting point -- jumpto.cc/web-wanted](http://jumpto.cc/web-wanted) - -Children can also make use of this blank trinket [(jumpto.cc/html-blank)](http://jumpto.cc/html-blank) to write their own HTML & CSS, or alternatively they can use this template trinket [(jumpto.cc/html-template)](http://jumpto.cc/html-template). - -There is also a trinket containing a sample solution to the challenges: - -+ ['Wanted' Finished -- trinket.io/html/ebeb56398a](https://trinket.io/html/ebeb56398a) - -## Offline Resources -This project can be [completed offline](https://rpf.io/html-offline) if preferred. You can access the project resources by clicking the 'Project Materials' link for this project. This link contains a 'Project Resources' section, which includes resources that children will need to complete this project offline. Make sure that each child has access to a copy of these resources. This section includes the following files: - -+ template/index.html -+ template/style.css -+ wanted/index.html -+ wanted/style.css -+ wanted/robot.png - -You can also find a completed version of this project's challenges in the 'Club leader resources' section, which contains: - -+ wanted-finished/index.html -+ wanted-finished/style.css -+ wanted-finished/robot.png - -(All of the resources above are also downloadable as project and volunteer `.zip` files.) - -## Learning Objectives -+ This project gives children the opportunity to write their own CSS to style a webpage. - -This project covers elements from the following strands of the [Raspberry Pi Digital Making Curriculum](http://rpf.io/curriculum): - -+ [Design basic 2D and 3D assets](https://www.raspberrypi.org/curriculum/design/creator). - -## Challenges -+ "Improving your poster" - adding new CSS properties to the `div` selector; -+ "Improving your image" - adding new CSS properties to the `img` selector; -+ "Make your poster awesome" - adding new CSS properties and new `h3` and `p` selectors; -+ "Advertise an event" - Writing and editing HTML and CSS code. - - ---- /collapse --- - - ---- collapse --- ---- -title: Project materials ---- - -## Project resources -* [.zip file containing all project resources](https://rpf.io/p/en/wanted-go) -* [Online Trinket containing all 'Wanted!' project resources](http://jumpto.cc/web-wanted) -* [Online Trinket template](http://jumpto.cc/trinket-template) -* [Online blank Trinket](http://jumpto.cc/trinket-blank) -* [template/index.html](resources/template-index.html) -* [template/style.css](resources/template-style.css) -* [wanted/index.html](resources/wanted-index.html) -* [wanted/style.css](resources/wanted-style.css) -* [wanted/robot.png](resources/wanted-robot.png) - -## Club leader resources -* [.zip file containing all completed project resources](https://rpf.io/p/en/wanted-go) -* [Online completed Trinket project](https://trinket.io/html/ebeb56398a) -* [wanted-finished/index.html](resources/wanted-finished-index.html) -* [wanted-finished/style.css](resources/wanted-finished-style.css) -* [twanted-finished/robot.png](resources/twanted-finished-robot.png) - ---- /collapse ---