Project 2

  1. panel one
  2. panel one

    reflection: I had a lot of fun going through bootstrap tools with this panel. I ended up using the carousel for the masthead to show different aspects of Edgar Degas' work along with different exmaples in the background of each. I also used the card bootstrap tool to show three famous artworks at the bottom. I used the bootstrap grid throughout my html for this as well, along with responsive images. I also used a media query for panel one to make sure it resized well in smaller and different proportions. For my button, I used a bootstrap toggle to add more information to the about section under "learn more". My use of css mostly consisted of adding a Google font and customizing the spacing a little better.

  3. panel two
  4. panel two

    reflection: This panel was pretty simple and easy; I picked a bootstrap template (https://startbootstrap.com/theme/grayscale) from startbootstrap.com and added my images from panel one into it. I also changed the masthead using the technique from the rubric. There wasn't much else I added to this one. It was hard to resist changing the css for this one.

  5. panel three
  6. panel three

    reflection: For this panel, I customized the css to my liking, adding Playfair Display and changing up colors and spacing. I also deleted parts of the bootstrap template that I felt I didn't need and replaced them with other bootstrap tools. I changed the masthead to be a carousel slideshow like from panel one with slight tweaks (no arrows, it moves on it's own) and the card gallery near the bottom of the page that was also modeled off of panel one. I also added popovers to the gallery to show extra information on-click. I had to add another js line at the bottom of the index.html, which I was really confused about at first; I thought I had to play around in the js file, but I figured it out. I liked the card gallery, but I struggled so much with making it look good. I ended up grouping the similarly ratioed images on each row to make it look less bad.