commit to the simpler approach

README.md

@@ -8,7 +8,7 @@ This addon allows you to merge multiple [Tailwind CSS](https://tailwindcss.com/)
 
 This addon provides:
 
-- An Antlers modifier for merging the Tailwind CSS classes
+- An Antlers modifier for merging the Tailwind CSS classes.
 - Installs the [`tailwind-merge-laravel`](https://github.com/gehrisandro/tailwind-merge-laravel) package which provides the merge functionality within the Laravel context.
 
 ## Installation
@@ -23,36 +23,28 @@ composer require marcorieser/tailwind-merge-statamic
 
 > Keep in mind: Later applied classes overrule previous ones.
 
-Just apply the modifier to your existing Tailwind CSS classes.  
+Create your class string as you normally do and apply the modifier which then removes the conflicting classes:
 ```antlers
-<div class="{{ 'w-10 h-10 rounded-full bg-red-500' | tw_merge }}"></div>
-```
+{{ varable_holding_classes = 'bg-blue-500 w-8' }}
 
-It's possible to pass the classes as a string, as array or a combination of both:  
-```antlers
-{{ 'w-10 h-10 rounded-full bg-red-500' | tw_merge }}
-{{ ['w-10', 'h-10', 'rounded-full', 'bg-red-500'] | tw_merge }}
-{{ ['w-10', 'h-10', ['rounded-full', 'bg-red-500']] | tw_merge }}
-```
+<div class="{{ 'w-10 h-10 rounded-full bg-red-500 {varable_holding_classes}' | tw_merge }}"></div>
 
-By default, the modifier uses the `class` variable at the current level of the cascade for merging:
-```antlers
-{{# these lines are identical #}}
-{{ 'w-10 h-10 rounded-full bg-red-500' | tw_merge }}
-{{ 'w-10 h-10 rounded-full bg-red-500' | tw_merge('class') }}
+{{# output #}}
+<div class="w-8 h-10 rounded-full bg-blue-500"></div>
 ```
 
- You can use different variables by passing its names as parameters to the modifier:
+Alternatively, you can pass the names of the variables as params to the modifier and omit them in your class string:
 ```antlers
-{{ 'w-10 h-10 rounded-full bg-red-500' | tw_merge('variable_1', 'variable_2') }}
+<div class="{{ 'w-10 h-10 rounded-full bg-red-500' | tw_merge('varable_holding_classes', 'another_variable') }}"></div>
 ```
 
-If you want, you can disable the behavior of automatically resolving variables from the cascade entirely by passing `false` as parameter and handle everything on your own as seen below.
+It is possible to apply the modifier to a string, an array or a combination of both:
 ```antlers
-{{ 'w-10 h-10 rounded-full bg-red-500 {class} {other_classes}' | tw_merge(false) }}
+{{ 'w-10 h-10 rounded-full bg-red-500 {variable}' | tw_merge }}
+{{ ['w-10', 'h-10', 'rounded-full', 'bg-red-500',  '{variable}'] | tw_merge }}
+{{ ['w-10', 'h-10', ['rounded-full', 'bg-red-500'], '{variable}'] | tw_merge }}
 ```
 
-
 ## Documentation
 There is currently not more to that addon as written above but the underlying Laravel package is capable of so much more. Please have a look at its [GitHub Repo](https://github.com/gehrisandro/tailwind-merge-laravel).