docs: 💄 remove icons overloading + few css changes
Signed-off-by: jffarge <jf@dagger.io>
This commit is contained in:
jffarge
parent
88e9662244
commit
07404ae25e
@ -61,13 +61,11 @@ $desktop-xl-width: 1160px;
|
||||
--ifm-menu-color-active: var(--ifm-color-primary-dark);
|
||||
--ifm-menu-color-background-hover: #fdf9d7;
|
||||
--ifm-menu-color-background-active: var(--ifm-menu-color-background-hover);
|
||||
--ifm-menu-link-sublist-icon: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path d="M3.318 9.128a24.776 24.776 0 004.224-3.993.842.842 0 011.32.026c1.227 1.618 2.107 3.387 3.831 4.556.889.6-.159 1.9-1.044 1.3A14.369 14.369 0 018.14 7a30.457 30.457 0 01-3.829 3.463c-.845.671-1.834-.67-.993-1.335z" fill="%23131226" /></svg>');
|
||||
--ifm-navbar-height: 6rem;
|
||||
--ifm-navbar-background-color: var(--ifm-color-primary-dark);
|
||||
--ifm-navbar-padding-vertical: 0;
|
||||
--ifm-pagination-nav-border-radius: 0;
|
||||
--ifm-pre-padding: 2rem;
|
||||
--ifm-toc-border-color: transparent;
|
||||
--ifm-toc-link-color: var(--ifm-color-primary-dark);
|
||||
}
|
||||
|
||||
@ -191,7 +189,7 @@ h1[class^="h1Heading"] {
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.edit-this-page {
|
||||
.theme-edit-this-page {
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -341,7 +339,11 @@ a[class^="sidebarLogo"] {
|
||||
|
||||
main[class^="docMainContainer"] {
|
||||
background: #ffffff;
|
||||
padding: 2rem;
|
||||
padding: 2rem 2rem 2rem 4rem;
|
||||
|
||||
@include tablet {
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
html[data-theme="dark"] & {
|
||||
background: var(--ifm-color-primary-dark);
|
||||
@ -566,19 +568,6 @@ button[class^="copyButton"] {
|
||||
}
|
||||
|
||||
/* docsearch */
|
||||
.DocSearch-Button-Container {
|
||||
.DocSearch-Search-Icon {
|
||||
display: none;
|
||||
}
|
||||
&:before {
|
||||
content: "";
|
||||
background-color: black;
|
||||
mask: url("/img/Dagger_Icons_Search.svg");
|
||||
display: block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.DocSearch-Button {
|
||||
margin-right: 2rem !important;
|
||||
|
||||
@ -1 +0,0 @@
|
||||
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><defs><style>.cls-1{fill:#131226;}</style></defs><path class="cls-1" d="M13,7.149A24.806,24.806,0,0,1,8.433,3.558C7.651,2.824,6.47,4,7.255,4.737a30.365,30.365,0,0,0,3.988,3.278A14.369,14.369,0,0,0,7.79,12.076c-.463.963.974,1.809,1.44.841.9-1.877,2.523-3.007,3.943-4.46A.841.841,0,0,0,13,7.149Z"/><path class="cls-1" d="M8.6,7.683A24.806,24.806,0,0,1,4.025,4.092c-.782-.734-1.962.441-1.178,1.179A30.365,30.365,0,0,0,6.835,8.549,14.369,14.369,0,0,0,3.382,12.61c-.462.964.974,1.809,1.44.841.9-1.877,2.523-3.007,3.943-4.46A.841.841,0,0,0,8.6,7.683Z"/></svg>
|
||||
|
Before Width: | Height: | Size: 648 B |
@ -1 +0,0 @@
|
||||
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><defs><style>.cls-1{fill:#131226;}</style></defs><path class="cls-1" d="M4.757,7.952A30.365,30.365,0,0,0,8.745,4.674c.785-.737-.4-1.913-1.178-1.179A24.764,24.764,0,0,1,3,7.086.842.842,0,0,0,2.827,8.4c1.42,1.452,3.041,2.582,3.944,4.46.465.968,1.9.122,1.439-.842A14.383,14.383,0,0,0,4.757,7.952Z"/><path class="cls-1" d="M11.975,4.029A24.764,24.764,0,0,1,7.4,7.62a.842.842,0,0,0-.169,1.309c1.42,1.452,3.041,2.583,3.943,4.46.466.968,1.9.122,1.44-.841A14.373,14.373,0,0,0,9.165,8.486a30.365,30.365,0,0,0,3.988-3.278C13.937,4.471,12.757,3.3,11.975,4.029Z"/></svg>
|
||||
|
Before Width: | Height: | Size: 653 B |
@ -1,61 +0,0 @@
|
||||
/**
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
import React from 'react';
|
||||
import Link from '@docusaurus/Link';
|
||||
import Translate, { translate } from '@docusaurus/Translate';
|
||||
import DocPaginatorPrev from "./Dagger_Icons_Arrow-previous.svg"
|
||||
import DocPaginatorNext from "./Dagger_Icons_Arrow-next.svg"
|
||||
|
||||
function DocPaginator(props) {
|
||||
const { metadata } = props;
|
||||
return (
|
||||
<nav
|
||||
className="pagination-nav"
|
||||
aria-label={translate({
|
||||
id: 'theme.docs.paginator.navAriaLabel',
|
||||
message: 'Docs pages navigation',
|
||||
description: 'The ARIA label for the docs pagination',
|
||||
})}>
|
||||
<div className="pagination-nav__item">
|
||||
{metadata.previous && (
|
||||
<Link
|
||||
className="pagination-nav__link"
|
||||
to={metadata.previous.permalink}>
|
||||
<div className="pagination-nav__sublabel">
|
||||
<Translate
|
||||
id="theme.docs.paginator.previous"
|
||||
description="The label used to navigate to the previous doc">
|
||||
Previous
|
||||
</Translate>
|
||||
</div>
|
||||
<div className="pagination-nav__label">
|
||||
<DocPaginatorPrev height={23} style={{ marginRight: '0.5rem' }} />{metadata.previous.title}
|
||||
</div>
|
||||
</Link>
|
||||
)}
|
||||
</div>
|
||||
<div className="pagination-nav__item pagination-nav__item--next">
|
||||
{metadata.next && (
|
||||
<Link className="pagination-nav__link" to={metadata.next.permalink}>
|
||||
<div className="pagination-nav__sublabel">
|
||||
<Translate
|
||||
id="theme.docs.paginator.next"
|
||||
description="The label used to navigate to the next doc">
|
||||
Next
|
||||
</Translate>
|
||||
</div>
|
||||
<div className="pagination-nav__label">
|
||||
{metadata.next.title}<DocPaginatorNext height={23} style={{ marginLeft: '0.5rem' }} />
|
||||
</div>
|
||||
</Link>
|
||||
)}
|
||||
</div>
|
||||
</nav>
|
||||
);
|
||||
}
|
||||
|
||||
export default DocPaginator;
|
||||
@ -1,22 +0,0 @@
|
||||
/**
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
import React from 'react';
|
||||
import Translate from '@docusaurus/Translate';
|
||||
import IconEdit from '../../../static/img/Dagger_Icons_Edit.svg';
|
||||
|
||||
export default function EditThisPage({ editUrl }) {
|
||||
return (
|
||||
<a href={editUrl} className='edit-this-page' target="_blank" rel="noreferrer noopener">
|
||||
<IconEdit width='1.2em' height='1.2em' />
|
||||
<Translate
|
||||
id="theme.common.editThisPage"
|
||||
description="The link label to edit the current page">
|
||||
Edit this page
|
||||
</Translate>
|
||||
</a>
|
||||
);
|
||||
}
|
||||
@ -1,204 +0,0 @@
|
||||
/**
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
import React, { useState, useRef, useCallback, useMemo } from 'react';
|
||||
import { createPortal } from 'react-dom';
|
||||
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
|
||||
import { useHistory } from '@docusaurus/router';
|
||||
import { useBaseUrlUtils } from '@docusaurus/useBaseUrl';
|
||||
import Link from '@docusaurus/Link';
|
||||
import Head from '@docusaurus/Head';
|
||||
import useSearchQuery from '@theme/hooks/useSearchQuery';
|
||||
import { DocSearchButton, useDocSearchKeyboardEvents } from '@docsearch/react';
|
||||
import useAlgoliaContextualFacetFilters from '@theme/hooks/useAlgoliaContextualFacetFilters';
|
||||
import { translate } from '@docusaurus/Translate';
|
||||
|
||||
let DocSearchModal = null;
|
||||
|
||||
function Hit({ hit, children }) {
|
||||
return <Link to={hit.url}>{children}</Link>;
|
||||
}
|
||||
|
||||
function ResultsFooter({ state, onClose }) {
|
||||
const { generateSearchPageLink } = useSearchQuery();
|
||||
|
||||
return (
|
||||
<Link to={generateSearchPageLink(state.query)} onClick={onClose}>
|
||||
See all {state.context.nbHits} results
|
||||
</Link>
|
||||
);
|
||||
}
|
||||
|
||||
function DocSearch({ contextualSearch, ...props }) {
|
||||
const { siteMetadata } = useDocusaurusContext();
|
||||
|
||||
const contextualSearchFacetFilters = useAlgoliaContextualFacetFilters();
|
||||
|
||||
const configFacetFilters = props.searchParameters?.facetFilters ?? [];
|
||||
|
||||
const facetFilters = contextualSearch
|
||||
? // Merge contextual search filters with config filters
|
||||
[...contextualSearchFacetFilters, ...configFacetFilters]
|
||||
: // ... or use config facetFilters
|
||||
configFacetFilters;
|
||||
|
||||
// we let user override default searchParameters if he wants to
|
||||
const searchParameters = {
|
||||
...props.searchParameters,
|
||||
facetFilters,
|
||||
};
|
||||
|
||||
const { withBaseUrl } = useBaseUrlUtils();
|
||||
const history = useHistory();
|
||||
const searchContainer = useRef(null);
|
||||
const searchButtonRef = useRef(null);
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
const [initialQuery, setInitialQuery] = useState(null);
|
||||
|
||||
const importDocSearchModalIfNeeded = useCallback(() => {
|
||||
if (DocSearchModal) {
|
||||
return Promise.resolve();
|
||||
}
|
||||
|
||||
return Promise.all([
|
||||
import('@docsearch/react/modal'),
|
||||
import('@docsearch/react/style'),
|
||||
import('./styles.css'),
|
||||
]).then(([{ DocSearchModal: Modal }]) => {
|
||||
DocSearchModal = Modal;
|
||||
});
|
||||
}, []);
|
||||
|
||||
const onOpen = useCallback(() => {
|
||||
importDocSearchModalIfNeeded().then(() => {
|
||||
searchContainer.current = document.createElement('div');
|
||||
document.body.insertBefore(
|
||||
searchContainer.current,
|
||||
document.body.firstChild,
|
||||
);
|
||||
setIsOpen(true);
|
||||
});
|
||||
}, [importDocSearchModalIfNeeded, setIsOpen]);
|
||||
|
||||
const onClose = useCallback(() => {
|
||||
setIsOpen(false);
|
||||
searchContainer.current.remove();
|
||||
}, [setIsOpen]);
|
||||
|
||||
const onInput = useCallback(
|
||||
(event) => {
|
||||
importDocSearchModalIfNeeded().then(() => {
|
||||
setIsOpen(true);
|
||||
setInitialQuery(event.key);
|
||||
});
|
||||
},
|
||||
[importDocSearchModalIfNeeded, setIsOpen, setInitialQuery],
|
||||
);
|
||||
|
||||
const navigator = useRef({
|
||||
navigate({ itemUrl }) {
|
||||
history.push(itemUrl);
|
||||
},
|
||||
}).current;
|
||||
|
||||
const transformItems = useRef((items) => {
|
||||
return items.map((item) => {
|
||||
// We transform the absolute URL into a relative URL.
|
||||
// Alternatively, we can use `new URL(item.url)` but it's not
|
||||
// supported in IE.
|
||||
const a = document.createElement('a');
|
||||
a.href = item.url;
|
||||
|
||||
return {
|
||||
...item,
|
||||
url: withBaseUrl(`${a.pathname}${a.hash}`),
|
||||
};
|
||||
});
|
||||
}).current;
|
||||
|
||||
const resultsFooterComponent = useMemo(
|
||||
() => (footerProps) => <ResultsFooter {...footerProps} onClose={onClose} />,
|
||||
[onClose],
|
||||
);
|
||||
|
||||
const transformSearchClient = useCallback(
|
||||
(searchClient) => {
|
||||
searchClient.addAlgoliaAgent(
|
||||
'docusaurus',
|
||||
siteMetadata.docusaurusVersion,
|
||||
);
|
||||
|
||||
return searchClient;
|
||||
},
|
||||
[siteMetadata.docusaurusVersion],
|
||||
);
|
||||
|
||||
useDocSearchKeyboardEvents({
|
||||
isOpen,
|
||||
onOpen,
|
||||
onClose,
|
||||
onInput,
|
||||
searchButtonRef,
|
||||
});
|
||||
|
||||
const translatedSearchLabel = translate({
|
||||
id: 'theme.SearchBar.label',
|
||||
message: 'Search',
|
||||
description: 'The ARIA label and placeholder for search button',
|
||||
});
|
||||
|
||||
return (
|
||||
<>
|
||||
<Head>
|
||||
{/* This hints the browser that the website will load data from Algolia,
|
||||
and allows it to preconnect to the DocSearch cluster. It makes the first
|
||||
query faster, especially on mobile. */}
|
||||
<link
|
||||
rel="preconnect"
|
||||
href={`https://${props.appId}-dsn.algolia.net`}
|
||||
crossOrigin="anonymous"
|
||||
/>
|
||||
</Head>
|
||||
|
||||
<DocSearchButton
|
||||
onTouchStart={importDocSearchModalIfNeeded}
|
||||
onFocus={importDocSearchModalIfNeeded}
|
||||
onMouseOver={importDocSearchModalIfNeeded}
|
||||
onClick={onOpen}
|
||||
ref={searchButtonRef}
|
||||
translations={{
|
||||
buttonText: translatedSearchLabel,
|
||||
buttonAriaLabel: translatedSearchLabel,
|
||||
}}
|
||||
/>
|
||||
|
||||
{isOpen &&
|
||||
createPortal(
|
||||
<DocSearchModal
|
||||
onClose={onClose}
|
||||
initialScrollY={window.scrollY}
|
||||
initialQuery={initialQuery}
|
||||
navigator={navigator}
|
||||
transformItems={transformItems}
|
||||
hitComponent={Hit}
|
||||
resultsFooterComponent={resultsFooterComponent}
|
||||
transformSearchClient={transformSearchClient}
|
||||
{...props}
|
||||
searchParameters={searchParameters}
|
||||
/>,
|
||||
searchContainer.current,
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function SearchBar() {
|
||||
const { siteConfig } = useDocusaurusContext();
|
||||
return <DocSearch {...siteConfig.themeConfig.algolia} />;
|
||||
}
|
||||
|
||||
export default SearchBar;
|
||||
@ -1,20 +0,0 @@
|
||||
/**
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
:root {
|
||||
--docsearch-primary-color: var(--ifm-color-primary);
|
||||
--docsearch-text-color: var(--ifm-font-color-base);
|
||||
}
|
||||
|
||||
.DocSearch-Button {
|
||||
transition: all var(--ifm-transition-fast)
|
||||
var(--ifm-transition-timing-default);
|
||||
}
|
||||
|
||||
.DocSearch-Container {
|
||||
z-index: calc(var(--ifm-z-index-fixed) + 1);
|
||||
}
|
||||
Reference in New Issue
Block a user