Reaccionar insignias para su perfil y proyectos.
Encuentre una lista completa de más de 1400 insignias en las insignias.
pnpm add react-simple-badgesnpm i react-simple-badgesyarn add react-simple-badgesbun add react-simple-badgesUn componente que representa una imagen de una insignia de Shields.io usando la lista de iconos de Simpleicons.org. Cada 24 horas se ejecuta una acción de GitHub para verificar los nuevos íconos. Si es nuevo, se lanza una nueva versión del módulo NPM. Este módulo está destinado a usarse como un componente del servidor React. Usando el nuevo componente Async. Esto significa que puede importar la lista de iconos grandes para obtener el color de fondo que necesita, pero sin aumentar el tiempo de carga de la página de los usuarios finales. Pero esto significa que necesita un marco que admita los componentes del servidor y reaccione 18.2.0 o posterior.
import { Badge } from "react-simple-badges"
export default async function HomePage ( ) {
return (
< >
< Badge name = "Node.js" style = { { width : 200 } } logoColor = "#eb4034" />
< Badge name = "YouTube Gaming" label = "Youtube" />
< Badge name = "Valve" label = "Value Please fix" style = { { padding : 10 } } />
< Badge name = "Tesla" backgroundColor = "#32a853" />
</ >
)
}Proyecto de ejemplo en stackblitz.com
<Badge /><Badge name="" /> requerido: cadenaEl nombre de la insignia que estás tratando de usar, por ejemplo. "Instagram"
<Badge label="" /> opcional: cadenaUna cadena personalizada para reemplazar la palabra en la insignia, por ejemplo. "Insta"
<Badge logoColor="" /> Opcional: String: Hex ColorReemplaza el color del logotipo que predeterminado a White Eg. "#FFB900"
<Badge backgroundColor="" /> Opcional: String: Hex ColorReemplaza el color del fondo de la insignia, por ejemplo,. "#00e1ff"