Add and style the "References" view on the homepage

[AliHassan7]

• To begin working on this task, create a branch based off of the currently checked out branch using the following convention: proj-me-initials-50
• For your convenience, an image of the design has been added to the bottom of this issue.
• If you haven't already, create at least 2 pieces of content of the "Reference" content type. You can use random titles, descriptions, images, etc.
• This view (References) should already be created and can be found at Structure » Views.
• Edit this view and add a Block display to it. Add the Body field to this views block display. Rearrange the fields so that they are in the following order: Organization, Body, Title, and Reference Image. Under "PAGER", make it so that this view only displays 2 items. Apply this only to the block display and Save the view.
• To place this view block on the homepage, you will need to use the Panels module.
• Navigate to Structure » Pages. Edit the "Home" page. Click on the "Home" variant on the right side and then click on "Content".
• Click on "+ Add new block" and find and select the "References" block. Choose to not display the title and click on "Add block".
• Update and Save and visit your home page. You should see the References view on the homepage!
• You should now style this view according to the design.
  • The color of the text of the body field is #868686.
  • The piece of content on the left side should have a right border of 1px solid #c0bebe.
• You might notice that the design has a quotation mark above each piece of content (❝). Let us edit our view so that each piece of content can get these quotation marks. Click on the "Content: Organization" field and click on "Rewrite results". Choose "Override the output of this field with custom text". In the text field, type the following: ❝<br>{{ field_organization }}. This will make it so that before each Organization's name, the ❝ will be present. You can then apply colors and increase the font of these quotation marks using Sass so that they closely match the design. The color of the quotation marks on the left side of the design is #bf5829. The color of the ones on the right is #ffae3f.
• You can make the images have a "circle" effect by adding a border-radius: 50% to them. Experiment with this until it matches the design.
• Style the rest of this view according to the design and apply SASS as necessary.
• Upon completion of the task, please commit and push all your work to your fork of the proj-me repository. Additionally, export all your configuration by using the drush cex command while inside vagrant and in /var/www/dev-1/proj-me/web. This configuration will also need to be committed and pushed. Remember to create a pull request.
• Leave a comment on this issue when you:
  • Start working on this task
  • Have a question about this task
  • Complete this task (please comment on this task with a link to your pull request).

[AliHassan7]

[ByronGary]

finished #79