Fix Project Profile page bug: Technologies not wrapping

[ExperimentsInHonesty]

Overview

We need the Technologies line to wrap the same way that the Languages does, so that it does not collide with the Description text

Details

All the project pages are controlled by one layout. Do not edit the code for a single project, but rather the layout page.

Action Items

• Review the Civic Tech Jobs project page
• Review the 311-data project page
• Figure out the problem
  • Since id="technologies" is being used by both the Languages/Technologies dropdown and the technologies field on the detail project profile pages, the SCSS #technologies was being applied to all elements with id="technologies" throughout the website.
• Fix the problem
  • Temporary fix: Revert the pr causing it
  • Actual fix: Change the #technologies SCSS to ul.dropdown#technologies.
    • Note: This was merged into the branch: feature-tech-dropdown because it was realized that the dropdown was static and could only support a certain number of menu items, which Jessica will write an issue for to address. Also, changes were made to fix an issue with gaps caused by having 4 columns and we want approval from design to see if that's okay.
• Submit PR

Resources/Instructions

Example image from Civic Tech Jobs page

Pages that have longer Technologies categories

• https://www.hackforla.org/projects/civic-tech-jobs
• https://www.hackforla.org/projects/311-data
• https://www.hackforla.org/projects/civic-tech-index
• https://www.hackforla.org/projects/food-oasis

[github-actions]

Hi @ExperimentsInHonesty.

Please don't forget to add the proper labels to this issue. Currently, the labels for the following are missing:
Size, Role, Feature

To add a label, take a look at Github's documentation here.

Also, don't forget to remove the "missing labels" afterwards.
To remove a label, the process is similar to adding a label, but you select a currently added label to remove it.

After the proper labels are added, the merge team will review the issue and add a "Ready for Milestone" label once it is ready for prioritization.

Additional Resources:

• Wiki: How to create issues
• Wiki: How to read and interpret labels