Skip to content

Instantly share code, notes, and snippets.

@Haraldson
Last active February 1, 2018 12:55
Show Gist options
  • Save Haraldson/1fb1bd53d2a1ddec92ea4f896edc7b10 to your computer and use it in GitHub Desktop.
Save Haraldson/1fb1bd53d2a1ddec92ea4f896edc7b10 to your computer and use it in GitHub Desktop.
SVG Icons
import React, { Component } from 'react'
import Icon from './icon'
export default class Sp00x extends Component {
componentDidMount() {
// I got the spooks
}
render() {
return <Icon name="sp00x" />
}
}
import React from 'react'
export default function Icon(props) {
const { name } = props
return <svg className={`icon icon-${name}`}><use xlinkHref={`#icon-${name}`}></use></svg>
}
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Sp00x</title>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
<symbol id="icon-sp00x" viewBox="0 0 512 512">
<path d="m341 21l-256 0c-23 0-42 20-42 43l0 299 42 0 0-299 256 0z m64 86l-234 0c-24 0-43 19-43 42l0 299c0 23 19 43 43 43l234 0c24 0 43-20 43-43l0-299c0-23-19-42-43-42z m0 341l-234 0 0-299 234 0z"/>
</symbol>
</svg>
<div id="sp00x"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment