Update headings

gdscbvppune · Sep 24, 2022 · db3e237 · db3e237
1 parent 21ab63b
commit db3e237
Show file tree

Hide file tree

Showing 7 changed files with 48 additions and 58 deletions.
diff --git a/bird-app/step0/Instructions.md b/bird-app/step0/Instructions.md
@@ -1,7 +1,5 @@
-# Getting Started
-
 Hello there, welcome to the first step of the making bird app social media project. The aim for this project is to build a simple CRUD app for manipulating social media posts but only with localStorage knowledge.
 
-# Build a landing page for the social media
+## Build a landing page for the social media
 
 This step involes you building a landing page for the social media website. Take a look inside the task checklist on the left to see all the steps you have to complete to pass this step.
diff --git a/bird-app/step1/Instructions.md b/bird-app/step1/Instructions.md
@@ -1,5 +1,3 @@
-# Build a register page at /register
-
 In this step, we will aim to build a register page on /register path. You will have to work with `localStorage` API to add the registered user to `localStorage` once they register successfully.
 
 ## Pointers to note

diff --git a/bird-app/step2/Instructions.md b/bird-app/step2/Instructions.md
@@ -1,5 +1,3 @@
-# Build a login page at /login
-
 In this step, the main goal is to build the /login page to extend functionality of the /register page. Your users should be able to login with the same credentials.
 
 Check the challenges tabs to know what all you should be implementing. All the best!
diff --git a/bird-app/step3/Instructions.md b/bird-app/step3/Instructions.md
@@ -1,5 +1,3 @@
-# Building dashboard
-
 The dashboard should load feed from all the users. This feed should be also stored in localStorage as feed as the localStorage key, and the following structure as the value (feel free to change it to add more features):
 
 ```json

diff --git a/multiverse-html5-photo-gallery/step0/Instructions.md b/multiverse-html5-photo-gallery/step0/Instructions.md
@@ -1,5 +1,3 @@
-# Getting Started
-
 Hello there, welcome to the first step of the HTML5 Photo Gallery tutorial. In this project, we are going to build a photo gallery using an existing set of images. You can find these images in the `assets` folder. We will be using only `HTML5` and `CSS3` to build this project.
 
 Go through the `README.md` file to get a better idea of the project. You can view the final design of the project in the `design` folder. It contains the screenshots of the final output in desktop and mobile viewports.

diff --git a/multiverse-html5-photo-gallery/step1/Instructions.md b/multiverse-html5-photo-gallery/step1/Instructions.md
@@ -2,54 +2,54 @@ In this step our goal is to set up the basic boilerplate code and link the `styl
 
 Before jumping into the code of the project, make sure that you understand the basic structure of the HTML5 document and what the boilerplate code does:
 
