Skip to content

Commit 23d9f0f

Browse files
lrljoelrljoe
committed
Tailwind4 Starting Point
1 parent f384ac7 commit 23d9f0f

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

61 files changed

+230
-458
lines changed

‎resources/views/components/bulk-actions/td.blade.php‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<x-livewire-tables::table.td.plain wire:key="{{ $tableName }}-tbody-td-bulk-actions-td-{{ $rowPk }}" :displayMinimisedOnReorder="true" :customAttributes=$bulkActionsTdAttributes>
44
<div @class([
55
'inline-flex rounded-md shadow-sm' => $isTailwind,
6-
'inline-flex rounded-md shadow-sm' => $isTailwind4,
6+
'tw4ph inline-flex rounded-md shadow-sm' => $isTailwind4,
77
'form-check' => $isBootstrap,
88
])>
99
<x-livewire-tables::forms.checkbox

‎resources/views/components/bulk-actions/th.blade.php‎

Lines changed: 5 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@aware(['tableName','isTailwind', 'isBootstrap'])
1+
@aware(['tableName','isTailwind', 'isTailwind4', 'isBootstrap'])
22
@php
33
$customAttributes = $this->hasBulkActionsThAttributes() ? $this->getBulkActionsThAttributes() : $this->getAllThAttributes($this->getBulkActionsColumn())['customAttributes'];
44
$bulkActionsThCheckboxAttributes = $this->getBulkActionsThCheckboxAttributes();
@@ -8,23 +8,17 @@
88
<div x-init="$watch('selectedItems', value => indeterminateCheckbox = (value.length > 0 && value.length < paginationTotalItemCount))"
99
@class([
1010
'inline-flex rounded-md shadow-sm' => $isTailwind,
11-
'inline-flex rounded-md shadow-sm' => $isTailwind4,
11+
'tw4ph inline-flex rounded-md shadow-sm' => $isTailwind4,
1212
'form-check' => $isBootstrap,
1313
])
1414
>
1515
<input {{
1616
$attributes->merge($bulkActionsThCheckboxAttributes)
17-
->class(
18-
[
19-
// Tailwind3
17+
->class([
2018
'border-gray-300 text-indigo-600 focus:border-indigo-300 focus:ring-indigo-200 dark:bg-gray-900 dark:text-white dark:border-gray-600 dark:hover:bg-gray-600 dark:focus:bg-gray-600' => $isTailwind && ($bulkActionsThCheckboxAttributes['default-colors'] ?? ($bulkActionsThCheckboxAttributes['default'] ?? true)),
2119
'rounded shadow-sm transition duration-150 ease-in-out focus:ring focus:ring-opacity-50 ' => $isTailwind && ($bulkActionsThCheckboxAttributes['default-styling'] ?? ($bulkActionsThCheckboxAttributes['default'] ?? true)),
22-
23-
// Tailwind4
24-
'border-gray-300 text-indigo-600 focus:border-indigo-300 focus:ring-indigo-200 dark:bg-gray-900 dark:text-white dark:border-gray-600 dark:hover:bg-gray-600 dark:focus:bg-gray-600' => $isTailwind4 && ($bulkActionsThCheckboxAttributes['default-colors'] ?? ($bulkActionsThCheckboxAttributes['default'] ?? true)),
25-
'rounded shadow-sm transition duration-150 ease-in-out focus:ring focus:ring-opacity-50 ' => $isTailwind4 && ($bulkActionsThCheckboxAttributes['default-styling'] ?? ($bulkActionsThCheckboxAttributes['default'] ?? true)),
26-
27-
// Bootstrap
20+
'tw4ph border-gray-300 text-indigo-600 focus:border-indigo-300 focus:ring-indigo-200 dark:bg-gray-900 dark:text-white dark:border-gray-600 dark:hover:bg-gray-600 dark:focus:bg-gray-600' => $isTailwind4 && ($bulkActionsThCheckboxAttributes['default-colors'] ?? ($bulkActionsThCheckboxAttributes['default'] ?? true)),
21+
'tw4ph rounded shadow-sm transition duration-150 ease-in-out focus:ring focus:ring-opacity-50 ' => $isTailwind4 && ($bulkActionsThCheckboxAttributes['default-styling'] ?? ($bulkActionsThCheckboxAttributes['default'] ?? true)),
2822
'form-check-input' => $isBootstrap && ($bulkActionsThCheckboxAttributes['default-styling'] ?? ($bulkActionsThCheckboxAttributes['default'] ?? true)),
2923
])
3024
->except(['default','default-styling','default-colors'])

‎resources/views/components/bulk-actions/thead/button.blade.php‎

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -8,15 +8,10 @@
88
->merge($bulkActionsRowButtonAttributes)
99
->class(
1010
[
11-
// Tailwind3
1211
'ml-1 underline text-sm leading-5 font-medium focus:outline-none focus:underline transition duration-150 ease-in-out' => $isTailwind && ($bulkActionsRowButtonAttributes['default-styling'] ?? true),
1312
'text-blue-600 text-gray-700 focus:text-gray-800 dark:text-white dark:hover:text-gray-400' => $isTailwind && ($bulkActionsRowButtonAttributes['default-colors'] ?? true),
14-
15-
// Tailwind4
16-
'ml-1 underline text-sm leading-5 font-medium focus:outline-none focus:underline transition duration-150 ease-in-out' => $isTailwind4 && ($bulkActionsRowButtonAttributes['default-styling'] ?? true),
17-
'text-blue-600 text-gray-700 focus:text-gray-800 dark:text-white dark:hover:text-gray-400' => $isTailwind4 && ($bulkActionsRowButtonAttributes['default-colors'] ?? true),
18-
19-
// Bootstrap
13+
'tw4ph ml-1 underline text-sm leading-5 font-medium focus:outline-none focus:underline transition duration-150 ease-in-out' => $isTailwind4 && ($bulkActionsRowButtonAttributes['default-styling'] ?? true),
14+
'tw4ph text-blue-600 text-gray-700 focus:text-gray-800 dark:text-white dark:hover:text-gray-400' => $isTailwind4 && ($bulkActionsRowButtonAttributes['default-colors'] ?? true),
2015
'btn btn-primary btn-sm' => $isBootstrap && ($bulkActionsRowButtonAttributes['default-styling'] ?? true)
2116
]
2217
)

‎resources/views/components/bulk-actions/thead/thead.blade.php‎

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -11,13 +11,8 @@
1111
'wire:key' => $this->getTableName() ."-bulk-select-message",
1212
'x-cloak' => ''])
1313
->class([
14-
// Tailwind3
1514
'unsortable laravel-livewire-tables-reorderingMinimised bg-indigo-50 dark:bg-gray-900 dark:text-white' => $isTailwind,
16-
17-
// Tailwind4
18-
'unsortable laravel-livewire-tables-reorderingMinimised bg-indigo-50 dark:bg-gray-900 dark:text-white' => $isTailwind4,
19-
20-
// Bootstrap
15+
'tw4ph unsortable laravel-livewire-tables-reorderingMinimised bg-indigo-50 dark:bg-gray-900 dark:text-white' => $isTailwind4,
2116
'laravel-livewire-tables-reorderingMinimised' => $isBootstrap,
2217
'' => $isBootstrap && ($customAttributes['default'] ?? true),
2318
])

‎resources/views/components/bulk-actions/thead/tr.blade.php‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,8 @@
66
'wire:key' => $tableName . "-bulk-select-message",
77
])
88
->class([
9-
//Tailwind3
109
'bg-indigo-50 dark:bg-gray-900 dark:text-white' => $isTailwind,
11-
12-
//Tailwind4
13-
'bg-indigo-50 dark:bg-gray-900 dark:text-white' => $isTailwind4,
10+
'tw4ph bg-indigo-50 dark:bg-gray-900 dark:text-white' => $isTailwind4,
1411
])
1512
}}
1613
>

