Documentation Index Fetch the complete documentation index at: https://mintlify.com/liltrendi/gitlantis/llms.txt
Use this file to discover all available pages before exploring further.
Overview Gitlantis displays your current location in the file system using breadcrumb trails in the top-left corner of the screen. The breadcrumbs show both your current Git branch and your file path.
Breadcrumb Components The breadcrumb system consists of two main parts:
Branch Breadcrumb
Path Breadcrumb
Displays the current Git branch with a clickable picker: < span className = "text-md cursor-pointer select-none rounded-br-md rounded-tl-lg rounded-tr-lg border-b border-l border-l-4 border-r border-t border-[#2d302f] bg-[#f2bc07] px-2 py-[1px] text-black" > < span className = "pr-1 font-semibold" > Branch: </ span > < span > { current || "none found" } </ span > </ span >
The branch name appears in yellow (#f2bc07) with a bold “Branch:” label. Source : src/browser/components/ui/breadcrumbs/branch/index.tsx:29-36Shows your current location in the file system hierarchy: < nav className = { containerClasses } > < span className = "mr-1 text-gray-300" > Exploring: </ span > { baseFolderChildren . map (( segment , index ) => { const fullPath = segments . slice ( 0 , baseFolderIndex + index + 1 ) . join ( "/" ); const isLastItem = index === baseFolderChildren . length - 1 ; return ( < span key = { `route- ${ index } - ${ fullPath } ` } > { index > 0 && < span className = "mx-1 text-gray-500" > { ">" } </ span > } < button onClick = { () => ! isLastItem && setCurrentPath ( "/" + fullPath ) } > { segment } </ button > </ span > ); }) } </ nav >
Source : src/browser/components/ui/breadcrumbs/path/index.tsx:43-69Path Navigation The breadcrumb path allows you to quickly navigate up the directory tree:
Segment Interaction < button onMouseDown = { ( e ) => e . preventDefault () } onClick = { () => { if ( ! isLastItem ) setCurrentPath ( "/" + fullPath ); } } className = { ` ${ segmentButtonClasses } ${ isLastItem ? "" : "hover:text-[#f2bc07] hover:underline" } ` } title = { segment } > { segment } </ button >
Each path segment (except the current location) is clickable and will navigate to that folder when clicked.
Source : src/browser/components/ui/breadcrumbs/path/index.tsx:57-66Path Parsing The breadcrumb intelligently parses your current path:
const segments = currentPath . split ( "/" ). filter ( Boolean ); const baseFolderSegments = baseFolder . split ( "/" ). filter ( Boolean ); const baseFolderIndex = segments . findIndex ( ( _ , i ) => segments . slice ( 0 , i + 1 ). join ( "/" ) === baseFolderSegments . join ( "/" ) ); if ( baseFolderIndex === - 1 ) return null ; const baseFolderChildren = segments . slice ( baseFolderIndex );
This logic:
Splits the path into segments
Finds where your base folder starts
Only shows the relevant portion of the path
Source : src/browser/components/ui/breadcrumbs/path/index.tsx:31-40Root Directory Handling When at the root directory, the breadcrumb shows a simplified view:
if ( currentPath === ROOT_DIRECTORY_KEY ) { if ( rootLabel . length > 0 ) { return ( < nav className = { containerClasses } > < span className = "flex items-center text-gray-300" > < span className = "mr-1" > Exploring: </ span > < span className = "text-white" > { rootLabel } </ span > </ span > </ nav > ); } return null ; }
Source : src/browser/components/ui/breadcrumbs/path/index.tsx:17-29Styling and Layout The breadcrumbs use a dark theme that contrasts with the ocean world:
Container Styling const containerClasses = "flex flex-wrap max-w-[50vw] break-words rounded-bl-lg rounded-br-lg rounded-tr-lg bg-[#2d302f] px-2 py-1 gap-y-1" ;
Background : Dark gray (#2d302f)Max width : 50% of viewport widthText wrapping : Enabled for long pathsRounded corners : Bottom-left, bottom-right, top-right
Source : src/browser/components/ui/breadcrumbs/path/index.tsx:11-12Segment Styling const segmentButtonClasses = "max-w-[10rem] truncate text-white text-sm focus:outline-none" ;
Max width : 10rem per segmentTruncation : Long folder names are truncated with ellipsisHover effect : Yellow (#f2bc07) with underline (except current segment)
Source : src/browser/components/ui/breadcrumbs/path/index.tsx:14-15Visibility and Animation The breadcrumbs respect user settings and the splash screen state:
< div className = { `text-md absolute left-3 top-3 z-50 z-[100] flex flex-col items-start rounded-t-lg text-gray-500 transition-opacity duration-300 ${ showSplashScreen ? "pointer-events-none opacity-0" : "opacity-100 delay-[1700ms]" } block select-none` } > { settings . breadcrumbs === "Hide" || currentPath . length === 0 ? null : ( <> < BreadcrumbBranch /> < BreadcrumbPath /> </> ) } </ div >
Key behaviors:
Fade-in delay : 1700ms after splash screen disappearsSettings respect : Hidden when settings.breadcrumbs === "Hide"Empty path : Not shown if no current path
Source : src/browser/components/ui/breadcrumbs/index.tsx:12-26Separator Character Path segments are separated by a > character:
{ index > 0 && < span className = "mx-1 text-gray-500" > { ">" } </ span > }
The separator appears in gray between segments (but not before the first segment).
Source : src/browser/components/ui/breadcrumbs/path/index.tsx:56The breadcrumb system integrates with the Git branch picker, allowing you to switch branches without leaving the 3D world. See Git Integration for more details.