Here is a v-exapansion-panel of Vueitfy.3:
> <VExpansionPanels >
> <VExpansionPanel
> expand-icon="material-symbols:arrow-circle-down-outline-rounded"
> collapse-icon="material-symbols:arrow-circle-up-outline-rounded"
> v-for="faq in faqs"
> :key="faq.question"
> :title="faq.question"
> :text="faq.answer"
>
> />
> </VExpansionPanels>
I want the color of exapnd icons when hovering occurs, should have a new one. how can do this?
CodePudding user response：
Some simple CSS should do it. Select the expansion panel component then deep select the icon and apply color if hovering:
.v-expansion-panel >>> .v-expansion-panel-title__icon:hover {
color: red;
}