BradNut/awesome-uses
1
0
Fork 0
mirror of https://github.com/BradNut/awesome-uses synced 2025-09-08 17:40:31 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

adds icons to topics bar

Browse source
This commit is contained in:
Wes Bos 2020-01-08 11:06:32 -05:00
parent 7b5f9f0360
commit 405aa0c942
3 changed files with 10 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/components/Person.js
View file

@ -2,13 +2,8 @@ import React from 'react';
import { name } from 'country-emoji'; import { name } from 'country-emoji';
import styled from 'styled-components'; import styled from 'styled-components';
import { Tag, Tags } from './Topics'; import { Tag, Tags } from './Topics';
import iphone from '../images/iphone.png'; import * as icons from '../util/icons';
import android from '../images/android.png';
import windows from '../images/windows.svg';
import apple from '../images/apple.svg';
import linux from '../images/linux.svg';
const icons = { iphone, android, windows, apple, linux };
export default function Person({ person, currentTag }) { export default function Person({ person, currentTag }) {
const url = new URL(person.url); const url = new URL(person.url);
const img = `https://logo.clearbit.com/${url.host}`; const img = `https://logo.clearbit.com/${url.host}`;

3
src/components/Topics.js
View file

@ -1,6 +1,7 @@
import React, { useContext } from 'react'; import React, { useContext } from 'react';
import styled from 'styled-components'; import styled from 'styled-components';
import FilterContext from '../context/FilterContext'; import FilterContext from '../context/FilterContext';
import * as icons from '../util/icons';
export default function Topics() { export default function Topics() {
const { countries, tags, devices, currentTag, setCurrentTag } = useContext( const { countries, tags, devices, currentTag, setCurrentTag } = useContext(
@ -63,7 +64,7 @@ export default function Topics() {
checked={tag.name === currentTag} checked={tag.name === currentTag}
onChange={e => setCurrentTag(e.currentTarget.value)} onChange={e => setCurrentTag(e.currentTarget.value)}
/> />
{tag.name} <img height="20px" src={icons[tag.name]} alt={tag.name} />
<TagCount>{tag.count}</TagCount> <TagCount>{tag.count}</TagCount>
</Tag> </Tag>
))} ))}

7
src/util/icons.js
View file

@ -0,0 +1,7 @@
import iphone from '../images/iphone.png';
import android from '../images/android.png';
import windows from '../images/windows.svg';
import apple from '../images/apple.svg';
import linux from '../images/linux.svg';
export { iphone, android, windows, apple, linux };