Skip to content
This repository has been archived by the owner on Nov 3, 2021. It is now read-only.

Commit

Permalink
Added native Neutrino UI in place of breeze
Browse files Browse the repository at this point in the history
  • Loading branch information
newelement committed Jan 24, 2021
1 parent be69921 commit da44243
Show file tree
Hide file tree
Showing 21 changed files with 473 additions and 6 deletions.
1 change: 0 additions & 1 deletion composer.json
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,6 @@
"ext-json": "*",
"newelement/searchable": "1.*",
"league/flysystem-aws-s3-v3": "^1.0",
"laravel/ui": ">=1.0",
"newelement/laravel-calendar-event": "0.2.*",
"spatie/laravel-honeypot": "^3.0",
"arrilot/laravel-widgets": "^3.13.0",
Expand Down
91 changes: 86 additions & 5 deletions src/Commands/InstallCommand.php
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,31 @@ public function handle(Filesystem $filesystem)
$this->info('Publishing the Neutrino assets, database, and config files');
// Publish only relevant resources on install

// NPM Packages...
$this->updateNodePackages(function ($packages) {
return [
"axios" => "^0.21",
"bootstrap" => "^4.0.0",
"cross-env" => "^7.0",
"jquery" => "^3.2",
"laravel-mix" => "^5.0.9",
"lodash" => "^4.17.13",
"popper.js" => "^1.12",
"resolve-url-loader" => "^3.1.0",
"sass" => "^1.15.2",
"sass-loader" => "^8.0.0",
"vue-template-compiler" => "^2.6.11",
"@fortawesome/fontawesome-free" => "^5.13.0",
"slick-carousel" => "^1.8.1"
] + $packages;
});

$this->flushNodeModules();

copy(__DIR__.'/../../stubs/webpack.mix.js', base_path('webpack.mix.js'));
(new Filesystem)->copyDirectory(__DIR__.'/../../stubs/resources/sass', resource_path('sass'));
(new Filesystem)->copyDirectory(__DIR__.'/../../stubs/resources/js', resource_path('js'));

$this->call('vendor:publish', ['--provider' => NeutrinoServiceProvider::class]); // , '--tag' => $tags
$this->call('vendor:publish', ['--provider' => 'Newelement\LaravelCalendarEvent\ServiceProvider']);
$this->call('vendor:publish', ['--provider' => 'Intervention\Image\ImageServiceProviderLaravelRecent']);
Expand All @@ -72,15 +97,15 @@ public function handle(Filesystem $filesystem)
file_put_contents($userPath, $str);
}
} else {
$this->warn('Unable to locate "User.php" in app or app/Models. Did you move this file?');
$this->warn('You will need to update this manually. Change "extends Authenticatable" to "extends \Newelement\Neutrino\Models\User" in your User model');
$this->warn('Unable to locate "User.php" in app or app/Models. Did you move this file?');
$this->warn('You will need to update this manually. Change "extends Authenticatable" to "extends \Newelement\Neutrino\Models\User" in your User model');
}

$this->info('Dumping the autoloaded files and reloading all new files');

$composer = $this->findComposer();
$process = new Process([$composer.' dump-autoload']);
$process->setTimeout(null); // Setting timeout to null to prevent installation from stopping at a certain point in time
$process->setTimeout(null);
$process->setWorkingDirectory(base_path())->run();

$this->info('Adding Neutrino routes to routes/web.php');
Expand All @@ -102,7 +127,7 @@ public function handle(Filesystem $filesystem)

$initData = $this->ask('Do you want the initial installation data? HIGHLY recommended for fresh install. [Y/N]');

if( $initData === 'y' || $initData === 'Y' ){
if( strtoupper($initData) === 'Y' ){
$this->info('Seeding data into the database');
$this->seed('NeutrinoDatabaseSeeder');
}
Expand All @@ -112,13 +137,69 @@ public function handle(Filesystem $filesystem)

$initUser = $this->ask('Do you want to create an admin user? HIGHLY recommended for fresh install. [Y/N]');

if( $initUser === 'y' || $initUser === 'Y' ){
if( strtoupper($initUser) === 'Y' ){
$this->call('neutrino:admin');
$this->info('Successfully installed Neutrino. Enjoy!');
$this->comment('Please execute the "npm install && npm run dev" command to build your assets.');
$this->comment('You will also need to update your package.json file and use these scripts: ');
$this->comment('"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --disable-host-check --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
}');
} else {
$this->info('Successfully installed Neutrino. Enjoy!');
$this->info('-> To setup an admin run: `php artisan neutrino:admin` ');
$this->comment('Please execute the "npm install && npm run dev" command to build your assets.');
$this->comment('You will also need to update your package.json file and use these scripts: ');
$this->comment('"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --disable-host-check --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
}');
}

}

protected static function updateNodePackages(callable $callback, $dev = true)
{
if (! file_exists(base_path('package.json'))) {
return;
}

$configurationKey = $dev ? 'devDependencies' : 'dependencies';

$packages = json_decode(file_get_contents(base_path('package.json')), true);

$packages[$configurationKey] = $callback(
array_key_exists($configurationKey, $packages) ? $packages[$configurationKey] : [],
$configurationKey
);

ksort($packages[$configurationKey]);

file_put_contents(
base_path('package.json'),
json_encode($packages, JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT).PHP_EOL
);
}

protected function flushNodeModules()
{
tap(new Filesystem, function ($files) {
$files->deleteDirectory(base_path('node_modules'));

$files->delete(base_path('yarn.lock'));
$files->delete(base_path('package-lock.json'));
});
}

}
20 changes: 20 additions & 0 deletions stubs/resources/js/app.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
require('@fortawesome/fontawesome-free/js/all.js');
import $ from 'jquery';
import slick from 'slick-carousel';

