@trejgun/material-ui-icons-social-networks
v0.0.4
Published
Set of social networks flat icons for Material UI
Downloads
11
Maintainers
Readme
Material UI social network icons
This is free to use set of social network flat icons wrapped in Material UI lib
Installation
npm install @trejgun/material-ui-icons-social-networks
Usage
import React, { FC } from "react";
import {Grid, Button, makeStyles} from "@material-ui/core";
import {
Badoo,
Bebo,
Behance,
Blogger,
Deviantart,
Digg,
Disqus,
Dribbble,
Facebook,
Flickr,
Forrst,
GooglePlus,
Instagram,
Line,
Linkedin,
MySpace,
Pinterest,
Plurk,
Rss,
Skype,
Telegram,
Tumblr,
Twitter,
Viber,
Vimeo,
Vine,
Vk,
Whatsapp,
Xing,
Youtube,
} from "@trejgun/material-ui-icons-social-networks";
const useStyles = makeStyles(
theme => ({
button: {
margin: theme.spacing(1),
},
icon: {
marginRight: theme.spacing(1),
},
}),
{name: "Demo"}
);
const Demo: FC = () => {
const classes = useStyles();
return (
<Grid>
<Button variant="outlined" className={classes.button}>
<Badoo className={classes.icon} /> Badoo
</Button>
<Button variant="outlined" className={classes.button}>
<Bebo className={classes.icon} /> Bebo
</Button>
<Button variant="outlined" className={classes.button}>
<Behance className={classes.icon} /> Behance
</Button>
<Button variant="outlined" className={classes.button}>
<Blogger className={classes.icon} /> Blogger
</Button>
<Button variant="outlined" className={classes.button}>
<Deviantart className={classes.icon} /> Deviantart
</Button>
<Button variant="outlined" className={classes.button}>
<Digg className={classes.icon} /> Digg
</Button>
<Button variant="outlined" className={classes.button}>
<Disqus className={classes.icon} /> Disqus
</Button>
<Button variant="outlined" className={classes.button}>
<Dribbble className={classes.icon} /> Dribbble
</Button>
<Button variant="outlined" className={classes.button}>
<Facebook className={classes.icon} /> Facebook
</Button>
<Button variant="outlined" className={classes.button}>
<Flickr className={classes.icon} /> Flickr
</Button>
<Button variant="outlined" className={classes.button}>
<Forrst className={classes.icon} /> Forrst
</Button>
<Button variant="outlined" className={classes.button}>
<GooglePlus className={classes.icon} /> GooglePlus
</Button>
<Button variant="outlined" className={classes.button}>
<Instagram className={classes.icon} /> Instagram
</Button>
<Button variant="outlined" className={classes.button}>
<Line className={classes.icon} /> Line
</Button>
<Button variant="outlined" className={classes.button}>
<Linkedin className={classes.icon} /> Linkedin
</Button>
<Button variant="outlined" className={classes.button}>
<MySpace className={classes.icon} /> MySpace
</Button>
<Button variant="outlined" className={classes.button}>
<Pinterest className={classes.icon} /> Pinterest
</Button>
<Button variant="outlined" className={classes.button}>
<Plurk className={classes.icon} /> Plurk
</Button>
<Button variant="outlined" className={classes.button}>
<Rss className={classes.icon} /> Rss
</Button>
<Button variant="outlined" className={classes.button}>
<Skype className={classes.icon} /> Skype
</Button>
<Button variant="outlined" className={classes.button}>
<Telegram className={classes.icon} /> Telegram
</Button>
<Button variant="outlined" className={classes.button}>
<Tumblr className={classes.icon} /> Tumblr
</Button>
<Button variant="outlined" className={classes.button}>
<Twitter className={classes.icon} /> Twitter
</Button>
<Button variant="outlined" className={classes.button}>
<Viber className={classes.icon} /> Viber
</Button>
<Button variant="outlined" className={classes.button}>
<Vimeo className={classes.icon} /> Vimeo
</Button>
<Button variant="outlined" className={classes.button}>
<Vine className={classes.icon} /> Vine
</Button>
<Button variant="outlined" className={classes.button}>
<Vk className={classes.icon} /> Vk
</Button>
<Button variant="outlined" className={classes.button}>
<Whatsapp className={classes.icon} /> Whatsapp
</Button>
<Button variant="outlined" className={classes.button}>
<Xing className={classes.icon} /> Xing
</Button>
<Button variant="outlined" className={classes.button}>
<Youtube className={classes.icon} /> Youtube
</Button>
</Grid>
);
};