networksocialcomponent
v0.0.2
Published
WebComponent networksocialcomponent menu
Downloads
4
Keywords
Readme
WebComponent Social Media
This project has the component principal the social media for new template 2.0 Uniandes, yours characteristics are the next:
Use
Use npm package manager and execute following command:
npm i networksocialcomponent
- Then import social-media-component tag in your main module.
<social-media-component data=''></social-media-component>
- Then use the object array data='' in your project.
[
{
"href": "https://www.facebook.com/",
"img": true,
"title": "facebook",
"imgbase": {
"src": "https://cdn1.iconfinder.com/data/icons/social-media-rounded-corners/512/Rounded_Facebook_svg-512.png",
"alt": "alt img 1"
},
"imghover": {
"src": "https://cdn1.iconfinder.com/data/icons/social-media-2285/512/Colored_Facebook3_svg-512.png",
"alt": "alt img 2"
},
"attributes": {
"id": "click-me",
"target": "_blank"
}
},
{
"href": "https://www.instagram.com/",
"img": true,
"title": "instagram",
"imgbase": {
"src": "https://cdn1.iconfinder.com/data/icons/social-media-rounded-corners/512/Rounded_Instagram_svg-128.png",
"alt": "alt img 1"
},
"imghover": {
"src": "https://cdn2.iconfinder.com/data/icons/social-media-applications/64/social_media_applications_3-instagram-128.png",
"alt": "alt img 2"
},
"attributes": {
"id": "click-me",
"target": "_blank"
}
},
{
"href": "https://twitter.com/home",
"img": true,
"title": "twitter",
"imgbase": {
"src": "https://cdn1.iconfinder.com/data/icons/social-media-rounded-corners/512/Rounded_Twitter5_svg-128.png",
"alt": "alt img 1"
},
"imghover": {
"src": "https://cdn2.iconfinder.com/data/icons/social-media-2285/512/1_Twitter3_colored_svg-512.png",
"alt": "alt img 2"
},
"attributes": {
"id": "click-me",
"target": "_blank"
}
},
{
"href": "https://www.linkedin.com/feed/",
"img": true,
"title": "linkedin",
"imgbase": {
"src": "https://cdn3.iconfinder.com/data/icons/social-media-black-white-2/512/BW_Linkedin_glyph_svg-128.png",
"alt": "alt img 1"
},
"imghover": {
"src": "https://cdn3.iconfinder.com/data/icons/social-network-flat-3/100/LinkedIn-512.png",
"alt": "alt img 2"
},
"attributes": {
"id": "click-me",
"target": "_blank"
}
},
{
"href": "https://www.youtube.com/",
"img": true,
"title": "youtube",
"imgbase": {
"src": "https://cdn1.iconfinder.com/data/icons/social-media-rounded-corners/512/Rounded_Youtube3_svg-512.png",
"alt": "alt img 1"
},
"imghover": {
"src": "https://cdn1.iconfinder.com/data/icons/material-apps/512/icon-youtube-material-design-512.png",
"alt": "alt img 2"
},
"attributes": {
"id": "click-me",
"target": "_blank"
}
}
]
© 2022