diff options
Diffstat (limited to 'examples/docs/src')
| -rw-r--r-- | examples/docs/src/components/Header/LanguageSelect.tsx | 15 | ||||
| -rw-r--r-- | examples/docs/src/components/Header/Search.tsx | 8 | ||||
| -rw-r--r-- | examples/docs/src/components/Header/SidebarToggle.tsx | 23 | ||||
| -rw-r--r-- | examples/docs/src/components/RightSidebar/TableOfContents.tsx | 6 | ||||
| -rw-r--r-- | examples/docs/src/components/RightSidebar/ThemeToggleButton.tsx | 16 | ||||
| -rw-r--r-- | examples/docs/src/config.ts | 4 | ||||
| -rw-r--r-- | examples/docs/src/styles/theme.css | 8 | 
7 files changed, 67 insertions, 13 deletions
| diff --git a/examples/docs/src/components/Header/LanguageSelect.tsx b/examples/docs/src/components/Header/LanguageSelect.tsx index 7fd3af229..a895cc7cc 100644 --- a/examples/docs/src/components/Header/LanguageSelect.tsx +++ b/examples/docs/src/components/Header/LanguageSelect.tsx @@ -6,8 +6,19 @@ import { KNOWN_LANGUAGES, langPathRegex } from '../../languages';  const LanguageSelect: FunctionalComponent<{ lang: string }> = ({ lang }) => {  	return (  		<div class="language-select-wrapper"> -			<svg aria-hidden="true" focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 88.6 77.3" height="1.2em" width="1.2em"> -				<path fill="currentColor" d="M61,24.6h7.9l18.7,51.6h-7.7l-5.4-15.5H54.3l-5.6,15.5h-7.2L61,24.6z M72.6,55l-8-22.8L56.3,55H72.6z" /> +			<svg +				aria-hidden="true" +				focusable="false" +				role="img" +				xmlns="http://www.w3.org/2000/svg" +				viewBox="0 0 88.6 77.3" +				height="1.2em" +				width="1.2em" +			> +				<path +					fill="currentColor" +					d="M61,24.6h7.9l18.7,51.6h-7.7l-5.4-15.5H54.3l-5.6,15.5h-7.2L61,24.6z M72.6,55l-8-22.8L56.3,55H72.6z" +				/>  				<path  					fill="currentColor"  					d="M53.6,60.6c-10-4-16-9-22-14c0,0,1.3,1.3,0,0c-6,5-20,13-20,13l-4-6c8-5,10-6,19-13c-2.1-1.9-12-13-13-19h8          c4,9,10,14,10,14c10-8,10-19,10-19h8c0,0-1,13-12,24l0,0c5,5,10,9,19,13L53.6,60.6z M1.6,16.6h56v-8h-23v-7h-9v7h-24V16.6z" diff --git a/examples/docs/src/components/Header/Search.tsx b/examples/docs/src/components/Header/Search.tsx index ebc563c61..4d06ce00b 100644 --- a/examples/docs/src/components/Header/Search.tsx +++ b/examples/docs/src/components/Header/Search.tsx @@ -41,7 +41,13 @@ export default function Search() {  		<>  			<button type="button" ref={searchButtonRef} onClick={onOpen} className="search-input">  				<svg width="24" height="24" fill="none"> -					<path d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" /> +					<path +						d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" +						stroke="currentColor" +						strokeWidth="2" +						strokeLinecap="round" +						strokeLinejoin="round" +					/>  				</svg>  				<span>Search</span>  				<span className="search-hint"> diff --git a/examples/docs/src/components/Header/SidebarToggle.tsx b/examples/docs/src/components/Header/SidebarToggle.tsx index 90b180461..2be9dee9a 100644 --- a/examples/docs/src/components/Header/SidebarToggle.tsx +++ b/examples/docs/src/components/Header/SidebarToggle.tsx @@ -15,9 +15,26 @@ const MenuToggle: FunctionalComponent = () => {  	}, [sidebarShown]);  	return ( -		<button type="button" aria-pressed={sidebarShown ? 'true' : 'false'} id="menu-toggle" onClick={() => setSidebarShown(!sidebarShown)}> -			<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="none" viewBox="0 0 24 24" stroke="currentColor"> -				<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" /> +		<button +			type="button" +			aria-pressed={sidebarShown ? 'true' : 'false'} +			id="menu-toggle" +			onClick={() => setSidebarShown(!sidebarShown)} +		> +			<svg +				xmlns="http://www.w3.org/2000/svg" +				width="1em" +				height="1em" +				fill="none" +				viewBox="0 0 24 24" +				stroke="currentColor" +			> +				<path +					stroke-linecap="round" +					stroke-linejoin="round" +					stroke-width="2" +					d="M4 6h16M4 12h16M4 18h16" +				/>  			</svg>  			<span className="sr-only">Toggle sidebar</span>  		</button> diff --git a/examples/docs/src/components/RightSidebar/TableOfContents.tsx b/examples/docs/src/components/RightSidebar/TableOfContents.tsx index 578d2aa98..537508ab4 100644 --- a/examples/docs/src/components/RightSidebar/TableOfContents.tsx +++ b/examples/docs/src/components/RightSidebar/TableOfContents.tsx @@ -33,7 +33,11 @@ const TableOfContents: FunctionalComponent<{ headers: any[] }> = ({ headers = []  				{headers  					.filter(({ depth }) => depth > 1 && depth < 4)  					.map((header) => ( -						<li class={`header-link depth-${header.depth} ${activeId === header.slug ? 'active' : ''}`.trim()}> +						<li +							class={`header-link depth-${header.depth} ${ +								activeId === header.slug ? 'active' : '' +							}`.trim()} +						>  							<a href={`#${header.slug}`}>{header.text}</a>  						</li>  					))} diff --git a/examples/docs/src/components/RightSidebar/ThemeToggleButton.tsx b/examples/docs/src/components/RightSidebar/ThemeToggleButton.tsx index 6bdf45f02..a3f31288d 100644 --- a/examples/docs/src/components/RightSidebar/ThemeToggleButton.tsx +++ b/examples/docs/src/components/RightSidebar/ThemeToggleButton.tsx @@ -6,14 +6,26 @@ import './ThemeToggleButton.css';  const themes = ['light', 'dark'];  const icons = [ -	<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="currentColor"> +	<svg +		xmlns="http://www.w3.org/2000/svg" +		width="20" +		height="20" +		viewBox="0 0 20 20" +		fill="currentColor" +	>  		<path  			fillRule="evenodd"  			d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z"  			clipRule="evenodd"  		/>  	</svg>, -	<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="currentColor"> +	<svg +		xmlns="http://www.w3.org/2000/svg" +		width="20" +		height="20" +		viewBox="0 0 20 20" +		fill="currentColor" +	>  		<path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z" />  	</svg>,  ]; diff --git a/examples/docs/src/config.ts b/examples/docs/src/config.ts index 174765d27..537723f43 100644 --- a/examples/docs/src/config.ts +++ b/examples/docs/src/config.ts @@ -7,7 +7,9 @@ export const SITE = {  export const OPEN_GRAPH = {  	image: {  		src: 'https://github.com/withastro/astro/blob/main/assets/social/banner.jpg?raw=true', -		alt: 'astro logo on a starry expanse of space,' + ' with a purple saturn-like planet floating in the right foreground', +		alt: +			'astro logo on a starry expanse of space,' + +			' with a purple saturn-like planet floating in the right foreground',  	},  	twitter: 'astrodotbuild',  }; diff --git a/examples/docs/src/styles/theme.css b/examples/docs/src/styles/theme.css index 830bed8dd..1dad9dc70 100644 --- a/examples/docs/src/styles/theme.css +++ b/examples/docs/src/styles/theme.css @@ -1,8 +1,10 @@  :root { -	--font-fallback: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji; +	--font-fallback: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, +		Apple Color Emoji, Segoe UI Emoji;  	--font-body: system-ui, var(--font-fallback); -	--font-mono: 'IBM Plex Mono', Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', -		'Liberation Mono', 'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace; +	--font-mono: 'IBM Plex Mono', Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', +		'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', +		'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace;  	/*     * Variables with --color-base prefix define | 
