English Learning Interface - Copy this Html, Tailwind Component to your project

Build an application for learning English, mainly practicing listening skills. We will have an input to enter the youtube url. After entering the youtube url, we will have a list of transcripts taken from youtube. In each item, we will have the title as transcript and below is the time of the transcript, in each transcript item there will be an additional function to bookmark and check which transcripts have been completed. When the user clicks on a word of a transcript, a tooltip will appear, this tooltip will show the definition of that word and the pronunciation in US or UK accent, we will also have a bookmark function for each word. Next to the transcript list, we will have a youtube video, below the youtube video, we have a text input box (this text box is used to enter words that match the transcript), and there are also buttons reply, pause, resume, skip. Integrate light/dark mode. Add one more function, when the user clicks on a transcript, a tooltip will appear, this tooltip will show the definition of that word and the pronunciation in US or UK accent