let $q = document.querySelector.bind(document),
$$q = document.querySelectorAll.bind(document);

document.addEventListener("DOMContentLoaded", function(){
if( $('.carousel-slides').length ){
var slickSettings = { dots: true, autoplay: true, autplaySpeed: 3000 };
$('.carousel-slides').slick({
autoplay: slickSettings.autoplay,
autoplaySpeed: slickSettings.autoplaySpeed,
arrows: false,
dots: slickSettings.dots,
appendDots: $q('.carousel-slides .hero-dots'),
pauseOnHover: true
});
}
});
Empty file added stubs/resources/sass/_base.scss
Empty file.
19 changes: 19 additions & 0 deletions stubs/resources/sass/_variables.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
// Body
$body-bg: #f8fafc;

// Typography
$font-family-sans-serif: 'Nunito', sans-serif;
$font-size-base: 0.9rem;
$line-height-base: 1.6;

// Colors
$blue: #3490dc;
$indigo: #6574cd;
$purple: #9561e2;
$pink: #f66d9b;
$red: #e3342f;
$orange: #f6993f;
$yellow: #ffed4a;
$green: #38c172;
$teal: #4dc0b5;
$cyan: #6cb2eb;
39 changes: 39 additions & 0 deletions stubs/resources/sass/app.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
// Fonts
@import url('https://fonts.googleapis.com/css?family=Nunito');
@import "~@fortawesome/fontawesome-free/scss/fontawesome";
@import '~@fortawesome/fontawesome-free/scss/brands';
@import '~@fortawesome/fontawesome-free/scss/regular';

// Variables
@import 'variables';

// Bootstrap
@import '~bootstrap/scss/bootstrap';

// Base - custom resets
@import 'base';

// Globals
@import 'neutrino/globals/globals';

// Components
@import 'neutrino/components/buttons';
@import '~slick-carousel/slick/slick.scss';

// Block editor templates
@import 'neutrino/blocks/carousel';
@import 'neutrino/blocks/columns';
@import 'neutrino/blocks/hero';
@import 'neutrino/blocks/testimonials';
@import 'neutrino/blocks/gallery';
@import 'neutrino/blocks/dividers';

// Partials
@import 'neutrino/partials/header';
@import 'neutrino/partials/nav';
@import 'neutrino/partials/footer';

// Pages
@import 'neutrino/pages/home';
@import 'neutrino/pages/about';
@import 'neutrino/pages/contact';
127 changes: 127 additions & 0 deletions stubs/resources/sass/neutrino/blocks/_carousel.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,127 @@
.carousel{
position: relative;

.dots{
position: absolute;
bottom: 32px;
left: 50%;
transform: translateX(-50%);
z-index: 300;

ul{
display: flex;
padding: 0;
margin: 0;
list-style: none;

li{
margin: 0 4px;
outline: none;
}

button{
appearance: none;
border: 0;
border-radius: 50%;
width: 16px;
height: 16px;
background-color: #fff;
text-index: -9999px;
font-size: 0;
content: '';
transition: background-color .25s ease;
outline: none;

&:hover{
background-color: #b5dbe3;
}
}

li.slick-active{
button{
background-color: #33bfd4;
}
}
}
}


}

.carousel-slides{
position: relative;

.slide{
min-height: 10px !important;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
position: relative;
}

.slide-content{
display: flex;
background-color: rgba(#194F60, .55);
position: absolute;
right: 0;
bottom: 0;
top: 0;
width: 50%;
z-index: 1;

.inner{
padding: 48px 0 24px 54px;

h1, h2, h3, h4{
color: #fff;
font-weight: 700;
font-size: 3.5rem;
line-height: 1.1;
max-width: 460px;
margin-bottom: 24px;
}

p{
max-width: 400px;
font-size: 1.25rem;
color: #fff;

&:last-of-type{
margin-bottom: 0;
}
}
}
}
}

@media( max-width: 960px ){

.carousel-slides .slide{
height: auto !important;
padding: 24px 12px;
}

.carousel-slides .slide-content {
right: auto;
bottom: auto;
top: auto;
left: auto;
width: 100%;
position: static;

.inner{
padding: 24px 12px;
}
}
.carousel-slides .slide-content .inner {
h1 {
font-size: 2rem;
}


h3 *{
font-size: 1.35rem !important;
line-height: 1.2;
}
}
}
17 changes: 17 additions & 0 deletions stubs/resources/sass/neutrino/blocks/_columns.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
.grid-block{
display: flex;
flex-direction: row;
flex-wrap: wrap;
position: relative;
}

.block-columns-row{
display: flex;
flex-direction: row;
flex-wrap: wrap;
position: relative;
}

.flex-col{
min-width: 200px;
}
27 changes: 27 additions & 0 deletions stubs/resources/sass/neutrino/blocks/_dividers.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
.divider-block{
padding: 24px 60px;
background-color: #f3f3f3;
display: flex;
flex-direction: column;
justify-content: center;
position: relative;
}

.divider{
margin-bottom: 32px;

&.center{
justify-content: center;
align-items: center;
}

&.left{
justify-content: start;
align-items: center;
}

&.right{
justify-content: end;
align-items: center;
}
}
Loading

0 comments on commit da44243

Please sign in to comment.