[UI] Service Provider creates new workshop "Опис" section

[OlenaYakubova]

Environment: Windows 11 64 bit, Google Chrome 114.0.5735.199 Reproducible: always.

Preconditions

1. Follow the link https://oos.dmytrominochkin.cloud/#/
2. Log into OoS website as SP (e.g. 'email'="anna.didiaieva.95@ukr.net", 'Password'="Cdby?rf95")
3. Select «Мої гуртки» in the menu bar at the top right corner.
4. Click on the “Додати гурток” button and fill in all mandatory fields in each section.

Steps to reproduce

1. Go to "Опис" section
2. Verify all required UI elements of the "Опис" section according to Mock-up (https://www.figma.com/file/YRYP4zAAchOyYMgdoeP782/MoE-%7C-Dev-Team?type=design&node-id=0-1&mode=design&t=oJ2890ASQZoFOnVM-0)
3. Please select the items indicated on the screenshots from Actual result (e.g. 'Підпорядкування' - "МОН"; 'Назва напрямку' - "Дослідницько-експериментальний"; 'Назва профілю/наукового відділення' - "Наукове відділення літературознавства...")

Actual result 1 . The name doesn't scroll horizontally (2 and 3 level). Please select the items indicated in the pictures:

2. There is a dot at the end of the name "Гольф". Wrong order:
3. Wrong order:
4. A space is needed between "015." and "Водне поло":
5. Spelling mistakes. Should be "спорту":
6. Should be: "баяна, акордеона":
   7. Should be:"барабана, кларнета, ксилофона, саксофона":
   8. Should be: "батика", "паперопластики":
   9. Should be:"Черлідинг":

Expected result All required UI elements of the "Опис" section are according to Mock-up, no spelling mistakes

User story and test case links

[Test case] (https://jira.softserve.academy/browse/OS-350)

Labels to be added "Bug", Priority ("Medium"), Severity ("Low"), Type ("UI")

[SergeyGSA]

Referring to the first point of the issue, our team decided to add a hint instead of a horizontal scrollbar. Because the horizontal scrollbar is not user-friendly. When the user hovers over the selected item appears a hint near the cursor.