add a moving chevron to your href link
this adds a right chevron that moves when the link is active
demo:
* note: this may not show up in light mode as the chevron is white, so would need to change the color it
HTML
<a href="#!" class="chev-right">my link text</a>CSS
.chev-right {
position:relative;
}
.chev-right:hover:before {
right: -25px;
}
.chev-right:before {
position: absolute;
content: "";
color: #48bbe8;
top: 5px;
right: -20px;
transition: all 0.3s ease;
background-image: url("data:image/svg+xml,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' class='bi bi-chevron-right' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
height:16px;
width:16px;
color:#FFF;
}