diff --git a/starter-code/images/backpack.svg b/images/backpack.svg similarity index 100% rename from starter-code/images/backpack.svg rename to images/backpack.svg diff --git a/starter-code/images/bear-logo.png b/images/bear-logo.png similarity index 100% rename from starter-code/images/bear-logo.png rename to images/bear-logo.png diff --git a/starter-code/images/binoculars.svg b/images/binoculars.svg similarity index 100% rename from starter-code/images/binoculars.svg rename to images/binoculars.svg diff --git a/starter-code/images/buildings-and-billboard.png b/images/buildings-and-billboard.png similarity index 100% rename from starter-code/images/buildings-and-billboard.png rename to images/buildings-and-billboard.png diff --git a/starter-code/images/city-scape.svg b/images/city-scape.svg similarity index 100% rename from starter-code/images/city-scape.svg rename to images/city-scape.svg diff --git a/starter-code/images/collaboration.svg b/images/collaboration.svg similarity index 100% rename from starter-code/images/collaboration.svg rename to images/collaboration.svg diff --git a/starter-code/images/forklift.svg b/images/forklift.svg similarity index 100% rename from starter-code/images/forklift.svg rename to images/forklift.svg diff --git a/starter-code/images/mountain-climbing-bears.svg b/images/mountain-climbing-bears.svg similarity index 100% rename from starter-code/images/mountain-climbing-bears.svg rename to images/mountain-climbing-bears.svg diff --git a/starter-code/images/mountain-flag.svg b/images/mountain-flag.svg similarity index 100% rename from starter-code/images/mountain-flag.svg rename to images/mountain-flag.svg diff --git a/starter-code/images/npm-logo.png b/images/npm-logo.png similarity index 100% rename from starter-code/images/npm-logo.png rename to images/npm-logo.png diff --git a/starter-code/images/red-car.png b/images/red-car.png similarity index 100% rename from starter-code/images/red-car.png rename to images/red-car.png diff --git a/index.html b/index.html new file mode 100644 index 0000000..0a46b3c --- /dev/null +++ b/index.html @@ -0,0 +1,80 @@ +3 + + + + + + + npm + + + + +
+
+ + + + +
+
+

Build amazing things

+ +

npm is the package manager fo Javascript an the world's largest software registry. Discover packages of reusable code -- and assemble them in powerful new ways

+ + Sign up for npm +
+ +
+ +
+ +

npm Orgs is powerful collaboration -- for free

+ + Sign uo for Orgs +

or, Learn more about Orgs

+
+ +
+

What is npm?

+

Use npm to install, share, and distribute code; manage dependencies in your projets; and share ¬ receive feedback with others.

+ Install npm +
+ +
+

What is npm?

+

The npm registry almost half a million packages of free, reusable -- the largest software registry in the world.

+
+ +

Find

+

Libraries like JQuery, Bootstrap, React, and Angular, and components from frameworks such as Ember.

+
+
+ +

Discover

+

Packages for mobile, IoT, front end, back end, robotics... everything you need to start building amazing things.

+
+
+ +

Buid

+

Assemble packages like building blocks to quickly develop awesome new projects.

+
+
+ + diff --git a/readme.md b/readme.md deleted file mode 100644 index dd3d308..0000000 --- a/readme.md +++ /dev/null @@ -1,281 +0,0 @@ -![Ironhack Logo](https://i.imgur.com/1QgrNNw.png) - -# Module Exercise: HTML & CSS - -## Learning Goals - -In this exercise you will be able to apply all the concepts you've just learned, such as: - -- using different HTML tags, -- structuring your HTML page with **block elements**, and -- adding content to your HTML page with **inline elements**. - -## Getting started - -- Click on the button "Clone or download" and a window will appear: -![](https://s3-eu-west-1.amazonaws.com/ih-materials/uploads/upload_e1d537a0f12e005606bc1fae2277bb70.jpeg) -- **Click the button "Download as zip"** - - -## Instructions - -### Introduction - -In this exercise, you will clone one of the previous versions of the landing page of **NPM website**. NPM is a package manager for NodeJS, and you will be using it heavily throughout this course. - -![](https://s3-eu-west-1.amazonaws.com/ih-materials/uploads/upload_66957e0bffb5e59c6b1713c489323168.png) - - -You can see the larger version of this picture [here](https://s3-eu-west-1.amazonaws.com/ih-materials/uploads/upload_66957e0bffb5e59c6b1713c489323168.png). If you're struggling to see the details, feel free to zoom in to 200%. -Just by taking a look to this picture, we can conclude that we will have to apply quite a few styles on our web page: different background colors, font weight (bold, normal), and elements being positioned very deliberately with CSS. - -We will devide our work into two parts: -- part I - create web page with no styles, just add HTML elements -- part II - add styles and make it perfect 😌 - -So let's get started! - - -### Starter Code - -The `starter-code` folder contains an `index.html` file with the main structure already created. We provided the `images` folder with all the images necessary to successfully finish the exercise. - -### Part I - the pure HTML (no styles applied) - -This is kind of our goal 🙃: -![](https://s3-eu-west-1.amazonaws.com/ih-materials/uploads/upload_fb961b15cf7fcd5867273a3e77d3a0cf.png) - -The most difficult part of this exercise is deciding how to structure the page and picking the correct *semantic* tags for the job. Picking the right semantic tags will make your job easier in the next exercise when it comes time to styling. - -Our recommendation is to try to keep it simple. Try to identify the different sections, and add `id`'s or `classes` to each `
`, `
`, `