From a95b92d925c5589cf407cbf00f3b338c02af819e Mon Sep 17 00:00:00 2001 From: Zeno Rocha Date: Wed, 7 Apr 2021 18:45:46 -0700 Subject: [PATCH] Standardize repository --- INSTALL.md | 62 +++++++++++++++------------------------------------- README.md | 31 ++++++++++++++++++++++---- package.json | 10 ++++----- 3 files changed, 50 insertions(+), 53 deletions(-) diff --git a/INSTALL.md b/INSTALL.md index 8c6f0d2..2e4e26b 100644 --- a/INSTALL.md +++ b/INSTALL.md @@ -1,24 +1,16 @@ +### [Tailwind](https://tailwindcss.com) -

- - Logo - - - - -

Tailwind Dracula

-

- -A super tiny tailwind plugin that enables the use of the [Dracula colour palette](https://www.draculatheme.com/). +A super tiny tailwind plugin that enables the use of the Dracula colour palette. Hopefully this will give you some great dark colors in your next project, and save you 5 min of setting up custom colors. -## Installation - -`npm i tailwind-dracula --save-dev` +#### Installation -## Usage +``` +npm i tailwind-dracula --save-dev +``` +#### Usage In your tailwind.config.js: @@ -40,9 +32,9 @@ Color naming has two options (based on Dracula's names with some changes where n * The color name option. ie. darker, pink, purple * The vampire name option. ie. dracula, vonCount, buffy -> :hand: The default color names for Dracula can override the tailwind default style names. +> The default color names for Dracula can override the tailwind default style names. -## Prefixing color names +#### Prefixing color names By default the plugin accepts a prefix that can be used for the color name options (to avoid clashes with tailwind defaults). ```js plugins: [ @@ -52,16 +44,16 @@ By default the plugin accepts a prefix that can be used for the color name optio Then use the color name option with the dracula prefix, but use the vampire name options without the prefix ```html
-

I vant to suck your blood...

-

Tailwind is cool...

//still works! +

I vant to suck your blood...

+

Tailwind is cool...

//still works!
``` You can also add the prefix for ALL names by passing `true` into the second parameter. ```js - plugins: [ - require('tailwind-dracula')('dracula', true), - ], +plugins: [ + require('tailwind-dracula')('dracula', true), +], ``` Now all colors within dracula will require the dracula prefix ```html @@ -72,10 +64,12 @@ Now all colors within dracula will require the dracula prefix ``` -## Changing color names +#### Changing color names + You can just pull in some of the colors and add them to tailwind ``` const dracula = require('tailwind-dracula/colors') + theme: { extend: { colors: { @@ -84,24 +78,4 @@ theme: { } } }, -``` - -## Color Palette - -Palette | Hex | RGB | HSL | ![Color Picker Boxes](https://draculatheme.com/static/img/color-boxes/eyedropper.png) ---- | --- | --- | --- | --- -Darker/Nosferatu | `#282a36` | `40 42 54` | `231° 15% 18%` | ![Background Color](https://draculatheme.com/static/img/color-boxes/background.png) -Dark/Aro | `#44475a` | `68 71 90` | `232° 14% 31%` | ![Current Line Color](https://draculatheme.com/static/img/color-boxes/current_line.png) -Light/Cullen | `#f8f8f2` | `248 248 242` | `60° 30% 96%` | ![Foreground Color](https://draculatheme.com/static/img/color-boxes/foreground.png) -Blue/VonCount | `#6272a4` | `98 114 164` | `225° 27% 51%` | ![Comment Color](https://draculatheme.com/static/img/color-boxes/comment.png) -Cyan/VanHelsing | `#8be9fd` | `139 233 253` | `191° 97% 77%` | ![Cyan Color](https://draculatheme.com/static/img/color-boxes/cyan.png) -Green/Blade | `#50fa7b` | `80 250 123` | `135° 94% 65%` | ![Green Color](https://draculatheme.com/static/img/color-boxes/green.png) -Orange/Morbius | `#ffb86c` | `255 184 108` | `31° 100% 71%` | ![Orange Color](https://draculatheme.com/static/img/color-boxes/orange.png) -Pink/Buffy | `#ff79c6` | `255 121 198` | `326° 100% 74%` | ![Pink Color](https://draculatheme.com/static/img/color-boxes/pink.png) -Purple/Dracula | `#bd93f9` | `189 147 249` | `265° 89% 78%` | ![Purple Color](https://draculatheme.com/static/img/color-boxes/purple.png) -Red/Marcelin | `#ff5555` | `255 85 85` | `0° 100% 67%` | ![Red Color](https://draculatheme.com/static/img/color-boxes/red.png) -Yellow/Lincoln | `#f1fa8c` | `241 250 140` | `65° 92% 76%` | ![Yellow Color](https://draculatheme.com/static/img/color-boxes/yellow.png) - -## Credits -[Dracula Theme](https://www.draculatheme.com/)
-[Dracula Theme GitHub](https://github.com/dracula/dracula-theme/blob/master/README.md) +``` \ No newline at end of file diff --git a/README.md b/README.md index e75848a..9063ff1 100644 --- a/README.md +++ b/README.md @@ -1,16 +1,39 @@ +

+ + Logo + + + + +

+ # Dracula for [Tailwind](https://tailwindcss.com) > A dark theme for [Tailwind](https://tailwindcss.com). -![Screenshot](./screenshot.png) - ## Install -All instructions can be found at [draculatheme.com/tailwind-dracula](https://draculatheme.com/tailwind-dracula). +All instructions can be found at [draculatheme.com/tailwind](https://draculatheme.com/tailwind). + +## Color Palette + +Palette | Hex | RGB | HSL | ![Color Picker Boxes](https://draculatheme.com/static/img/color-boxes/eyedropper.png) +--- | --- | --- | --- | --- +Darker/Nosferatu | `#282a36` | `40 42 54` | `231° 15% 18%` | ![Background Color](https://draculatheme.com/static/img/color-boxes/background.png) +Dark/Aro | `#44475a` | `68 71 90` | `232° 14% 31%` | ![Current Line Color](https://draculatheme.com/static/img/color-boxes/current_line.png) +Light/Cullen | `#f8f8f2` | `248 248 242` | `60° 30% 96%` | ![Foreground Color](https://draculatheme.com/static/img/color-boxes/foreground.png) +Blue/VonCount | `#6272a4` | `98 114 164` | `225° 27% 51%` | ![Comment Color](https://draculatheme.com/static/img/color-boxes/comment.png) +Cyan/VanHelsing | `#8be9fd` | `139 233 253` | `191° 97% 77%` | ![Cyan Color](https://draculatheme.com/static/img/color-boxes/cyan.png) +Green/Blade | `#50fa7b` | `80 250 123` | `135° 94% 65%` | ![Green Color](https://draculatheme.com/static/img/color-boxes/green.png) +Orange/Morbius | `#ffb86c` | `255 184 108` | `31° 100% 71%` | ![Orange Color](https://draculatheme.com/static/img/color-boxes/orange.png) +Pink/Buffy | `#ff79c6` | `255 121 198` | `326° 100% 74%` | ![Pink Color](https://draculatheme.com/static/img/color-boxes/pink.png) +Purple/Dracula | `#bd93f9` | `189 147 249` | `265° 89% 78%` | ![Purple Color](https://draculatheme.com/static/img/color-boxes/purple.png) +Red/Marcelin | `#ff5555` | `255 85 85` | `0° 100% 67%` | ![Red Color](https://draculatheme.com/static/img/color-boxes/red.png) +Yellow/Lincoln | `#f1fa8c` | `241 250 140` | `65° 92% 76%` | ![Yellow Color](https://draculatheme.com/static/img/color-boxes/yellow.png) ## Team -This theme is maintained by the following person(s) and a bunch of [awesome contributors](https://github.com/dracula/template/graphs/contributors). +This theme is maintained by the following person(s) and a bunch of [awesome contributors](https://github.com/dracula/tailwind/graphs/contributors). [![Nick Graffis](https://github.com/nickgraffis.png?size=100)](https://github.com/nickgraffis) | --- | diff --git a/package.json b/package.json index 96cb37f..4ceb19e 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,7 @@ }, "repository": { "type": "git", - "url": "git+https://github.com/nickgraffis/tailwind-dracula.git" + "url": "git+https://github.com/dracula/tailwind.git" }, "keywords": [ "package", @@ -19,12 +19,12 @@ "theme" ], "author": "Nick Graffis", - "license": "ISC", + "license": "MIT", "bugs": { - "url": "https://github.com/nickgraffis/tailwind-dracula/issues" + "url": "https://github.com/dracula/tailwind/issues" }, "peerDependencies": { "tailwindcss": "2.x" }, - "homepage": "https://github.com/nickgraffis/tailwind-dracula#readme" -} + "homepage": "https://draculatheme.com/tailwind" +} \ No newline at end of file