Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/victordantasdev/fork-me-corner
🐙 A react component available on npm to easily link to your project on github and is made using React, TypeScript and styled-components.
https://github.com/victordantasdev/fork-me-corner
nextjs npm-package react style styled-components typescript
Last synced: 9 days ago
JSON representation
🐙 A react component available on npm to easily link to your project on github and is made using React, TypeScript and styled-components.
- Host: GitHub
- URL: https://github.com/victordantasdev/fork-me-corner
- Owner: victordantasdev
- Created: 2022-01-17T14:06:01.000Z (almost 3 years ago)
- Default Branch: main
- Last Pushed: 2023-01-02T11:45:13.000Z (almost 2 years ago)
- Last Synced: 2023-12-24T22:05:37.867Z (11 months ago)
- Topics: nextjs, npm-package, react, style, styled-components, typescript
- Language: TypeScript
- Homepage: https://fork-me-corner.vercel.app/
- Size: 308 KB
- Stars: 7
- Watchers: 1
- Forks: 0
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
Awesome Lists containing this project
README
# fork-me-corner
`fork-me-corner` is a react component available on npm to easily link to your project on github and is made using React, TypeScript and styled-components.
And you can configure the component as you like by changing the background color by passing a string with a hex code to a `bgColor` property just as you can change the color of the GitHub logo by passing an `octoColor` property. In addition you can pass to a `prideFlag` property the name of 17 LGBTQIA+ flags available in the component and you can pass to a `flagDirection` property the `vertical` or `horizontal` properties to determine in which direction the flag will appear in the component background.
> You can test, visualize, generate and copy the component on [fork-me-corner playground](https://fork-me-corner.vercel.app)
## Install
```bash
npm i fork-me-corner
```
or
```bash
yarn add fork-me-corner
```
## Usage
```tsx
import { ForkMe } from 'fork-me-corner';
const App = () => (
)
```
You can also pass `bgColor` prop as a hexadecimal string to change the color of background, and `octoColor` to change the color of octocat!
```tsx
import { ForkMe } from 'fork-me-corner';
const App = () => (
)
```
## Examples
### Basic corner configs
|name|print|
|---|---|
|default corner||
|colored corner||
### With LGBTQIA+ configs
|flag|print| |flag|print|
|---|---|---|---|---|
|lgbtqia_plus|| |genderqueer|| |
|agender|| |lesbian|| |
|androgyne|| |neutrois|| |
|aromantic|| |nonbinary|| |
|assexual|| |pansexual|| |
|bisexual|| |philly|| |
|demiboy|| |polysexual|| |
|demigirl|| |transgender|| |
|genderfluid||
## Contributing
[Contributing guideline](https://github.com/victordantasdev/fork-me-corner/blob/main/CONTRIBUTING.md)