Extract default CSS classes to config. (MedicOneSystems#289)

Extracting the default CSS classes applied by the rowClasses() and cellClasses() methods so it's easier to globally change the style.
Added a short hint in the readme.
Also added some comments to the config file.

Author: spekkie2002

README.md

@@ -449,6 +449,8 @@ public function cellClasses($row, $column)
 }
 ```
 
+You can change the default CSS classes applied by the ```rowClasses``` and the ```cellClasses``` methods by changing ```default_classes``` in the ```livewire-datatables.php``` config file.
+
 You could also override the render method in your table's class to provide different templates for different tables.
 
 

config/livewire-datatables.php

@@ -1,10 +1,77 @@
 <?php
 
 return [
+    /*
+    |--------------------------------------------------------------------------
+    | Default Carbon Formats
+    |--------------------------------------------------------------------------
+    | The default formats that are used for TimeColumn & DateColumn.
+    | You can use the formatting characters from the PHP DateTime class.
+    | More info: https://www.php.net/manual/en/datetime.format.php
+    |
+    */
+
     'default_time_format' => 'H:i',
     'default_date_format' => 'd/m/Y',
-    'suppress_search_highlights' => false, // When searching, don't highlight matching search results when set to true
+
+    /*
+    |--------------------------------------------------------------------------
+    | Surpress Search Highlights
+    |--------------------------------------------------------------------------
+    | When enabled, matching text won't be highlighted in the search results
+    | while searching.
+    |
+    */
+
+    'suppress_search_highlights' => false,
+
+    /*
+    |--------------------------------------------------------------------------
+    | Per Page Options
+    |--------------------------------------------------------------------------
+    | Sets the options to choose from in the `Per Page`dropdown.
+    |
+    */
+
     'per_page_options' => [10, 25, 50, 100],
+
+    /*
+    |--------------------------------------------------------------------------
+    | Default Per Page
+    |--------------------------------------------------------------------------
+    | Sets the default amount of rows to display per page.
+    |
+    */
+
     'default_per_page' => 10,
+
+    /*
+    |--------------------------------------------------------------------------
+    | Model Namespace
+    |--------------------------------------------------------------------------
+    | Sets the default namespace to be used when generating a new Datatables
+    | component.
+    |
+    */
+
     'model_namespace' => 'App',
+
+    /*
+    |--------------------------------------------------------------------------
+    | Default CSS classes
+    |--------------------------------------------------------------------------
+    |
+    | Sets the default classes that will be applied to each row and class
+    | if the rowClasses() and cellClasses() functions are not overrided.
+    |
+    */
+
+    'default_classes' => [
+        'row' => [
+            'even' => 'divide-x divide-gray-100 text-sm text-gray-900 bg-gray-100',
+            'odd' => 'divide-x divide-gray-100 text-sm text-gray-900 bg-gray-50',
+            'selected' => 'divide-x divide-gray-100 text-sm text-gray-900 bg-yellow-100',
+        ],
+        'cell' => 'text-sm text-gray-900'
+    ]
 ];

src/Http/Livewire/LivewireDatatable.php

@@ -1509,12 +1509,20 @@ public function getSavedQueries()
     public function rowClasses($row, $loop)
     {
         // Override this method with your own method for adding classes to a row
-        return 'divide-x divide-gray-100 text-sm text-gray-900 ' . ($this->rowIsSelected($row) ? 'bg-yellow-100' : ($loop->even ? 'bg-gray-100' : 'bg-gray-50'));
+        if ($this->rowIsSelected($row)) {
+            return config('livewire-datatables.default_classes.row.selected', 'divide-x divide-gray-100 text-sm text-gray-900 bg-yellow-100');
+        } else {
+            if ($loop->even) {
+                return config('livewire-datatables.default_classes.row.even', 'divide-x divide-gray-100 text-sm text-gray-900 bg-gray-100');
+            } else {
+                return config('livewire-datatables.default_classes.row.odd', 'divide-x divide-gray-100 text-sm text-gray-900 bg-gray-50');
+            }
+        }
     }
 
     public function cellClasses($row, $column)
     {
         // Override this method with your own method for adding classes to a cell
-        return 'text-sm text-gray-900';
+        return config('livewire-datatables.default_classes.cell', 'text-sm text-gray-900');
     }
 }