Add code editor projects

raspberrypilearning · Nov 28, 2024 · eaa5d0a · eaa5d0a
1 parent a225041
commit eaa5d0a
Show file tree

Hide file tree

Showing 13 changed files with 99 additions and 84 deletions.
diff --git a/en/code/wanted-complete/index.html b/en/code/wanted-complete/index.html
@@ -0,0 +1,20 @@
+<html>
+
+<head>
+  <link rel="stylesheet" href="style.css">
+</head>
+
+<body>
+
+  <div>
+    <h1>Wanted!</h1>
+    <h3>Have you seen this robot?</h3>
+    <img src="robot.png">
+    <p>Description: Height: 30cm, Colour: purple and orange, Arms: 4</p>
+    <p>If you have any information, please contact 6207 332 2310</p>
+    <h3>Reward: £1,000,000</h3>
+  </div>
+
+</body>
+
+</html>
diff --git a/en/code/wanted-complete/project_config.yml b/en/code/wanted-complete/project_config.yml
@@ -0,0 +1,3 @@
+name: 'Wanted Complete'
+identifier: 'wanted-complete'
+type: 'html'
diff --git a/en/code/wanted-complete/robot.png b/en/code/wanted-complete/robot.png
diff --git a/en/code/wanted-complete/style.css 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;
+}
diff --git a/en/code/wanted-starter/boy.png b/en/code/wanted-starter/boy.png
diff --git a/en/code/wanted-starter/dinosaur.png b/en/code/wanted-starter/dinosaur.png
diff --git a/en/code/wanted-starter/girl.png b/en/code/wanted-starter/girl.png
diff --git a/en/code/wanted-starter/index.html b/en/code/wanted-starter/index.html
@@ -0,0 +1,19 @@
+<html>
+
+<head>
+  <link rel="stylesheet" href="style.css">
+</head>
+
+<body>
+
+  <div>
+    <h1>Wanted!</h1>
+    <h3>Have you seen this robot?</h3>
+    <img src="robot.png">
+    <p>Description: Height: 30cm, Colour: purple and orange, Arms: 4</p>
+    <p>If you have any information, please contact 6207 332 2310</p>
+  </div>
+
+</body>
+
+</html>
diff --git a/en/code/wanted-starter/project_config.yml b/en/code/wanted-starter/project_config.yml
@@ -0,0 +1,3 @@
+name: 'Wanted Starter'
+identifier: 'wanted-starter'
+type: 'html'
diff --git a/en/code/wanted-starter/robot.png b/en/code/wanted-starter/robot.png
diff --git a/en/code/wanted-starter/style.css b/en/code/wanted-starter/style.css
@@ -0,0 +1,6 @@
+div {
+  text-align: center;
+  overflow: hidden;
+  border: 2px solid black;
+  width: 300px;
+}
diff --git 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
@@ -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 ---
 
+<iframe src="https://editor.raspberrypi.org/en/embed/viewer/wanted-complete" width="600" height="600" frameborder="0" marginwidth="0" marginheight="0" allowfullscreen> </iframe>
 
---- 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 ---