:root { --docsearch-primary-color: #7C53FF; /*dark*/ --docsearch-secondary-color: #eef0f5; /*faded*/ --docsearch-text-color: rgb(28, 30, 33); --docsearch-spacing: 12px; --docsearch-icon-stroke-width: 1.4; --docsearch-highlight-color: var(--docsearch-primary-color); --docsearch-muted-color: rgb(150, 159, 175); --docsearch-container-background: #eef0f575; --docsearch-logo-color: rgba(84, 104, 255); --docsearch-key-border: 1px solid rgba(0, 0, 0, .05); /* modal */ --docsearch-modal-width: 560px; --docsearch-modal-height: 600px; --docsearch-modal-background: white; --docsearch-modal-shadow: 0 15px 35px 0 rgb(59 65 94 / 10%); /* searchbox */ --docsearch-searchbox-height: 56px; --docsearch-searchbox-background: rgb(235, 237, 240); --docsearch-searchbox-focus-background: #fff; --docsearch-searchbox-shadow: inset 0 0 0 2px var(--docsearch-primary-color); /* hit */ --docsearch-hit-height: 56px; --docsearch-hit-color: rgb(68, 73, 80); --docsearch-hit-active-color: #fff; --docsearch-hit-background: #fff; --docsearch-hit-shadow: 0 1px 3px 0 rgb(212, 217, 225); /* key */ --docsearch-key-gradient: linear-gradient( -225deg, rgb(213, 219, 228) 0%, rgb(248, 248, 248) 100%); --docsearch-key-shadow: inset 0 -2px 0 0 rgb(205, 205, 230), inset 0 0 1px 1px #fff, 0 1px 2px 1px rgba(30, 35, 90, 0.4); /* footer */ --docsearch-footer-height: 44px; --docsearch-footer-background: #fff; --docsearch-footer-shadow: 0 -1px 0 0 rgb(224, 227, 232), 0 -3px 6px 0 rgba(69, 98, 155, 0.12); } /* Darkmode */ .dark { --docsearch-secondary-color: rgb(127, 132, 151); --docsearch-text-color: rgb(245, 246, 247); --docsearch-container-background: rgba(9, 10, 17, 0.8); --docsearch-modal-background: rgb(21, 23, 42); --docsearch-modal-shadow: inset 1px 1px 0 0 rgb(44, 46, 64), 0 3px 8px 0 rgb(0, 3, 9); --docsearch-searchbox-background: rgb(9, 10, 17); --docsearch-searchbox-focus-background: var(--docsearch-modal-background); --docsearch-hit-color: rgb(190, 195, 201); --docsearch-hit-shadow: none; --docsearch-hit-background: rgb(9, 10, 17); --docsearch-key-gradient: linear-gradient( -26.5deg, rgb(86, 88, 114) 0%, rgb(49, 53, 91) 100%); --docsearch-key-shadow: inset 0 -2px 0 0 rgb(40, 45, 85), inset 0 0 1px 1px rgb(81, 87, 125), 0 2px 2px 0 rgba(3, 4, 9, 0.3); --docsearch-footer-background: rgb(30, 33, 54); --docsearch-footer-shadow: inset 0 1px 0 0 rgba(73, 76, 106, 0.5), 0 -4px 8px 0 rgba(0, 0, 0, 0.2); --docsearch-logo-color: rgb(255, 255, 255); --docsearch-muted-color: #d7d7d7; } /* Body modifier */ .DocSearch--active { /* * We need to mark it as important because some websites override the * `style` attribute (e.g. Docusaurus). */ overflow: hidden !important; } /* Container & Modal */ .DocSearch-Container, .DocSearch-Container * { box-sizing: border-box; } .DocSearch-Container { background-color: var(--docsearch-container-background); height: 100vh; left: 0; position: fixed; top: 0; width: 100vw; z-index: 200; } .DocSearch-Container a { text-decoration: none; } .DocSearch-Link { appearance: none; background: none; border: 0; color: var(--docsearch-highlight-color); cursor: pointer; font: inherit; margin: 0; padding: 0; } .DocSearch-Modal { background: var(--docsearch-modal-background); border-radius: 8px; box-shadow: var(--docsearch-modal-shadow); flex-direction: column; margin: 60px auto auto; max-width: var(--docsearch-modal-width); position: relative; font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Ubuntu, sans-serif; } /* Modal Searchbox */ .DocSearch-SearchBar { display: flex; padding: var(--docsearch-spacing) var(--docsearch-spacing) 0; } .DocSearch-Form { align-items: center; background: var(--docsearch-searchbox-focus-background); border-radius: 4px; display: flex; height: var(--docsearch-searchbox-height); padding: 0 var(--docsearch-spacing); position: relative; width: 100%; } .DocSearch-Input { appearance: none; background: transparent; border: 0; color: var(--docsearch-text-color); flex: 1; font: inherit; font-size: 1em; height: 100%; outline: none; padding: 0 0 0 8px; width: 80%; } .DocSearch-Input::placeholder { color: var(--docsearch-muted-color); opacity: 1; /* Firefox */ } .DocSearch-Input::-webkit-search-cancel-button, .DocSearch-Input::-webkit-search-decoration, .DocSearch-Input::-webkit-search-results-button, .DocSearch-Input::-webkit-search-results-decoration { display: none; } .DocSearch-LoadingIndicator, .DocSearch-MagnifierLabel, .DocSearch-Reset { margin: 0; padding: 0; } .DocSearch-MagnifierLabel, .DocSearch-Reset { align-items: center; color: var(--docsearch-highlight-color); display: flex; justify-content: center; } .DocSearch-Container--Stalled .DocSearch-MagnifierLabel { display: none; } .DocSearch-LoadingIndicator { display: none; } .DocSearch-Container--Stalled .DocSearch-LoadingIndicator { align-items: center; color: var(--docsearch-highlight-color); display: flex; justify-content: center; } @media screen and (prefers-reduced-motion: reduce) { .DocSearch-Reset { animation: none; appearance: none; background: none; border: 0; border-radius: 50%; color: var(--docsearch-icon-color); cursor: pointer; right: 0; stroke-width: var(--docsearch-icon-stroke-width); } } .DocSearch-Reset { animation: fade-in 0.1s ease-in forwards; appearance: none; background: none; border: 0; border-radius: 50%; color: var(--docsearch-icon-color); cursor: pointer; padding: 2px; right: 0; stroke-width: var(--docsearch-icon-stroke-width); } .DocSearch-Reset[hidden] { display: none; } .DocSearch-Reset:focus { outline: none; } .DocSearch-Reset:hover { color: var(--docsearch-highlight-color); } .DocSearch-LoadingIndicator svg, .DocSearch-MagnifierLabel svg { height: 1em; width: 1em; } .DocSearch-Cancel { display: none; } /* Modal Dropdown */ .DocSearch-Dropdown { max-height: calc( var(--docsearch-modal-height) - var(--docsearch-searchbox-height) - var(--docsearch-spacing) - var(--docsearch-footer-height)); overflow-y: auto; /* firefox */ overflow-y: overlay; padding: 0 var(--docsearch-spacing); scrollbar-color: var(--docsearch-muted-color) var(--docsearch-modal-background); scrollbar-width: thin; border-top: 1px solid var(--docsearch-secondary-color) } .DocSearch-Dropdown::-webkit-scrollbar { width: 12px; } .DocSearch-Dropdown::-webkit-scrollbar-track { background: transparent; } .DocSearch-Dropdown::-webkit-scrollbar-thumb { background-color: var(--docsearch-muted-color); border: 3px solid var(--docsearch-modal-background); border-radius: 20px; } .DocSearch-Dropdown ul { list-style: none; margin: 0; padding: 0; } .DocSearch-Label { color: var(--docsearch-muted-color); font-size: 0.75em; line-height: 1.6em; } .DocSearch-Help { color: var(--docsearch-muted-color); font-size: 0.9em; margin: 0; user-select: none; } .DocSearch-Title { font-size: 1.2em; } .DocSearch-Logo a { display: flex; } .DocSearch-Logo svg { color: var(--docsearch-logo-color); margin-left: 8px; } /* Hit */ .DocSearch-Hits:last-of-type { margin-bottom: 24px; } .DocSearch-Hits mark { background: none; color: var(--docsearch-highlight-color); } .DocSearch-HitsFooter { color: var(--docsearch-muted-color); display: flex; font-size: 0.85em; justify-content: center; margin-bottom: var(--docsearch-spacing); padding: var(--docsearch-spacing); } .DocSearch-HitsFooter a { border-bottom: 1px solid; color: inherit; } .DocSearch-Hit { border-radius: 4px; display: flex; padding-bottom: 4px; position: relative; } @media screen and (prefers-reduced-motion: reduce) { .DocSearch-Hit--deleting { transition: none; } } .DocSearch-Hit--deleting { opacity: 0; transition: all 250ms linear; } @media screen and (prefers-reduced-motion: reduce) { .DocSearch-Hit--favoriting { transition: none; } } .DocSearch-Hit--favoriting { transform: scale(0); transform-origin: top center; transition: all 250ms linear; transition-delay: 250ms; } .DocSearch-Hit a { background: var(--docsearch-hit-background); border-radius: 4px; box-shadow: var(--docsearch-hit-shadow); display: block; padding-left: var(--docsearch-spacing); width: 100%; } .DocSearch-Hit-source { background: var(--docsearch-modal-background); color: var(--docsearch-highlight-color); font-size: 0.85em; font-weight: 600; line-height: 32px; margin: 0 -4px; padding: 8px 4px 0; position: sticky; top: 0; z-index: 10; } .DocSearch-Hit-Tree { color: var(--docsearch-muted-color); height: var(--docsearch-hit-height); opacity: 0.5; stroke-width: var(--docsearch-icon-stroke-width); width: 24px; } .DocSearch-Hit[aria-selected='true'] a { background-color: var(--docsearch-highlight-color); } .DocSearch-Hit[aria-selected='true'] mark { text-decoration: underline; } .DocSearch-Hit-Container { align-items: center; color: var(--docsearch-hit-color); display: flex; flex-direction: row; height: var(--docsearch-hit-height); padding: 0 var(--docsearch-spacing) 0 0; } .DocSearch-Hit-icon { color: var(--docsearch-muted-color); height: 20px; stroke-width: var(--docsearch-icon-stroke-width); width: 20px; } .DocSearch-Hit-action { align-items: center; color: var(--docsearch-muted-color); display: flex; height: 22px; stroke-width: var(--docsearch-icon-stroke-width); width: 22px; } .DocSearch-Hit-action svg { display: block; height: 18px; width: 18px; } .DocSearch-Hit-action+.DocSearch-Hit-action { margin-left: 6px; } .DocSearch-Hit-action-button { appearance: none; background: none; border: 0; border-radius: 50%; color: inherit; cursor: pointer; padding: 2px; } svg.DocSearch-Hit-Select-Icon { display: none; } .DocSearch-Hit[aria-selected='true'] .DocSearch-Hit-Select-Icon { display: block; } .DocSearch-Hit-action-button:hover, .DocSearch-Hit-action-button:focus { background: rgba(0, 0, 0, 0.2); transition: background-color 0.1s ease-in; } @media screen and (prefers-reduced-motion: reduce) { .DocSearch-Hit-action-button:hover, .DocSearch-Hit-action-button:focus { transition: none; } } .DocSearch-Hit-action-button:hover path, .DocSearch-Hit-action-button:focus path { fill: #fff; } .DocSearch-Hit-content-wrapper { display: flex; flex: 1 1 auto; flex-direction: column; font-weight: 500; justify-content: center; line-height: 1.2em; margin: 0 8px; overflow-x: hidden; position: relative; text-overflow: ellipsis; white-space: nowrap; width: 80%; } .DocSearch-Hit-title { font-size: 0.9em; } .DocSearch-Hit-path { color: var(--docsearch-muted-color); font-size: 0.75em; } .DocSearch-Hit[aria-selected='true'] .DocSearch-Hit-title, .DocSearch-Hit[aria-selected='true'] mark, .DocSearch-Hit[aria-selected='true'] .DocSearch-Hit-text, .DocSearch-Hit[aria-selected='true'] .DocSearch-Hit-path, .DocSearch-Hit[aria-selected='true'] .DocSearch-Hit-icon, .DocSearch-Hit[aria-selected='true'] .DocSearch-Hit-action, .DocSearch-Hit[aria-selected='true'] .DocSearch-Hit-Tree { color: var(--docsearch-hit-active-color) !important; } @media screen and (prefers-reduced-motion: reduce) { .DocSearch-Hit-action-button:hover, .DocSearch-Hit-action-button:focus { background: rgba(0, 0, 0, 0.2); transition: none; } } /* No Results - Start Screen - Error Screen */ .DocSearch-NoResults, .DocSearch-StartScreen, .DocSearch-ErrorScreen { font-size: 0.9em; margin: 0 auto; padding: 36px 0; text-align: center; width: 80%; } .DocSearch-Screen-Icon { color: var(--docsearch-muted-color); padding-bottom: 12px; } .DocSearch-NoResults-Prefill-List { display: inline-block; padding-bottom: 24px; text-align: left; } .DocSearch-NoResults-Prefill-List ul { display: inline-block; padding: 8px 0 0; } .DocSearch-NoResults-Prefill-List li { list-style-position: inside; list-style-type: '» '; } .DocSearch-Prefill { appearance: none; background: none; border: 0; border-radius: 1em; color: var(--docsearch-highlight-color); cursor: pointer; display: inline-block; font-size: 1em; font-weight: 700; padding: 0; } .DocSearch-Prefill:hover, .DocSearch-Prefill:focus { outline: none; text-decoration: underline; } /* Modal Footer */ .DocSearch-Footer { align-items: center; background: var(--docsearch-footer-background); border-radius: 0 0 8px 8px; border-top: 1px solid var(--docsearch-secondary-color); display: flex; flex-direction: row-reverse; flex-shrink: 0; height: var(--docsearch-footer-height); justify-content: space-between; padding: 0 var(--docsearch-spacing); position: relative; user-select: none; width: 100%; z-index: 300; } .DocSearch-Commands { color: var(--docsearch-muted-color); display: flex; list-style: none; margin: 0; padding: 0; } .DocSearch-Commands li { align-items: center; display: flex; } .DocSearch-Commands li:not(:last-of-type) { margin-right: 0.8em; } .DocSearch-Commands-Key { align-items: center; /* background: var(--docsearch-key-gradient); */ border-radius: 2px; /* box-shadow: var(--docsearch-key-shadow); */ display: flex; height: 18px; justify-content: center; margin-right: 0.4em; width: 20px; } /* Responsive */ @media screen and (max-width: 848px) { :root { --docsearch-spacing: 10px; --docsearch-footer-height: 40px; } .DocSearch-Dropdown { height: 100%; } .DocSearch-Container { height: 100vh; height: -webkit-fill-available; position: absolute; } .DocSearch-Footer { border-radius: 0; bottom: 0; position: absolute; } .DocSearch-Hit-content-wrapper { display: flex; position: relative; width: 80%; } .DocSearch-Modal { border-radius: 0; box-shadow: none; height: 100vh; height: -webkit-fill-available; margin: 0; max-width: 100%; width: 100%; } .DocSearch-Cancel { appearance: none; background: none; border: 0; color: var(--docsearch-highlight-color); cursor: pointer; display: inline-block; flex: none; font: inherit; font-size: 1em; font-weight: 500; margin-left: var(--docsearch-spacing); outline: none; overflow: hidden; padding: 0; user-select: none; white-space: nowrap; } .DocSearch-Commands { display: none; } .DocSearch-Hit-Tree { display: none; } } @keyframes fade-in { 0% { opacity: 0; } 100% { opacity: 1; } } .DocSearch-Button { display: flex; align-items: center; background: var(--docsearch-container-background); border: 0; border-radius: 36px; color: var(--docsearch-muted-color); cursor: pointer; display: flex; font-weight: 500; height: 38px; justify-content: space-between; padding: 0 8px; user-select: none; flex-grow: 1; max-width: 200px; margin-left: 12px; border: 2px solid transparent; transition: all .1s; } .DocSearch-Button:hover, .DocSearch-Button:active, .DocSearch-Button:focus { border-color: var(--docsearch-primary-color); outline: none; } .DocSearch-Button-Container { align-items: center; display: flex; } .DocSearch-Search-Icon { stroke-width: 1.6; height: 1em; } .DocSearch-Button .DocSearch-Search-Icon { color: var(--docsearch-muted-color); } .DocSearch-Button-Placeholder { font-size: 1em; padding: 0 12px 0 6px; } .DocSearch-Button-Keys { display: flex; justify-content: center; align-items: center; border: var(--docsearch-key-border); background-color: var(--docsearch-secondary-color); padding: 4px; border-radius: 4px; margin-right: 4px; font-size: .85em; } .DocSearch-Button-Key { align-items: center; border-radius: 3px; color: var(--docsearch-muted-color); display: flex; height: 10px; justify-content: center; position: relative; width: 10px; } .DocSearch-Button-Key:last-of-type { margin-left: 2px; padding-top: 1px; } @media screen and (max-width: 848px) { .DocSearch-Button-Keys, .DocSearch-Button-Placeholder { display: none; } .DocSearch-Button { width: 30px; max-width: 30px; height: 30px; border-radius: 50%; display: flex; justify-content: center; padding: 0; background-color: var(--docsearch-container-background); border: none; } .DocSearch-Button .DocSearch-Search-Icon { color: var(--docsearch-primary-color); } .DocSearch-Search-Icon { stroke-width: 2.4; height: 1em; } }