From 4be558ac6567dee7911bbe87294ccd817097ace3 Mon Sep 17 00:00:00 2001
From: Mohamed Said <themohamedsaid@gmail.com>
Date: Wed, 20 Dec 2017 21:14:56 +0200
Subject: [PATCH]     switch to bootstrap4

---
 package.json                          |  3 ++-
 resources/assets/js/bootstrap.js      |  3 ++-
 resources/assets/sass/_variables.scss | 21 ---------------------
 resources/assets/sass/app.scss        |  7 ++++++-
 4 files changed, 10 insertions(+), 24 deletions(-)

diff --git a/package.json b/package.json
index 7ceac0ea..34642909 100644
--- a/package.json
+++ b/package.json
@@ -11,7 +11,8 @@
     },
     "devDependencies": {
         "axios": "^0.17",
-        "bootstrap-sass": "^3.3.7",
+        "bootstrap": "^4.0.0-beta.2",
+        "popper.js": "^1.12",
         "cross-env": "^5.1",
         "jquery": "^3.2",
         "laravel-mix": "^1.0",
diff --git a/resources/assets/js/bootstrap.js b/resources/assets/js/bootstrap.js
index 8e0f04e5..a14b1363 100644
--- a/resources/assets/js/bootstrap.js
+++ b/resources/assets/js/bootstrap.js
@@ -1,5 +1,6 @@
 
 window._ = require('lodash');
+window.Popper = require('popper.js').default;
 
 /**
  * We'll load jQuery and the Bootstrap jQuery plugin which provides support
@@ -10,7 +11,7 @@ window._ = require('lodash');
 try {
     window.$ = window.jQuery = require('jquery');
 
-    require('bootstrap-sass');
+    require('bootstrap');
 } catch (e) {}
 
 /**
diff --git a/resources/assets/sass/_variables.scss b/resources/assets/sass/_variables.scss
index 53202ac1..f4da8869 100644
--- a/resources/assets/sass/_variables.scss
+++ b/resources/assets/sass/_variables.scss
@@ -2,24 +2,8 @@
 // Body
 $body-bg: #f5f8fa;
 
-// Borders
-$laravel-border-color: darken($body-bg, 10%);
-$list-group-border: $laravel-border-color;
-$navbar-default-border: $laravel-border-color;
-$panel-default-border: $laravel-border-color;
-$panel-inner-border: $laravel-border-color;
-
-// Brands
-$brand-primary: #3097D1;
-$brand-info: #8eb4cb;
-$brand-success: #2ab27b;
-$brand-warning: #cbb956;
-$brand-danger: #bf5329;
-
 // Typography
-$icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/";
 $font-family-sans-serif: "Raleway", sans-serif;
-$font-size-base: 14px;
 $line-height-base: 1.6;
 $text-color: #636b6f;
 
@@ -29,10 +13,5 @@ $navbar-default-bg: #fff;
 // Buttons
 $btn-default-color: $text-color;
 
-// Inputs
-$input-border: lighten($text-color, 40%);
-$input-border-focus: lighten($brand-primary, 25%);
-$input-color-placeholder: lighten($text-color, 30%);
-
 // Panels
 $panel-default-heading-bg: #fff;
diff --git a/resources/assets/sass/app.scss b/resources/assets/sass/app.scss
index 1bbc5508..33a1e2b0 100644
--- a/resources/assets/sass/app.scss
+++ b/resources/assets/sass/app.scss
@@ -6,4 +6,9 @@
 @import "variables";
 
 // Bootstrap
-@import "~bootstrap-sass/assets/stylesheets/bootstrap";
+@import '~bootstrap/scss/bootstrap';
+
+.navbar-laravel{
+  background-color: #fff;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
+}