Make color of first option in selection form, and clickable font awesome

HTML-CSS
1

Hello,

can you tell me how to change color of first option in selection to grey? (Like above),
and how to make clickable icon to show all options? Because when It doesn’t work correctly.

This is my second day of 100days coding challenge :open_mouth:

Link: https://codepen.io/direct96/pen/zJbpPZ

2

There are probably a few ways of doing it, here is one.

select {
  color: $form-text-color;
}

option:not(:first-child) {
  color: initial;
}

You would think there was a standard programmatic way of opening a select, but apparently, that is not the case (solutions are inconsistent at best).

You can try this CSS hack, where you overlap the select element on top of everything

.form__select {
  -webkit-appearance: none;
  width: 100%;
  padding: 1.2rem 7rem;
  background-color: #f6f6f6;
  border: 0px;
  font-family: inherit;
  font-size: 1.4rem;
  position: absolute;
  background: transparent;
}