-- `<!DOCTYPE html>` tag: Tells the browser that we are using HTML5 and not any previous versions of HTML.
-- `<html>` tag: Tells the browser that the content inside the `<html>` tag is, well, HTML!
-- `<head>` tag: Tells the browser that the content inside the `<head>` tag is metadata about the HTML document.
-- `<body>` tag: Tells the browser that the content inside the `<body>` tag is the content to be displayed on the browser page.
-- `<link>` tag: Tells the browser that we want to link an external file with the HTML document, and process it.
+-   `<!DOCTYPE html>` tag: Tells the browser that we are using HTML5 and not any previous versions of HTML.
+-   `<html>` tag: Tells the browser that the content inside the `<html>` tag is, well, HTML!
+-   `<head>` tag: Tells the browser that the content inside the `<head>` tag is metadata about the HTML document.
+-   `<body>` tag: Tells the browser that the content inside the `<body>` tag is the content to be displayed on the browser page.
+-   `<link>` tag: Tells the browser that we want to link an external file with the HTML document, and process it.
 
 It is advised that you go though the [HTML & CSS Fundamentals course](https://codedamn.com/learn/html-css) for a comprehensive and detailed understanding of these tags.
 
-# What will you do?
+## What will you do?
 
 In this step you are tasked to create a new `style.css` file and link it with the existing `index.html` document.
 
 1. Add a new `<div> </div>` tag inside the `<body>` element. Give the `<div>` element an id `gallery-container`, this element will act as a container and will have all the gallery images inside this element.
 
 2. Create and link the `style.css` file with the `index.html` file. Add the following line of code inside the `<head>` tag of the `index.html` file, using the `<link>` tag.
 
-   ```html
-   <link rel="stylesheet" href="style.css" />
-   ```
+    ```html
+    <link rel="stylesheet" href="style.css" />
+    ```
 
-   Here the `rel` attribute specifies the relationship between the HTML document and the linked file. The `href` attribute specifies the path to the linked file.
+    Here the `rel` attribute specifies the relationship between the HTML document and the linked file. The `href` attribute specifies the path to the linked file.
 
 3. Add some styling to the document. Set `margin` and `padding` to `0`, and `box-sizing` to `border-box`, for all the elements of the HTML Document.
 
-   ```css
-   * {
-     margin: 0;
-     padding: 0;
-     box-sizing: border-box;
-   }
-   ```
+    ```css
+    * {
+    	margin: 0;
+    	padding: 0;
+    	box-sizing: border-box;
+    }
+    ```
 
-   `margin`, `padding` and `box-sizing` are the CSS properties that are used to set the spacing between the elements of the HTML document.
+    `margin`, `padding` and `box-sizing` are the CSS properties that are used to set the spacing between the elements of the HTML document.
 
-   By settings these values globally to all the elements, it removes the different pre-defined margins and paddings of the elements (which are set by browsers), making it easier to style.
+    By settings these values globally to all the elements, it removes the different pre-defined margins and paddings of the elements (which are set by browsers), making it easier to style.
 
 4. Set the `background-color` of the `body` element to `#242629`.
 
-   ```css
-   body {
-     background-color: #242629;
-   }
-   ```
+    ```css
+    body {
+    	background-color: #242629;
+    }
+    ```
 
-   The six digit value is written in hexadecimal (base 16) and here
+    The six digit value is written in hexadecimal (base 16) and here
 
-   - the first two digits `24` represent the intensity of red
-   - the next two digits `26` represent the intensity of Green
-   - the last two digits `29` represent the intensity of Blue
+    - the first two digits `24` represent the intensity of red
+    - the next two digits `26` represent the intensity of Green
+    - the last two digits `29` represent the intensity of Blue
 
 Now that we setup the basic boilerplate code and linked the `style.css` file with the `index.html` file, let's move on to the next step and create the HTML.
diff --git a/multiverse-html5-photo-gallery/step2/Instructions.md b/multiverse-html5-photo-gallery/step2/Instructions.md
@@ -2,41 +2,41 @@ In this step the main goal is to build the HTML structure for the gallery projec
 
 Here the `>` means the child of the parent, the `+` means the sibling of the previous element:
 
-- `article` is the parent
-- `img` & `span` are the siblings
+-   `article` is the parent
+-   `img` & `span` are the siblings
 
-# What will you do?
+## What will you do?
 
 1. Create the `<article>` tag inside the `div#gallery-container` element:
 
-   ```html
-   <article></article>
-   ```
+    ```html
+    <article></article>
+    ```
 
 2. Add `<image>` and `<span>` tags to `<article>` element:
 
-   ```html
-   <article class="img-container">
-     <img class="galley-image" src="" />
-     <span class="title"></span>
-   </article>
-   ```
+    ```html
+    <article class="img-container">
+    	<img class="galley-image" src="" />
+    	<span class="title"></span>
+    </article>
+    ```
 
-   This represents the HTML structure for 1 image. Do this for 11 other images as well.
+    This represents the HTML structure for 1 image. Do this for 11 other images as well.
 
 3. Set the `src` attribute of each individual `<img>`:
 
-   ```html
-   <img src="assets/01.jpg" />
-   ```
+    ```html
+    <img src="assets/01.jpg" />
+    ```
 
-   Make sure to set the `src` attribute refers to all the images in the assets folder.
+    Make sure to set the `src` attribute refers to all the images in the assets folder.
 
 4. Adding `lorem` text to the span tag. `lorem` refers to random placeholder text. You can add custom text if you want.
 
-   The text we are adding to the span tag represents the title of the image. So we'll restrict the word length to three.
+    The text we are adding to the span tag represents the title of the image. So we'll restrict the word length to three.
 
-   `Emmet` is available on Codedamn Playgrounds, you can directly write `lorem3` and hit space to generate three words inside the `<span>` tag. Or you can choose to write any three words of your choice for all the span tags.
+    `Emmet` is available on Codedamn Playgrounds, you can directly write `lorem3` and hit space to generate three words inside the `<span>` tag. Or you can choose to write any three words of your choice for all the span tags.
 
 ## For Geeks