- Refactor layout page in projects route
- Add timeline page for project
- Load sessions, deltas, and UI sessions for project
- Sort sessions, deltas, and UI sessions by timestamp
- Set earliest and latest delta timestamp for each UI session
- Adjust the header height for better UI responsiveness
- Improve layout for better user experience
[src/routes/+layout.svelte]
- Change the height of the header from `h-8` to `h-full max-h-8`
- Refactor Popover component to improve accessibility and usability
- Add `fadeAndZoomIn` transition
- Change `aria-orientation` to `vertical` and `z-` class from `999` to `[999]`
- Add `mouseup` event listener to close the popover
[src/lib/components/Popover/Popover.svelte]
- Remove `slide` transition and replace it with `fadeAndZoomIn`
- Change `expoOut` easing to `duration`
- Add `fadeAndZoomIn` transition
- Change `aria-orientation` to `vertical`
- Add `mouseup` event listener to close the popover
- Change `z-` class from `999` to `[999]`
- Change `bg-` class from `
- Adjust styling of Breadcrumbs component
- Increase max-height and add padding
[src/lib/components/Breadcrumbs.svelte]
- Change the max-height property of the breadcrumbs list from `280px` to `289px`
- Add a padding of `2px` to the breadcrumbs list
- Update project page to use `LayoutData` type
- Refactor `project` assignment to use `$:` syntax
[src/routes/projects/[projectId]/+page.svelte]
- Change the imported type from `PageData` to `LayoutData`
- Update the data assignment to use the `LayoutData` type
- Update the `project` assignment to use the `$:` syntax
- Replace IconHome and IconChevronRight with SVG icons
- Add Popover component for project title
- Add a link to the project and session page
- Change background color of the breadcrumb container
- Replace `IconArrowBigLeftFilled` and `IconArrowBigRightFilled` icons with SVG images
[src/lib/components/BackForwardButtons.svelte]
- Replace the `IconArrowBigLeftFilled` and `IconArrowBigRightFilled` icons with SVG images
[src/lib/components/Breadcrumbs.svelte]
- Replace IconHome and IconChevronRight with SVG icons
- Add Popover component for project title
- Add a link to the project and session page
- Change background color of the breadcrumb container
- Remove the `space-x-1` class from the breadcrumb container
- Update Popover component to include fading transition and updated styling
- Improve accessibility by updating aria labels, orientation, and class of element
[src/lib/components/Popover/Popover.svelte]
- Import `fade` and `expoOut` from `svelte/transition` and `svelte/easing` respectively
- Change the `slide` transition duration and easing
- Add a `fade` transition for the `out` transition
- Update the `aria` labels, orientation and class of the element
- Update the `style` of the element to include `bottom` and `left`
- Update Breadcrumbs and Popover components
- Make Breadcrumbs link clickable and Popover close on mouseup
[src/lib/components/Breadcrumbs.svelte]
- Change `Add repository...` to include `cursor-pointer` and wrap the text in an anchor tag
[src/lib/components/Popover/Popover.svelte]
- Change `on:click|stopPropagation` to `on:mouseup={() => (showPopover = false)}`
- Update Breadcrumbs component to use `a` elements
- Add link and `w-full` class to `a` element in Breadcrumbs component
[src/lib/components/Breadcrumbs.svelte]
- Change `div` to `a` element in Breadcrumbs component
- Add link to `a` element in Breadcrumbs component
- Add `w-full` class to `a` element in Breadcrumbs component
- Refactor UI sessions to display deltas in the timeline
- Add dateSessions variable to the layout page
- Update timeline page to use dateSessions instead of sessions
- Refactor formatDate on timeline page
- Update timeline end date to latest delta timestamp plus 60 seconds
[src/routes/projects/[projectId]/timeline/+page.svelte]
- Change the end date of the timeline from the latest delta timestamp to the latest delta timestamp plus 60 seconds