‎resources/views/components/collapsed-columns/collapsed-columns.blade.php‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,13 +10,9 @@
1010
])
1111
->merge($tableRowDetails['attributes'])
1212
->class([
13-
// Tailwind3
1413
'hidden rappasoft-striped-row' => $isTailwind && ($tableRowDetails['attributes']['default'] ?? true),
1514
16-
// Tailwind4
17-
'hidden rappasoft-striped-row' => $isTailwind4 && ($tableRowDetails['attributes']['default'] ?? true),
1815
19-
// Bootstrap
2016
'd-none bg-light rappasoft-striped-row' => $isBootstrap && ($rowIndex % 2 === 0 && ($tableRowDetails['attributes']['default'] ?? true)),
2117
'd-none bg-white rappasoft-striped-row' => $isBootstrap && ($rowIndex % 2 !== 0 && ($tableRowDetails['attributes']['default'] ?? true)),
2218
@@ -26,7 +22,6 @@
2622
>
2723
<td colspan="{{ $collapsingColumnInfo['colspanCount'] }}" @class([
2824
'text-left pt-4 pb-2 px-4' => $isTailwind,
29-
'text-left pt-4 pb-2 px-4' => $isTailwind4,
3025
'text-start pt-3 p-2' => $isBootstrap,
3126
])>
3227
<div >

‎resources/views/components/collapsed-columns/td.blade.php‎

Lines changed: 0 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -6,19 +6,11 @@
66
$attributes
77
->merge()
88
->class([
9-
// Tailwind 3
109
'p-3 table-cell text-center' => $isTailwind,
1110
'sm:hidden' => $isTailwind && (!($collapsingColumnInfo['shouldCollapseAlways'] ?? false) && !($collapsingColumnInfo['shouldCollapseOnTablet'] ?? false)),
1211
'md:hidden' => $isTailwind && (!($collapsingColumnInfo['shouldCollapseAlways'] ?? false) && !($collapsingColumnInfo['shouldCollapseOnTablet'] ?? false) && ($collapsingColumnInfo['shouldCollapseOnMobile'] ?? false)),
1312
'lg:hidden' => $isTailwind && (!($collapsingColumnInfo['shouldCollapseAlways'] ?? false) && (($collapsingColumnInfo['shouldCollapseOnTablet'] ?? false) || ($collapsingColumnInfo['shouldCollapseOnMobile'] ?? false))),
1413
15-
// Tailwind 4
16-
'p-3 table-cell text-center' => $isTailwind4,
17-
'sm:hidden' => $isTailwind4 && (!($collapsingColumnInfo['shouldCollapseAlways'] ?? false) && !($collapsingColumnInfo['shouldCollapseOnTablet'] ?? false)),
18-
'md:hidden' => $isTailwind4 && (!($collapsingColumnInfo['shouldCollapseAlways'] ?? false) && !($collapsingColumnInfo['shouldCollapseOnTablet'] ?? false) && ($collapsingColumnInfo['shouldCollapseOnMobile'] ?? false)),
19-
'lg:hidden' => $isTailwind4 && (!($collapsingColumnInfo['shouldCollapseAlways'] ?? false) && (($collapsingColumnInfo['shouldCollapseOnTablet'] ?? false) || ($collapsingColumnInfo['shouldCollapseOnMobile'] ?? false))),
20-
21-
// Bootstrap
2214
'd-sm-none' => $isBootstrap && (!($collapsingColumnInfo['shouldCollapseAlways'] ?? false) && !($collapsingColumnInfo['shouldCollapseOnTablet'] ?? false)),
2315
'd-md-none' => $isBootstrap && (!($collapsingColumnInfo['shouldCollapseAlways'] ?? false) && !($collapsingColumnInfo['shouldCollapseOnTablet'] ?? false) && ($collapsingColumnInfo['shouldCollapseOnMobile'] ?? false)),
2416
'd-lg-none' => $isBootstrap && (!($collapsingColumnInfo['shouldCollapseAlways'] ?? false) && (($collapsingColumnInfo['shouldCollapseOnTablet'] ?? false) || ($collapsingColumnInfo['shouldCollapseOnMobile'] ?? false))),
@@ -40,15 +32,9 @@
4032
<x-heroicon-o-plus-circle x-cloak x-show="!open" {{
4133
$attributes->merge($collapsingColumnInfo['buttonExpandAttributes'])
4234
->class([
43-
// Tailwind 3
4435
'h-6 w-6' => $isTailwind && ($collapsingColumnInfo['buttonExpandAttributes']['default-styling'] ?? true),
4536
'text-green-600' => $isTailwind && ($collapsingColumnInfo['buttonExpandAttributes']['default-colors'] ?? true),
4637
47-
// Tailwind 4
48-
'h-6 w-6' => $isTailwind4 && ($collapsingColumnInfo['buttonExpandAttributes']['default-styling'] ?? true),
49-
'text-green-600' => $isTailwind4 && ($collapsingColumnInfo['buttonExpandAttributes']['default-colors'] ?? true),
50-
51-
// Bootstrap
5238
'laravel-livewire-tables-btn-lg text-success' => $isBootstrap && ($collapsingColumnInfo['buttonExpandAttributes']['default-colors'] ?? true),
5339
])
5440
->except(['default','default-styling','default-colors'])
@@ -57,15 +43,10 @@
5743
<x-heroicon-o-minus-circle x-cloak x-show="open" {{
5844
$attributes->merge($collapsingColumnInfo['buttonCollapseAttributes'])
5945
->class([
60-
// Tailwind 3
6146
'h-6 w-6' => $isTailwind && ($collapsingColumnInfo['buttonCollapseAttributes']['default-styling'] ?? true),
6247
'text-yellow-600' => $isTailwind && ($collapsingColumnInfo['buttonCollapseAttributes']['default-colors'] ?? true),
6348
64-
// Tailwind 4
65-
'h-6 w-6' => $isTailwind4 && ($collapsingColumnInfo['buttonCollapseAttributes']['default-styling'] ?? true),
66-
'text-yellow-600' => $isTailwind4 && ($collapsingColumnInfo['buttonCollapseAttributes']['default-colors'] ?? true),
6749
68-
// Bootstrap
6950
'laravel-livewire-tables-btn-lg text-warning' => $isBootstrap && ($collapsingColumnInfo['buttonCollapseAttributes']['default-colors'] ?? true),
7051
])
7152
->except(['default','default-styling','default-colors'])

‎resources/views/components/collapsed-columns/th.blade.php‎

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,19 +3,11 @@
33
<th scope="col" :class="{ 'laravel-livewire-tables-reorderingMinimised': ! currentlyReorderingStatus }" {{
44
$attributes->merge()
55
->class([
6-
// Tailwind 3
76
'table-cell dark:bg-gray-800 laravel-livewire-tables-reorderingMinimised' => $isTailwind,
87
'sm:hidden' => $isTailwind && (!$collapsingColumnInfo['shouldCollapseOnTablet'] && !$collapsingColumnInfo['shouldCollapseAlways']),
98
'md:hidden' => $isTailwind && (!$collapsingColumnInfo['shouldCollapseOnMobile'] && !$collapsingColumnInfo['shouldCollapseOnTablet'] && !$collapsingColumnInfo['shouldCollapseAlways']),
109
'lg:hidden' => $isTailwind && (!$collapsingColumnInfo['shouldCollapseAlways']),
1110
12-
// Tailwind 4
13-
'table-cell dark:bg-gray-800 laravel-livewire-tables-reorderingMinimised' => $isTailwind4,
14-
'sm:hidden' => $isTailwind4 && (!$collapsingColumnInfo['shouldCollapseOnTablet'] && !$collapsingColumnInfo['shouldCollapseAlways']),
15-
'md:hidden' => $isTailwind4 && (!$collapsingColumnInfo['shouldCollapseOnMobile'] && !$collapsingColumnInfo['shouldCollapseOnTablet'] && !$collapsingColumnInfo['shouldCollapseAlways']),
16-
'lg:hidden' => $isTailwind4 && (!$collapsingColumnInfo['shouldCollapseAlways']),
17-
18-
// Bootstrap
1911
'd-table-cell laravel-livewire-tables-reorderingMinimised' => $isBootstrap,
2012
'd-sm-none' => $isBootstrap && (!$collapsingColumnInfo['shouldCollapseOnTablet'] && !$collapsingColumnInfo['shouldCollapseAlways']),
2113
'd-md-none' => $isBootstrap && (!$collapsingColumnInfo['shouldCollapseOnMobile'] && !$collapsingColumnInfo['shouldCollapseOnTablet']) && !$collapsingColumnInfo['shouldCollapseAlways'],

‎resources/views/components/collapsed-columns/tr.blade.php‎

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -10,13 +10,8 @@
1010
])
1111
->merge($tableRowDetails['attributes'])
1212
->class([
13-
// Tailwind 3
1413
'hidden rappasoft-striped-row' => $isTailwind && ($tableRowDetails['attributes']['default'] ?? true),
1514
16-
// Tailwind 4
17-
'hidden rappasoft-striped-row' => $isTailwind4 && ($tableRowDetails['attributes']['default'] ?? true),
18-
19-
// Bootstrap
2015
'd-none bg-light rappasoft-striped-row' => $isBootstrap && ($rowIndex % 2 === 0 && ($tableRowDetails['attributes']['default'] ?? true)),
2116
'd-none bg-white rappasoft-striped-row' => $isBootstrap && ($rowIndex % 2 !== 0 && ($tableRowDetails['attributes']['default'] ?? true)),
2217
])
@@ -25,7 +20,6 @@
2520
>
2621
<td colspan="{{ $collapsingColumnInfo['colspanCount'] }}" @class([
2722
'text-left pt-4 pb-2 px-4' => $isTailwind,
28-
'text-left pt-4 pb-2 px-4' => $isTailwind4,
2923
'text-start pt-3 p-2' => $isBootstrap,
3024
])>
3125
<div >

‎resources/views/components/forms/checkbox.blade.php‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@
88
'rounded shadow-sm transition duration-150 ease-in-out focus:ring focus:ring-opacity-50' => $isTailwind && ($checkboxAttributes['default-styling'] ?? ($checkboxAttributes['default'] ?? true)),
99
1010
// Tailwind 4
11-
'border-gray-300 text-indigo-600 focus:border-indigo-300 focus:ring-indigo-200 dark:bg-gray-900 dark:text-white dark:border-gray-600 dark:hover:bg-gray-600 dark:focus:bg-gray-600' => $isTailwind4 && ($checkboxAttributes['default-colors'] ?? ($checkboxAttributes['default'] ?? true)),
12-
'rounded shadow-sm transition duration-150 ease-in-out focus:ring focus:ring-opacity-50' => $isTailwind4 && ($checkboxAttributes['default-styling'] ?? ($checkboxAttributes['default'] ?? true)),
11+
'tw4ph border-gray-300 text-indigo-600 focus:border-indigo-300 focus:ring-indigo-200 dark:bg-gray-900 dark:text-white dark:border-gray-600 dark:hover:bg-gray-600 dark:focus:bg-gray-600' => $isTailwind4 && ($checkboxAttributes['default-colors'] ?? ($checkboxAttributes['default'] ?? true)),
12+
'tw4ph rounded shadow-sm transition duration-150 ease-in-out focus:ring focus:ring-opacity-50' => $isTailwind4 && ($checkboxAttributes['default-styling'] ?? ($checkboxAttributes['default'] ?? true)),
1313
1414
// Bootstrap
1515
'form-check-input' => ($isBootstrap5) && ($checkboxAttributes['default'] ?? true),

0 commit comments

Comments
 (0)