Как создать кривую поверх панели приложения при выборе ⇐ CSS

[Anonymous]

Я создаю одну панель мобильного приложения. Я пытаюсь создать кривую выше, когда пользователь выбирает ее. Я создал еще один элемент кривой. но это отдельный div. так что не получилось. Я пробовал, но не знаю, как это реализовать. Может ли кто-нибудь помочь мне с этим? Мне нужна кривая выше, когда пользователь нажимает на элемент


Вот код:
import { AiFillBell } from "react-icons/ai";
import { GoHomeFill } from "react-icons/go";
import { IoMdSettings } from "react-icons/io";
import { FaUser } from "react-icons/fa";
import { useState } from "react";

export default function App() {
const [selectedItem, setSelectedItem] = useState("home");

const menuItems = [
{
name: "notification",
icon: ,
},
{
name: "home",
icon: ,
},
{
name: "settings",
icon: ,
},
{
name: "user",
icon: ,
},
];

return (


{menuItems.map((item, index) => (
setSelectedItem(item.name)}
style={{
opacity: selectedItem === item.name ? 1 : 0.2,
cursor: "pointer",
color: "#fff",
}}
>
{item.icon}

))}


);
}


Подробнее здесь: https://stackoverflow.com/questions/787 ... n-selected