From 9bb63e02f572c64ecdd3627c755573b5468f4fac Mon Sep 17 00:00:00 2001 From: Musanna Galib <64589428+MusannaGalib@users.noreply.github.com> Date: Mon, 4 Dec 2023 02:29:58 +0600 Subject: [PATCH] Update 2_project.md --- _projects/2_project.md | 69 +----------------------------------------- 1 file changed, 1 insertion(+), 68 deletions(-) diff --git a/_projects/2_project.md b/_projects/2_project.md index 4f7823061b19..ae8670c29175 100644 --- a/_projects/2_project.md +++ b/_projects/2_project.md @@ -8,74 +8,7 @@ category: work giscus_comments: false --- -Every project has a beautiful feature showcase page. -It's easy to include images in a flexible 3-column grid format. -Make your photos 1/3, 2/3, or full width. -To give your project a background in the portfolio page, just add the img tag to the front matter like so: +* MECH 260 2023 Tutorial: ORCID - --- - layout: page - title: project - description: a project with a background image - img: /assets/img/12.jpg - --- -
-
- {% include figure.html path="assets/img/1.jpg" title="example image" class="img-fluid rounded z-depth-1" %} -
-
- {% include figure.html path="assets/img/3.jpg" title="example image" class="img-fluid rounded z-depth-1" %} -
-
- {% include figure.html path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %} -
-
-
- Caption photos easily. On the left, a road goes through a tunnel. Middle, leaves artistically fall in a hipster photoshoot. Right, in another hipster photoshoot, a lumberjack grasps a handful of pine needles. -
-
-
- {% include figure.html path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %} -
-
-
- This image can also have a caption. It's like magic. -
- -You can also put regular text between your rows of images. -Say you wanted to write a little bit about your project before you posted the rest of the images. -You describe how you toiled, sweated, *bled* for your project, and then... you reveal its glory in the next row of images. - - -
-
- {% include figure.html path="assets/img/6.jpg" title="example image" class="img-fluid rounded z-depth-1" %} -
-
- {% include figure.html path="assets/img/11.jpg" title="example image" class="img-fluid rounded z-depth-1" %} -
-
-
- You can also have artistically styled 2/3 + 1/3 images, like these. -
- - -The code is simple. -Just wrap your images with `
` and place them inside `
` (read more about the Bootstrap Grid system). -To make images responsive, add `img-fluid` class to each; for rounded corners and shadows use `rounded` and `z-depth-1` classes. -Here's the code for the last row of images above: - -{% raw %} -```html -
-
- {% include figure.html path="assets/img/6.jpg" title="example image" class="img-fluid rounded z-depth-1" %} -
-
- {% include figure.html path="assets/img/11.jpg" title="example image" class="img-fluid rounded z-depth-1" %} -
-
-``` -{% endraw %}