Facebook/react
1
0
Fork 0
mirror of https://github.com/facebook/react.git synced 2025-11-01 09:12:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

Moved search icon into separate React component

Browse Source
This commit is contained in:
Brian Vaughn
2019-01-31 14:46:18 -08:00
parent 89f4955b93
commit 1eccdd6f8a
4 changed files with 30 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/devtools/views/Elements.css
-7
View File
@@ -42,13 +42,6 @@
color: var(--color-special02);
}
.IconButtonSVG {
width: 1rem;
height: 1rem;
margin-right: 0.25rem;
fill: currentColor;
}
.Tree {
width: 100%;
overflow: auto;
src/devtools/views/Elements.js
+2 -14
View File
@@ -4,6 +4,7 @@ import React, { useLayoutEffect, useMemo, useState } from 'react';
import Store from '../store';
import Tree from './Tree';
import { StoreContext, TreeContext } from './contexts';
import SearchIcon from './SearchIcon';
import styles from './Elements.css';
import './root.css';
@@ -47,20 +48,7 @@ export default function Elements({ bridge, browserName, themeName }: Props) {
placeholder="Search (text or /regex/)"
/>
<button className={styles.IconButton}>
<svg
xmlns="http://www.w3.org/2000/svg"
className={styles.IconButtonSVG}
width="24"
height="24"
viewBox="0 0 24 24"
>
<path d="M0 0h24v24H0z" fill="none" />
<path
fill="currentColor"
d="M20.94 11c-.46-4.17-3.77-7.48-7.94-7.94V1h-2v2.06C6.83 3.52 3.52 6.83 3.06 11H1v2h2.06c.46 4.17 3.77 7.48 7.94 7.94V23h2v-2.06c4.17-.46 7.48-3.77 7.94-7.94H23v-2h-2.06zM12 19c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z"
/>
</svg>
Select
<SearchIcon /> Select
</button>
</div>
<div className={styles.Tree}>
src/devtools/views/SearchIcon.css
+6
View File
@@ -0,0 +1,6 @@
.Icon {
width: 1rem;
height: 1rem;
margin: 0 0.25rem;
fill: currentColor;
}
src/devtools/views/SearchIcon.js
+22
View File
@@ -0,0 +1,22 @@
// @flow
import React from 'react';
import styles from './SearchIcon.css';
export default function SearchIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
className={styles.Icon}
width="24"
height="24"
viewBox="0 0 24 24"
>
<path d="M0 0h24v24H0z" fill="none" />
<path
fill="currentColor"
d="M20.94 11c-.46-4.17-3.77-7.48-7.94-7.94V1h-2v2.06C6.83 3.52 3.52 6.83 3.06 11H1v2h2.06c.46 4.17 3.77 7.48 7.94 7.94V23h2v-2.06c4.17-.46 7.48-3.77 7.94-7.94H23v-2h-2.06zM12 19c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z"
/>
</svg>
);
}