Skip to content

Commit c4f952c

Browse files
authored
some typos corrected
1 parent fe3266a commit c4f952c

File tree

1 file changed

+24
-25
lines changed

1 file changed

+24
-25
lines changed

README.md

Lines changed: 24 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -6,40 +6,39 @@
66

77
# Tailwindcss CSS Variables
88

9-
This plugin allows you to configure CSS variables for tailwindcss by enabling the `tailwind.config.js` file.
9+
This plugin allows you to configure CSS variables in the `tailwind.config.js`
1010

1111

12-
How it works is similar to the tailwindcss' default configirations. It is also possible to define a different variable group for Dark Mode and to integrate it with your packages through plugin API.
12+
Similar to the tailwindcss configurations you are used to. It is also possible to define a different variable group for Dark Mode and to integrate it with your packages through plugin API.
1313

1414

15-
## Highlighted Features
15+
## Highlights
1616

17-
- Variables are as easy as defining tailwindcss' colors...
17+
- Variables are as easy as defining tailwindcss colors...
1818
- You can designate the variables to `:root` or custom CSS selectors.
1919
- Variables can be formed through using nested object notation.
2020
- Different variables can be composed for the Dark Mode.
2121
- Dark Mode variables are set automatically through the `class` or `media` modes on your configuration.
22-
- If `darkMode` settings are set as `class`, custom selectors can be defined.
23-
- Enables you to configure themes when you are creating your own plugin through Plugin API.
24-
- Prefix can be defined for variables. (Benefits the Plugin API)
25-
- Variables can be used for the configuration file or .css like style files.
22+
- If `darkMode` config are set as `class`, custom dark selector can be defined.
23+
- It allows you to add custom themes while creating your own plugin via the plugin API.
24+
- Prefix can be defined for variables. (It is useful when using the plugin API)
2625
- You can configure your own needs such as multi-themes without needing an additional plugin!
2726

2827

2928
## Documentation
3029

31-
| Language | Documentation Link|
30+
| Language | Documentation link|
3231
| --- | --- |
33-
| English | [**Documentation**](./README.md) |
34-
| Turkish | Dokümantasyon |
32+
| English | Documentation |
33+
| Turkish | [**Dökümantasyon**](./README.tr.md) |
3534

3635
## Installation
3736

3837
```cli
3938
npm install -D @mertasan/tailwindcss-variables
4039
```
4140

42-
## Easy Accessibility
41+
## Usage
4342

4443
```javascript
4544
// tailwind.config.js
@@ -169,7 +168,7 @@ module.exports = {
169168

170169
#### with the `darkToRoot` and `darkSelector` configurations
171170

172-
If the `darkMode:`configuration is set as `'class'` in your tailwindcss configuration, you can change and customize the `darkToRoot` and `darkSelector` settings.
171+
If the `darkMode`configuration is set as `'class'` in your tailwindcss configuration, you can change and customize the `darkToRoot` and `darkSelector` settings.
173172

174173

175174
| Option | Type | Default | Description |
@@ -326,7 +325,7 @@ module.exports = {
326325
}
327326
```
328327

329-
## Using Prefixes
328+
## Prefix
330329

331330
```javascript
332331
// tailwind.config.js
@@ -376,7 +375,7 @@ module.exports = {
376375
}
377376
```
378377

379-
## Nested Object Notation
378+
## Nested object notation
380379

381380
```javascript
382381
// tailwind.config.js
@@ -418,7 +417,7 @@ module.exports = {
418417
```
419418

420419

421-
## Rules for Naming Keys
420+
## Rules for keys of variables
422421

423422
Variable keys can only include designated characters. Other characters will be automatically removed. Because using underscores (_) on objects is allowed, underscores will be transformed into middle dashes (-).
424423

@@ -547,9 +546,9 @@ module.exports = {
547546
}
548547
```
549548

550-
### API Component Helper
549+
### API component helper
551550

552-
You can also use tailwindcss-variables plugin API to save your components.
551+
You can also use tailwindcss-variables plugin API to register your components.
553552

554553
```javascript
555554
// tailwind.config.js
@@ -637,11 +636,11 @@ module.exports = {
637636
}
638637
```
639638

640-
## Detailed Authentic Usage Example
639+
## Detailed example of the API
641640

642641
**What are the advantages?**
643642

644-
Imagine you are creating a form builder (PHP) package for Laravel. In this case, I am sure there will be a lot of styles to customize. Nonetheless, one of the most necessary things is the colors! You'll develop the components with the colors you pick out. Of course these colors can be customized with the `vendor:publish` command but you can make it simpler for everyone. Users can customize the colors for their own likings and if they wish they can also configure your extension for the dark mode as well. This way, users don't have to alter the `.css` or `.blade.php` files for some small and simple customizations. Thus, they can use your extension with up to date templates and can adapt to future version updates. If you have read this statement, it means that now you know why this plugin came about. :)
643+
Imagine you are creating a form builder (PHP) package for Laravel. In this case, I am sure there will be a lot of styles to customize. Nonetheless, one of the most necessary things is the colors! You'll develop the components with the colors you pick out. Of course these colors can be customized with the `vendor:publish` command but you can make it simpler for everyone. Users can customize the colors for their own likings and if they wish they can also configure your plugin for the dark mode as well. This way, users don't have to alter the `.css` or `.blade.php` files for some small and simple customizations. Thus, they can use your extension with up to date templates and can adapt to future version updates. If you have read this statement, it means that now you know why this plugin came about. :)
645644

646645

647646

@@ -761,11 +760,11 @@ module.exports = {
761760
}
762761
```
763762

764-
With a setup just like on this example, it won't be necessary to publish extra .css flies for your plugin styles and also, it won't be necessary for the users to sort out your style files to compile your packages.
763+
Based on these examples, it won't be necessary to publish extra .css flies for your plugin styles and also, it won't be necessary for the users to sort out your style files to compile your packages.
765764

766765

767766

768-
## Examples and Tests
767+
## Examples and tests
769768

770769
I have prepared examples on both helping with the usage and for testing all of the features that's being offered to make sure it works just fine.
771770

@@ -777,12 +776,12 @@ I have prepared examples on both helping with the usage and for testing all of t
777776
| [Tests](https://github.com/mertasan/tailwindcss-variables/tree/master/__tests__) | ![Tests](https://img.shields.io/github/workflow/status/mertasan/tailwindcss-variables/tests?label=tests) |
778777
| [Travis CI](https://travis-ci.com/mertasan/tailwindcss-variables) | ![Tests](https://img.shields.io/travis/mertasan/tailwindcss-variables/master.svg?label=travis-ci) |
779778

780-
> Documents on examples and tests are re-organized on pull-request, push, release and etc. activities.
781-
> For this reason, file paths like `require(../index)` have been used on the example files. If you were to use the examples, you need to change the relevant interiors as `require('@mertasan/tailwindcss-variables')`.
779+
> Documents on examples and tests are re-organized on pull-request, push, release and etc. events.
780+
> For this reason, file paths like `require(../index)` have been used on the example files. If you were to use the examples, you need to change the relevant lines as `require('@mertasan/tailwindcss-variables')`.
782781
>
783782
784783

785-
## Help
784+
## If You Need Help
786785

787786
Please send any questions and issues through GitHub issues. I will try my best to help you.
788787

0 commit comments

Comments
 (0)