Skip to content

Commit 7a0d0f4

Browse files
michaeldyryndamichaeldyrynda
authored
Merge pull request #37 from laravel-frontend-presets/chore/laravel-5.7-support
Laravel 5.7 support
2 parents 354dcfb + 745de29 commit 7a0d0f4

File tree

13 files changed

+79
-48
lines changed

13 files changed

+79
-48
lines changed

‎README.md

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
# Laravel 5.5+ Frontend preset for Tailwind CSS
1+
# Laravel 5.7+ Frontend preset for Tailwind CSS
22

33
A Laravel front-end scaffolding preset for [Tailwind CSS](https://tailwindcss.com) - a Utility-First CSS Framework for Rapid UI Development.
44

5-
*Current version:* **Tailwind CSS 0.6.4**
5+
*Current version:* **Tailwind CSS 0.6.5**
66

77
## Usage
88

9-
1. Fresh install Laravel >= 5.5.0 and cd to your app.
9+
1. Fresh install Laravel >= 5.7.0 and cd to your app.
1010
2. Install this preset via `composer require laravel-frontend-presets/tailwindcss`. Laravel will automatically discover this package. No need to register the service provider.
1111
3. Use `php artisan preset tailwindcss` for the basic Tailwind CSS preset OR use `php artisan preset tailwindcss-auth` for the basic preset, auth route entry and Tailwind CSS auth views in one go. (NOTE: If you run this command several times, be sure to clean up the duplicate Auth entries in `routes/web.php`)
1212
4. `npm install && npm run dev && npm run dev` (this is required twice, due to the way that `laravel-mix-tailwind` installs the Tailwind CSS dependency)
@@ -31,3 +31,5 @@ The default `tailwind.js` configuration file included by this package simply use
3131
![Reset Password](/screenshots/reset-password.png)
3232

3333
![Dashboard](/screenshots/dashboard.png)
34+
35+
![Verify](/screenshots/verify.png)

‎screenshots/verify.png

18.1 KB
Loading

‎src/TailwindCssPreset.php

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -28,37 +28,38 @@ protected static function updatePackageArray(array $packages)
2828
{
2929
return array_merge([
3030
'laravel-mix' => '^2.1',
31-
'laravel-mix-purgecss' => '^2.0',
31+
'laravel-mix-purgecss' => '^2.2',
3232
'laravel-mix-tailwind' => '^0.1.0',
3333
], Arr::except($packages, [
3434
'bootstrap',
3535
'bootstrap-sass',
3636
'laravel-mix',
3737
'jquery',
38-
'popper.js',
3938
]));
4039
}
4140

4241
protected static function updateStyles()
4342
{
4443
tap(new Filesystem, function ($filesystem) {
45-
$filesystem->deleteDirectory(resource_path('assets/sass'));
44+
$filesystem->deleteDirectory(resource_path('sass'));
4645
$filesystem->delete(public_path('js/app.js'));
4746
$filesystem->delete(public_path('css/app.css'));
4847

49-
if (! $filesystem->isDirectory($directory = resource_path('assets/css'))) {
48+
if (! $filesystem->isDirectory($directory = resource_path('css'))) {
5049
$filesystem->makeDirectory($directory, 0755, true);
5150
}
5251
});
5352

54-
copy(__DIR__.'/tailwindcss-stubs/resources/assets/css/app.css', resource_path('assets/css/app.css'));
53+
copy(__DIR__.'/tailwindcss-stubs/resources/css/app.css', resource_path('css/app.css'));
5554
}
5655

5756
protected static function updateBootstrapping()
5857
{
5958
copy(__DIR__.'/tailwindcss-stubs/tailwind.js', base_path('tailwind.js'));
59+
6060
copy(__DIR__.'/tailwindcss-stubs/webpack.mix.js', base_path('webpack.mix.js'));
61-
copy(__DIR__.'/tailwindcss-stubs/resources/assets/js/bootstrap.js', resource_path('assets/js/bootstrap.js'));
61+
62+
copy(__DIR__.'/tailwindcss-stubs/resources/js/bootstrap.js', resource_path('js/bootstrap.js'));
6263
}
6364

6465
protected static function updateWelcomePage()

‎src/TailwindCssPresetServiceProvider.php

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,14 +13,14 @@ public function boot()
1313
TailwindCssPreset::install();
1414

1515
$command->info('Tailwind CSS scaffolding installed successfully.');
16-
$command->info('Please run "npm install && npm run dev && npm run dev" to compile your fresh scaffolding.');
16+
$command->info('Please run "npm install && npm run dev" to compile your fresh scaffolding.');
1717
});
1818

1919
PresetCommand::macro('tailwindcss-auth', function ($command) {
2020
TailwindCssPreset::installAuth();
2121

2222
$command->info('Tailwind CSS scaffolding with auth views installed successfully.');
23-
$command->info('Please run "npm install && npm run dev && npm run dev" to compile your fresh scaffolding.');
23+
$command->info('Please run "npm install && npm run dev" to compile your fresh scaffolding.');
2424
});
2525
}
2626
}

‎src/tailwindcss-stubs/resources/assets/css/app.css renamed to ‎src/tailwindcss-stubs/resources/css/app.css

File renamed without changes.

‎src/tailwindcss-stubs/resources/assets/js/bootstrap.js renamed to ‎src/tailwindcss-stubs/resources/js/bootstrap.js

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,15 @@
1-
window._ = require("lodash");
1+
window._ = require('lodash');
2+
window.Popper = require('popper.js').default;
23

34
/**
45
* We'll load the axios HTTP library which allows us to easily issue requests
56
* to our Laravel back-end. This library automatically handles sending the
67
* CSRF token as a header based on the value of the "XSRF" token cookie.
78
*/
89

9-
window.axios = require("axios");
10+
window.axios = require('axios');
1011

11-
window.axios.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest";
12+
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
1213

1314
/**
1415
* Next we will register the CSRF Token as a common header with Axios so that
@@ -19,11 +20,9 @@ window.axios.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest";
1920
let token = document.head.querySelector('meta[name="csrf-token"]');
2021

2122
if (token) {
22-
window.axios.defaults.headers.common["X-CSRF-TOKEN"] = token.content;
23+
window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
2324
} else {
24-
console.error(
25-
"CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token"
26-
);
25+
console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
2726
}
2827

2928
/**
@@ -38,5 +37,7 @@ if (token) {
3837

3938
// window.Echo = new Echo({
4039
// broadcaster: 'pusher',
41-
// key: 'your-pusher-key'
40+
// key: process.env.MIX_PUSHER_APP_KEY,
41+
// cluster: process.env.MIX_PUSHER_APP_CLUSTER,
42+
// encrypted: true
4243
// });

‎src/tailwindcss-stubs/resources/views/auth/login.blade.php

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,22 +5,22 @@
55
<div class="w-full max-w-md md:mx-auto">
66
<div class="rounded shadow">
77
<div class="font-medium text-lg text-teal-darker bg-teal p-3 rounded-t">
8-
Login
8+
{{ __('Login') }}
99
</div>
1010
<div class="bg-white p-3 rounded-b">
1111
<form class="form-horizontal" method="POST" action="{{ route('login') }}">
1212
{{ csrf_field() }}
1313

1414
<div class="flex items-stretch mb-3">
15-
<label for="email" class="text-right font-semibold text-grey-dark text-sm pt-2 pr-3 align-middle w-1/4">E-Mail Address</label>
15+
<label for="email" class="text-right font-semibold text-grey-dark text-sm pt-2 pr-3 align-middle w-1/4">{{ __('E-Mail Address') }}</label>
1616
<div class="flex flex-col w-3/4">
1717
<input id="email" type="email" class="flex-grow h-8 px-2 border rounded {{ $errors->has('email') ? 'border-red-dark' : 'border-grey-light' }}" name="email" value="{{ old('email') }}" required autofocus>
1818
{!! $errors->first('email', '<span class="text-red-dark text-sm mt-2">:message</span>') !!}
1919
</div>
2020
</div>
2121

2222
<div class="flex items-stretch mb-4">
23-
<label for="password" class="text-right font-semibold text-grey-dark text-sm pt-2 pr-3 align-middle w-1/4">Password</label>
23+
<label for="password" class="text-right font-semibold text-grey-dark text-sm pt-2 pr-3 align-middle w-1/4">{{ __('Password') }}</label>
2424
<div class="flex flex-col w-3/4">
2525
<input id="password" type="password" class="flex-grow h-8 px-2 rounded border {{ $errors->has('password') ? 'border-red-dark' : 'border-grey-light' }}" name="password" required>
2626
{!! $errors->first('password', '<span class="text-red-dark text-sm mt-2">:message</span>') !!}
@@ -29,17 +29,17 @@
2929

3030
<div class="flex mb-4">
3131
<label class="w-3/4 ml-auto">
32-
<input type="checkbox" name="remember" {{ old('remember') ? 'checked' : '' }}> <span class="text-sm text-grey-dark"> Remember Me</span>
32+
<input type="checkbox" name="remember" {{ old('remember') ? 'checked' : '' }}> <span class="text-sm text-grey-dark"> {{ __('Remember Me') }}</span>
3333
</label>
3434
</div>
3535

3636
<div class="flex">
3737
<div class="w-3/4 ml-auto">
3838
<button type="submit" class="bg-teal hover:bg-teal-dark text-white text-sm font-semibold py-2 px-4 rounded mr-3">
39-
Login
39+
{{ __('Login') }}
4040
</button>
4141
<a class="no-underline hover:underline text-teal-darker text-sm" href="{{ route('password.request') }}">
42-
Forgot Your Password?
42+
{{ __('Forgot Your Password?') }}
4343
</a>
4444
</div>
4545
</div>

‎src/tailwindcss-stubs/resources/views/auth/passwords/email.blade.php

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<div class="md:w-1/2 md:mx-auto">
66
<div class="rounded shadow">
77
<div class="font-medium text-lg text-teal-darker bg-teal p-3 rounded-t">
8-
Reset Password
8+
{{ __('Reset Password') }}
99
</div>
1010
<div class="bg-white p-3 rounded-b">
1111
@if (session('status'))
@@ -18,7 +18,7 @@
1818
{{ csrf_field() }}
1919

2020
<div class="flex items-stretch mb-3">
21-
<label for="email" class="text-right font-semibold text-grey-dark text-sm pt-2 pr-3 align-middle w-1/4">E-Mail Address</label>
21+
<label for="email" class="text-right font-semibold text-grey-dark text-sm pt-2 pr-3 align-middle w-1/4">{{ __('E-Mail Address') }}</label>
2222
<div class="flex flex-col w-3/4">
2323
<input id="email" type="email" class="flex-grow h-8 px-2 border rounded {{ $errors->has('email') ? 'border-red-dark' : 'border-grey-light' }}" name="email" value="{{ old('email') }}" required autofocus>
2424
{!! $errors->first('email', '<span class="text-red-dark text-sm mt-2">:message</span>') !!}
@@ -28,7 +28,7 @@
2828
<div class="flex">
2929
<div class="w-3/4 ml-auto">
3030
<button type="submit" class="bg-teal hover:bg-teal-dark text-white text-sm font-semibold py-2 px-4 rounded mr-3">
31-
Send Password Reset Link
31+
{{ __('Send Password Reset Link') }}
3232
</button>
3333
</div>
3434
</div>

‎src/tailwindcss-stubs/resources/views/auth/passwords/reset.blade.php

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<div class="md:w-1/2 md:mx-auto">
66
<div class="rounded shadow">
77
<div class="font-medium text-lg text-teal-darker bg-teal p-3 rounded-t">
8-
Reset Password
8+
{{ __('Reset Password') }}
99
</div>
1010
<div class="bg-white p-3 rounded-b">
1111
<form class="form-horizontal" method="POST" action="{{ route('password.request') }}">
@@ -14,23 +14,23 @@
1414
<input type="hidden" name="token" value="{{ $token }}">
1515

1616
<div class="flex items-stretch mb-3">
17-
<label for="email" class="text-right font-semibold text-grey-dark text-sm pt-2 pr-3 align-middle w-1/4">E-Mail Address</label>
17+
<label for="email" class="text-right font-semibold text-grey-dark text-sm pt-2 pr-3 align-middle w-1/4">{{ __('E-Mail Address') }}</label>
1818
<div class="flex flex-col w-3/4">
1919
<input id="email" type="email" class="flex-grow h-8 px-2 border rounded {{ $errors->has('email') ? 'border-red-dark' : 'border-grey-light' }}" name="email" value="{{ $email or old('email') }}" required autofocus>
2020
{!! $errors->first('email', '<span class="text-red-dark text-sm mt-2">:message</span>') !!}
2121
</div>
2222
</div>
2323

2424
<div class="flex items-stretch mb-3">
25-
<label for="password" class="text-right font-semibold text-grey-dark text-sm pt-2 pr-3 align-middle w-1/4">Password</label>
25+
<label for="password" class="text-right font-semibold text-grey-dark text-sm pt-2 pr-3 align-middle w-1/4">{{ __('Password') }}</label>
2626
<div class="flex flex-col w-3/4">
2727
<input id="password" type="password" class="flex-grow h-8 px-2 rounded border {{ $errors->has('password') ? 'border-red-dark' : 'border-grey-light' }}" name="password" required>
2828
{!! $errors->first('password', '<span class="text-red-dark text-sm mt-2">:message</span>') !!}
2929
</div>
3030
</div>
3131

3232
<div class="flex items-stretch mb-3">
33-
<label for="password_confirmation" class="text-right font-semibold text-grey-dark text-sm pt-2 pr-3 align-middle w-1/4">Confirm Password</label>
33+
<label for="password_confirmation" class="text-right font-semibold text-grey-dark text-sm pt-2 pr-3 align-middle w-1/4">{{ __('Confirm Password') }}</label>
3434
<div class="flex flex-col w-3/4">
3535
<input id="password_confirmation" type="password" class="flex-grow h-8 px-2 rounded border {{ $errors->has('password_confirmation') ? 'border-red-dark' : 'border-grey-light' }}" name="password_confirmation" required>
3636
{!! $errors->first('password_confirmation', '<span class="text-red-dark text-sm mt-2">:message</span>') !!}
@@ -40,7 +40,7 @@
4040
<div class="flex">
4141
<div class="w-3/4 ml-auto">
4242
<button type="submit" class="bg-teal hover:bg-teal-dark text-white text-sm font-semibold py-2 px-4 rounded mr-3">
43-
Reset Password
43+
{{ __('Reset Password') }}
4444
</button>
4545
</div>
4646
</div>

‎src/tailwindcss-stubs/resources/views/auth/verify.blade.php

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
@extends('layouts.app')
2+
3+
@section('content')
4+
<div class="flex items-center">
5+
<div class="md:w-1/2 md:mx-auto">
6+
<div class="rounded shadow">
7+
<div class="font-medium text-lg text-teal-darker bg-teal p-3 rounded-t">
8+
{{ __('Verify your Email Address') }}
9+
</div>
10+
<div class="bg-white p-3 rounded-b">
11+
@if (session('resent'))
12+
<div class="bg-green-lightest border border-green-light text-green-dark text-sm px-4 py-3 rounded mb-4">
13+
{{ __('A fresh verification link has been sent to your email address.') }}
14+
</div>
15+
@endif
16+
17+
<p class="text-grey-dark">
18+
{{ __('Before proceeding, please check your email for a verification link.') }}
19+
{{ __('If you did not receive the email') }}, <a href="{{ route('verification.resend') }}" class="no-underline hover:underline text-teal-darker">{{ __('click here to request another') }}</a>.
20+
</p>
21+
</div>
22+
</div>
23+
</div>
24+
</div>
25+
@endsection

‎src/tailwindcss-stubs/resources/views/layouts/app.blade.php

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
1-
<!DOCTYPE html>
1+
<!doctype html>
22
<html lang="{{ app()->getLocale() }}">
33
<head>
44
<meta charset="utf-8">
5-
<meta http-equiv="X-UA-Compatible" content="IE=edge">
65
<meta name="viewport" content="width=device-width, initial-scale=1">
76

87
<!-- CSRF Token -->
@@ -11,7 +10,7 @@
1110
<title>{{ config('app.name', 'Laravel') }}</title>
1211

1312
<!-- Styles -->
14-
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
13+
<link href="{{ mix('css/app.css') }}" rel="stylesheet">
1514
</head>
1615
<body class="bg-teal-lightest h-screen antialiased">
1716
<div id="app">
@@ -25,15 +24,15 @@
2524
</div>
2625
<div class="flex-1 text-right">
2726
@guest
28-
<a class="no-underline hover:underline text-teal-darker pr-3 text-sm" href="{{ url('/login') }}">Login</a>
29-
<a class="no-underline hover:underline text-teal-darker text-sm" href="{{ url('/register') }}">Register</a>
27+
<a class="no-underline hover:underline text-teal-darker pr-3 text-sm" href="{{ url('/login') }}">{{ __('Login') }}</a>
28+
<a class="no-underline hover:underline text-teal-darker text-sm" href="{{ url('/register') }}">{{ __('Register') }}</a>
3029
@else
3130
<span class="text-teal-darker text-sm pr-4">{{ Auth::user()->name }}</span>
3231

3332
<a href="{{ route('logout') }}"
3433
class="no-underline hover:underline text-teal-darker text-sm"
3534
onclick="event.preventDefault();
36-
document.getElementById('logout-form').submit();">Logout</a>
35+
document.getElementById('logout-form').submit();">{{ __('Logout') }}</a>
3736
<form id="logout-form" action="{{ route('logout') }}" method="POST" class="hidden">
3837
{{ csrf_field() }}
3938
</form>
@@ -47,6 +46,6 @@ class="no-underline hover:underline text-teal-darker text-sm"
4746
</div>
4847

4948
<!-- Scripts -->
50-
<script src="{{ asset('js/app.js') }}"></script>
49+
<script src="{{ mix('js/app.js') }}"></script>
5150
</body>
5251
</html>

‎src/tailwindcss-stubs/resources/views/welcome.blade.php

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18,10 +18,10 @@
1818
@if(Route::has('login'))
1919
<div class="absolute pin-t pin-r mt-4 mr-4">
2020
@auth
21-
<a href="{{ url('/home') }}" class="no-underline hover:underline text-sm font-normal text-teal-darker uppercase">Home</a>
21+
<a href="{{ url('/home') }}" class="no-underline hover:underline text-sm font-normal text-teal-darker uppercase">{{ __('Home') }}</a>
2222
@else
23-
<a href="{{ route('login') }}" class="no-underline hover:underline text-sm font-normal text-teal-darker uppercase pr-6">Login</a>
24-
<a href="{{ route('register') }}" class="no-underline hover:underline text-sm font-normal text-teal-darker uppercase">Register</a>
23+
<a href="{{ route('login') }}" class="no-underline hover:underline text-sm font-normal text-teal-darker uppercase pr-6">{{ __('Login') }}</a>
24+
<a href="{{ route('register') }}" class="no-underline hover:underline text-sm font-normal text-teal-darker uppercase">{{ __('Register') }}</a>
2525
@endauth
2626
</div>
2727
@endif
@@ -42,6 +42,9 @@
4242
<li class="inline pr-8">
4343
<a href="https://laravel-news.com" class="no-underline hover:underline text-sm font-normal text-teal-darker uppercase" title="News">News</a>
4444
</li>
45+
<li class="inline pr-8">
46+
<a href="https://nova.laravel.com" class="no-underline hover:underline text-sm font-normal text-teal-darker uppercase" title="Nova">Nova</a>
47+
</li>
4548
<li class="inline pr-8">
4649
<a href="https://forge.laravel.com" class="no-underline hover:underline text-sm font-normal text-teal-darker uppercase" title="Forge">Forge</a>
4750
</li>

‎src/tailwindcss-stubs/webpack.mix.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
let mix = require("laravel-mix");
1+
const mix = require('laravel-mix');
22

3-
require("laravel-mix-tailwind");
4-
require("laravel-mix-purgecss");
3+
require('laravel-mix-tailwind');
4+
require('laravel-mix-purgecss');
55

66
/*
77
|--------------------------------------------------------------------------
@@ -14,8 +14,8 @@ require("laravel-mix-purgecss");
1414
|
1515
*/
1616

17-
mix.js("resources/assets/js/app.js", "public/js")
18-
.postCss("resources/assets/css/app.css", "public/css")
17+
mix.js('resources/js/app.js', 'public/js')
18+
.postCss('resources/css/app.css', 'public/css')
1919
.tailwind()
2020
.purgeCss();
2121

0 commit comments

Comments
 (0)