stripe article payement system for not registered users

diff --git a/app/Http/Controllers/Auth/RegisterController.php b/app/Http/Controllers/Auth/RegisterController.php
index 64a7661358d1f4e744058fd281e20f1c35aaeeb5..9539c3a69b05d71f331e37e738ca4fe0acba166d 100644 (file)
--- a/app/Http/Controllers/Auth/RegisterController.php
+++ b/app/Http/Controllers/Auth/RegisterController.php
@@ -45,12 +45,15 @@ class RegisterController extends Controller
     }
 
 
+
     /**
      * @return string
      */
     public function redirectTo()
     {
-        return route('home', ['register' => 'success']);
+        return request()->has('redirect_to') ?
+            request()->input('redirect_to') :
+            route('home', ['register' => 'success']);
     }
 
 

diff --git a/app/Http/Controllers/StripeController.php b/app/Http/Controllers/StripeController.php
index d1787c8de1fd9032d3c894fff78ef3f84d306835..b48f01c1875fa90398323949f99155d0071d444a 100644 (file)
--- a/app/Http/Controllers/StripeController.php
+++ b/app/Http/Controllers/StripeController.php
@@ -9,6 +9,13 @@ use Illuminate\Http\Request;
 class StripeController extends Controller
 {
 
+    /**
+     * @param Request $request
+     * @return \Illuminate\Http\JsonResponse
+     * @throws \Stripe\Exception\ApiErrorException
+     * @throws \Throwable
+     * Returns a payment intent for an article
+     */
     public function paymentIntents (Request $request)
     {
         $class = $request->input('model_type');
@@ -42,5 +49,16 @@ class StripeController extends Controller
     }
 
 
+    /**
+     * @return \Illuminate\Http\JsonResponse
+     * Returns stripe public key
+     */
+    public function publicKey()
+    {
+        return response()->json([
+            'publicKey' => config('cashier.key')
+        ]);
+    }
+
 
 }

diff --git a/app/Http/Kernel.php b/app/Http/Kernel.php
index d1e406606d3ac307b3d63564d4c764768ae7e51c..df2a0cfeb278c5f2f803d1cf8114b427e0c27a67 100644 (file)
--- a/app/Http/Kernel.php
+++ b/app/Http/Kernel.php
@@ -6,10 +6,19 @@ use App\Http\Middleware\EarlyAccessMiddleware;
 use App\Http\Middleware\EnsureEmailIsVerifiedIfLoggedIn;
 use App\Http\Middleware\LoginWithToken;
 use App\LoginToken;
+use Illuminate\Contracts\Foundation\Application;
 use Illuminate\Foundation\Http\Kernel as HttpKernel;
+use Illuminate\Routing\Router;
 
 class Kernel extends HttpKernel
 {
+
+    public function __construct(Application $app, Router $router)
+    {
+        parent::__construct($app, $router);
+        $this->prependToMiddlewarePriority(\App\Http\Middleware\ForceJsonResponse::class);
+    }
+
     /**
      * The application's global HTTP middleware stack.
      *
@@ -56,6 +65,7 @@ class Kernel extends HttpKernel
      * @var array
      */
     protected $routeMiddleware = [
+        'json.response' => \App\Http\Middleware\ForceJsonResponse::class,
         'login.token' => LoginWithToken::class,
         'auth' => \App\Http\Middleware\Authenticate::class,
         'auth.basic' => \Illuminate\Auth\Middleware\AuthenticateWithBasicAuth::class,

diff --git a/public/admin/js/admin.js b/public/admin/js/admin.js
index aea868005d96e7135d71caf5275ff71873bf168a..d14c19fcf2e7ebd85222e8c9d7cba96ecb43eb55 100644 (file)
--- a/public/admin/js/admin.js
+++ b/public/admin/js/admin.js
@@ -81,7 +81,7 @@
 /******/
 /******/
 /******/       // Load entry module and return exports
-/******/       return __webpack_require__(__webpack_require__.s = 16);
+/******/       return __webpack_require__(__webpack_require__.s = 1);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -4381,6 +4381,21 @@ __webpack_require__.r(__webpack_exports__);
 //
 //
 //
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
 
 /* harmony default export */ __webpack_exports__["default"] = ({
   name: "StripeModal",
@@ -4388,10 +4403,14 @@ __webpack_require__.r(__webpack_exports__);
   data: function data() {
     return {
       stripe: null,
-      _elementsModal_HOST_URL: '/pay',
       amount: '-'
     };
   },
+  mounted: function mounted() {
+    if (location.search.indexOf('?pay=now') >= 0) {
+      this.toggleElementsModalVisibility();
+    }
+  },
   methods: {
     createIntent: function createIntent() {
       var _this = this;
@@ -4415,8 +4434,8 @@ __webpack_require__.r(__webpack_exports__);
       });
     },
     getPublicKey: function getPublicKey() {
-      return Promise.resolve("pk_test_51HcBp3KZBXuYePomhVUc9RxbsZbSfuoiu0NKiotBW4ZKwCbM6sLlPMLSyPDQeB0MUXoQD3qbk23eJ41NVpM1z1oT00lg84Ywcq");
-      return fetch(this._elementsModal_HOST_URL + "/public-key", {
+      // return Promise.resolve("pk_test_51HcBp3KZBXuYePomhVUc9RxbsZbSfuoiu0NKiotBW4ZKwCbM6sLlPMLSyPDQeB0MUXoQD3qbk23eJ41NVpM1z1oT00lg84Ywcq");
+      return fetch("/pay/public-key", {
         method: "get",
         headers: {
           "Content-Type": "application/json"
@@ -4432,10 +4451,11 @@ __webpack_require__.r(__webpack_exports__);
 
       if (modal && modal.classList) {
         modal.classList.toggle("ElementsModal--show-modal");
+        this.createIntent();
       }
     },
     createPaymentIntent: function createPaymentIntent(content) {
-      return fetch("/pay/payment_intents", {
+      return fetch("/pay/payment-intents", {
         method: "post",
         headers: {
           "Content-Type": "application/json",
@@ -4643,12 +4663,7 @@ __webpack_require__.r(__webpack_exports__);
   props: ['content'],
   methods: {
     toggleElementsModalVisibility: function toggleElementsModalVisibility() {
-      var modal = document.querySelector(".ElementsModal--modal");
-
-      if (modal && modal.classList) {
-        modal.classList.toggle("ElementsModal--show-modal");
-        this.$refs.stripeModal.createIntent();
-      }
+      this.$refs.stripeModal.toggleElementsModalVisibility();
     }
   }
 });
@@ -11431,7 +11446,7 @@ module.exports = exports;
 var ___CSS_LOADER_API_IMPORT___ = __webpack_require__(/*! ../../../../node_modules/css-loader/dist/runtime/api.js */ "./node_modules/css-loader/dist/runtime/api.js");
 exports = ___CSS_LOADER_API_IMPORT___(false);
 // Module
-exports.push([module.i, "\n.ElementsModal--modal[data-v-728fb3ae] {\n    all: initial;\n    box-sizing: border-box;\n    position: fixed;\n    font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    background-color: rgba(0, 0, 0, 0.5);\n    opacity: 0;\n    visibility: hidden;\n    transform: scale(1.1);\n    transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;\n    z-index: 100001 !important;\n}\n.ElementsModal--modal-content[data-v-728fb3ae] {\n    position: absolute;\n    top: 42%;\n    left: 50%;\n    /* make media query for this :) */\n    transform: translate(-50%, -50%);\n    border-radius: 10px;\n    background: rgb(255, 255, 255);\n    overflow: hidden;\n    width: 385px;\n    border-radius: 0.5rem;\n}\n@media screen and (max-width: 600px) {\n.ElementsModal--modal-content[data-v-728fb3ae] {\n        height: 100vh;\n        width: 100%;\n        border-radius: 0;\n}\n.ElementsModal--top[data-v-728fb3ae] {\n        padding-top: 4em;\n}\n.ElementsModal--close[data-v-728fb3ae] {\n        padding-top: 4em;\n}\n}\n.ElementsModal--top[data-v-728fb3ae] {\n    display: flex;\n    justify-content: flex-end;\n    position: relative;\n}\n.ElementsModal--close[data-v-728fb3ae] {\n    background: none;\n    color: inherit;\n    border: none;\n    padding: 0;\n    font: inherit;\n    outline: inherit;\n    color: rgb(255, 255, 255);\n    cursor: pointer;\n    position: absolute;\n    top: 0;\n    right: 0;\n    border: none;\n}\n.ElementsModal--show-modal[data-v-728fb3ae] {\n    opacity: 1;\n    visibility: visible;\n    transform: scale(1);\n    transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;\n}\n.ElementsModal--details[data-v-728fb3ae] {\n    margin-bottom: 2px;\n}\n.ElementsModal--price[data-v-728fb3ae] {\n    color: rgb(255, 255, 255);\n    font-size: 36px;\n    font-weight: 600;\n}\n.ElementsModal--top-banner[data-v-728fb3ae] {\n    background-color: #044e9c;\n    text-align: center;\n    padding: 20px 1em 2em;\n}\n.ElementsModal--email[data-v-728fb3ae] {\n    color: rgba(255, 255, 255, 0.5);\n    font-size: 16px;\n    font-weight: 500;\n}\n.ElementsModal--product[data-v-728fb3ae] {\n    color: rgba(255, 255, 255, 0.5);\n    font-size: 16px;\n    font-weight: 500;\n}\n.ElementsModal--company[data-v-728fb3ae] {\n    color: rgb(255, 255, 255);\n    font-size: 18px;\n    font-weight: bold;\n    margin: auto;\n    margin-bottom: 32px;\n}\n.ElementsModal--footer-text[data-v-728fb3ae] {\n    color: rgba(0, 0, 0, 0.4);\n    font-size: 12px;\n    font-weight: normal;\n    text-align: center;\n    line-height: 16px;\n}\n.ElementsModal--error-message[data-v-728fb3ae] {\n    margin-top: 5px;\n    color: rgb(220, 39, 39);\n    font-size: 13px;\n    line-height: 17px;\n}\n.ElementsModal--pay-button-wrapper[data-v-728fb3ae] {\n    font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n    margin: 25px;\n    width: 350px;\n    height: 40px;\n}\n.ElementsModal--pay-button[data-v-728fb3ae] {\n    cursor: pointer;\n    border: 0;\n    width: 100%;\n    text-align: center;\n    height: 40px;\n    box-shadow: inset 0 0 0 1px rgba(50, 50, 93, 0.1),\n    0 2px 5px 0 rgba(50, 50, 93, 0.1), 0 1px 1px 0 rgba(0, 0, 0, 0.07);\n    border-radius: 6px 6px 6px 6px;\n    font-size: 16px;\n    font-weight: 600;\n\n    background-color: rgb(0, 116, 212);\n    color: rgb(255, 255, 255);\n}\n.ElementsModal--pay-button[data-v-728fb3ae]:focus {\n    outline: none;\n    box-shadow: 0 0 0 1px rgba(50, 151, 211, 0.3), 0 1px 1px 0 rgba(0, 0, 0, 0.07),\n    0 0 0 4px rgba(50, 151, 211, 0.3);\n}\n.ElementsModal--dropdowns[data-v-728fb3ae] {\n    margin: 10px;\n    -webkit-appearance: none;\n    background: rgb(255, 255, 255);\n    box-shadow: 0px 0px 0px 1px rgb(224, 224, 224),\n    0px 2px 4px 0px rgba(0, 0, 0, 0.07), 0px 1px 1.5px 0px rgba(0, 0, 0, 0.05);\n    border-radius: 4px 4px 4px 4px;\n}\n\n/* Form */\n.ElementsModal--payment-form[data-v-728fb3ae] {\n    margin-bottom: 0;\n}\n.ElementsModal--label[data-v-728fb3ae] {\n    color: rgba(0, 0, 0, 0.6);\n    font-size: 14px;\n    font-weight: 500;\n}\n.ElementsModal--forms[data-v-728fb3ae] {\n    padding: 5%;\n}\n.ElementsModal--form[data-v-728fb3ae] {\n    margin-bottom: 14px;\n}\n.ElementsModal--form-label[data-v-728fb3ae] {\n    font-size: 13px;\n    margin-bottom: 4px;\n    display: block;\n    color: rgba(0, 0, 0, 0.6);\n}\n.ElementsModal--form-select select[data-v-728fb3ae] {\n    padding: 10px 12px;\n    width: 100%;\n    border: 1px solid transparent;\n    outline: none;\n    box-shadow: 0px 0px 0px 1px rgb(224, 224, 224),\n    0px 2px 4px 0px rgba(0, 0, 0, 0.07), 0px 1px 1.5px 0px rgba(0, 0, 0, 0.05);\n    transition: box-shadow 150ms ease;\n    border-radius: 5px 5px 5px 5px;\n\n    background-color: white;\n    -webkit-appearance: none;\n    -moz-appearance: none;\n    appearance: none;\n    background-image: url(\"data:image/svg+xml,%3Csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.193 3.97a.75.75 0 0 1 1.062 1.062L6.53 9.756a.75.75 0 0 1-1.06 0L.745 5.032A.75.75 0 0 1 1.807 3.97L6 8.163l4.193-4.193z' fill='%23000' fill-rule='evenodd' fill-opacity='.4'/%3E%3C/svg%3E\");\n    background-size: 12px;\n    background-position: calc(100% - 16px) center;\n    background-repeat: no-repeat;\n    color: rgb(40, 40, 40);\n    font-size: 16px;\n    font-weight: normal;\n}\n.ElementsModal--form-select select[data-v-728fb3ae]:-moz-focusring {\n    color: transparent;\n    text-shadow: 0 0 0 rgb(0, 0, 0);\n}\n.ElementsModal--form > label[data-v-728fb3ae] {\n    width: 100%;\n}\n.ElementsModal--form-select select[data-v-728fb3ae]:focus {\n    box-shadow: 0 0 0 1px rgba(50, 151, 211, 0.3), 0 1px 1px 0 rgba(0, 0, 0, 0.07),\n    0 0 0 4px rgba(50, 151, 211, 0.3);\n}\n.ElementsModal--form-select select[data-v-728fb3ae]::-ms-expand {\n    display: none; /* hide the default arrow in ie10 and ie11 */\n}\n.ElementsModal--form-divider[data-v-728fb3ae] {\n    margin-top: 14px;\n    margin-bottom: 25px;\n    text-align: center;\n    border-bottom: 1px solid rgb(231, 231, 231);\n    height: 20px;\n    width: 100%;\n}\n.ElementsModal--form-divider-text[data-v-728fb3ae] {\n    position: relative;\n    bottom: -10px; /* half of line-height */\n    padding: 0 10px;\n    background: rgb(255, 255, 255);\n    color: rgb(144, 144, 144);\n    font-size: 14px;\n    font-weight: 400;\n}\n.StripeElement--payment-request[data-v-728fb3ae] {\n    display: none;\n    margin-bottom: 14px;\n}\n.StripeElement--payment-request-button[data-v-728fb3ae] {\n    margin-bottom: 12px;\n}\n.StripeElement--card[data-v-728fb3ae] {\n    box-sizing: border-box;\n    height: 40px;\n    padding: 10px 12px;\n    border: 1px solid transparent;\n    border-radius: 5px 5px 5px 5px;\n    background-color: white;\n\n    box-shadow: 0px 0px 0px 1px rgb(224, 224, 224),\n    0px 2px 4px 0px rgba(0, 0, 0, 0.07), 0px 1px 1.5px 0px rgba(0, 0, 0, 0.05);\n    transition: box-shadow 150ms ease;\n}\n.StripeElement--card--focus[data-v-728fb3ae] {\n    box-shadow: 0 1px 3px 0 rgb(207, 215, 223);\n}\n.StripeElement--card--invalid[data-v-728fb3ae] {\n    border-color: rgb(239, 152, 150);\n}\n.StripeElement--card--webkit-autofill[data-v-728fb3ae] {\n    background-color: rgb(254, 253, 229) !important;\n}\n\n", ""]);
+exports.push([module.i, "\ninput[data-v-728fb3ae]{\n    height: 40px;\n    padding: 10px 12px;\n    width: 100%;\n    color: #32325d;\n    background-color: white;\n    border: 1px solid transparent;\n    border-radius: 4px;\n\n    box-shadow: 0 1px 3px 0 #e6ebf1;\n    transition: box-shadow 150ms ease;\n}\ninput[data-v-728fb3ae]:focus {\n    box-shadow: 0 1px 3px 0 #cfd7df;\n}\n.ElementsModal--modal[data-v-728fb3ae] {\n    all: initial;\n    box-sizing: border-box;\n    position: fixed;\n    font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    background-color: rgba(0, 0, 0, 0.5);\n    opacity: 0;\n    visibility: hidden;\n    transform: scale(1.1);\n    transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;\n    z-index: 100001 !important;\n}\n.ElementsModal--modal-content[data-v-728fb3ae] {\n    position: absolute;\n    top: 42%;\n    left: 50%;\n    /* make media query for this :) */\n    transform: translate(-50%, -50%);\n    border-radius: 10px;\n    background: rgb(255, 255, 255);\n    overflow: hidden;\n    width: 385px;\n    border-radius: 0.5rem;\n}\n@media screen and (max-width: 600px) {\n.ElementsModal--modal-content[data-v-728fb3ae] {\n        height: 100vh;\n        width: 100%;\n        border-radius: 0;\n}\n.ElementsModal--top[data-v-728fb3ae] {\n        padding-top: 4em;\n}\n.ElementsModal--close[data-v-728fb3ae] {\n        padding-top: 4em;\n}\n}\n.ElementsModal--top[data-v-728fb3ae] {\n    display: flex;\n    justify-content: flex-end;\n    position: relative;\n}\n.ElementsModal--close[data-v-728fb3ae] {\n    background: none;\n    color: inherit;\n    border: none;\n    padding: 0;\n    font: inherit;\n    outline: inherit;\n    color: rgb(255, 255, 255);\n    cursor: pointer;\n    position: absolute;\n    top: 0;\n    right: 0;\n    border: none;\n}\n.ElementsModal--show-modal[data-v-728fb3ae] {\n    opacity: 1;\n    visibility: visible;\n    transform: scale(1);\n    transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;\n}\n.ElementsModal--details[data-v-728fb3ae] {\n    margin-bottom: 2px;\n}\n.ElementsModal--price[data-v-728fb3ae] {\n    color: rgb(255, 255, 255);\n    font-size: 36px;\n    font-weight: 600;\n}\n.ElementsModal--top-banner[data-v-728fb3ae] {\n    background-color: #044e9c;\n    text-align: center;\n    padding: 20px 1em 2em;\n}\n.ElementsModal--email[data-v-728fb3ae] {\n    color: rgba(255, 255, 255, 0.5);\n    font-size: 16px;\n    font-weight: 500;\n}\n.ElementsModal--product[data-v-728fb3ae] {\n    color: rgba(255, 255, 255, 0.5);\n    font-size: 16px;\n    font-weight: 500;\n}\n.ElementsModal--company[data-v-728fb3ae] {\n    color: rgb(255, 255, 255);\n    font-size: 18px;\n    font-weight: bold;\n    margin: auto;\n    margin-bottom: 32px;\n}\n.ElementsModal--footer-text[data-v-728fb3ae] {\n    color: rgba(0, 0, 0, 0.4);\n    font-size: 12px;\n    font-weight: normal;\n    text-align: center;\n    line-height: 16px;\n}\n.ElementsModal--error-message[data-v-728fb3ae] {\n    margin-top: 5px;\n    color: rgb(220, 39, 39);\n    font-size: 13px;\n    line-height: 17px;\n}\n.ElementsModal--pay-button-wrapper[data-v-728fb3ae] {\n    font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n    margin: 25px;\n    width: 350px;\n    height: 40px;\n}\n.ElementsModal--pay-button[data-v-728fb3ae] {\n    cursor: pointer;\n    border: 0;\n    width: 100%;\n    text-align: center;\n    height: 40px;\n    box-shadow: inset 0 0 0 1px rgba(50, 50, 93, 0.1),\n    0 2px 5px 0 rgba(50, 50, 93, 0.1), 0 1px 1px 0 rgba(0, 0, 0, 0.07);\n    border-radius: 6px 6px 6px 6px;\n    font-size: 16px;\n    font-weight: 600;\n\n    background-color: rgb(0, 116, 212);\n    color: rgb(255, 255, 255);\n}\n.ElementsModal--pay-button[data-v-728fb3ae]:focus {\n    outline: none;\n    box-shadow: 0 0 0 1px rgba(50, 151, 211, 0.3), 0 1px 1px 0 rgba(0, 0, 0, 0.07),\n    0 0 0 4px rgba(50, 151, 211, 0.3);\n}\n.ElementsModal--dropdowns[data-v-728fb3ae] {\n    margin: 10px;\n    -webkit-appearance: none;\n    background: rgb(255, 255, 255);\n    box-shadow: 0px 0px 0px 1px rgb(224, 224, 224),\n    0px 2px 4px 0px rgba(0, 0, 0, 0.07), 0px 1px 1.5px 0px rgba(0, 0, 0, 0.05);\n    border-radius: 4px 4px 4px 4px;\n}\n\n/* Form */\n.ElementsModal--payment-form[data-v-728fb3ae] {\n    margin-bottom: 0;\n}\n.ElementsModal--label[data-v-728fb3ae] {\n    color: rgba(0, 0, 0, 0.6);\n    font-size: 14px;\n    font-weight: 500;\n}\n.ElementsModal--forms[data-v-728fb3ae] {\n    padding: 5%;\n}\n.ElementsModal--form[data-v-728fb3ae] {\n    margin-bottom: 14px;\n}\n.ElementsModal--form-label[data-v-728fb3ae] {\n    font-size: 13px;\n    margin-bottom: 4px;\n    display: block;\n    color: rgba(0, 0, 0, 0.6);\n}\n.ElementsModal--form-select select[data-v-728fb3ae] {\n    padding: 10px 12px;\n    width: 100%;\n    border: 1px solid transparent;\n    outline: none;\n    box-shadow: 0px 0px 0px 1px rgb(224, 224, 224),\n    0px 2px 4px 0px rgba(0, 0, 0, 0.07), 0px 1px 1.5px 0px rgba(0, 0, 0, 0.05);\n    transition: box-shadow 150ms ease;\n    border-radius: 5px 5px 5px 5px;\n\n    background-color: white;\n    -webkit-appearance: none;\n    -moz-appearance: none;\n    appearance: none;\n    background-image: url(\"data:image/svg+xml,%3Csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.193 3.97a.75.75 0 0 1 1.062 1.062L6.53 9.756a.75.75 0 0 1-1.06 0L.745 5.032A.75.75 0 0 1 1.807 3.97L6 8.163l4.193-4.193z' fill='%23000' fill-rule='evenodd' fill-opacity='.4'/%3E%3C/svg%3E\");\n    background-size: 12px;\n    background-position: calc(100% - 16px) center;\n    background-repeat: no-repeat;\n    color: rgb(40, 40, 40);\n    font-size: 16px;\n    font-weight: normal;\n}\n.ElementsModal--form-select select[data-v-728fb3ae]:-moz-focusring {\n    color: transparent;\n    text-shadow: 0 0 0 rgb(0, 0, 0);\n}\n.ElementsModal--form > label[data-v-728fb3ae] {\n    width: 100%;\n}\n.ElementsModal--form-select select[data-v-728fb3ae]:focus {\n    box-shadow: 0 0 0 1px rgba(50, 151, 211, 0.3), 0 1px 1px 0 rgba(0, 0, 0, 0.07),\n    0 0 0 4px rgba(50, 151, 211, 0.3);\n}\n.ElementsModal--form-select select[data-v-728fb3ae]::-ms-expand {\n    display: none; /* hide the default arrow in ie10 and ie11 */\n}\n.ElementsModal--form-divider[data-v-728fb3ae] {\n    margin-top: 14px;\n    margin-bottom: 25px;\n    text-align: center;\n    border-bottom: 1px solid rgb(231, 231, 231);\n    height: 20px;\n    width: 100%;\n}\n.ElementsModal--form-divider-text[data-v-728fb3ae] {\n    position: relative;\n    bottom: -10px; /* half of line-height */\n    padding: 0 10px;\n    background: rgb(255, 255, 255);\n    color: rgb(144, 144, 144);\n    font-size: 14px;\n    font-weight: 400;\n}\n.StripeElement--payment-request[data-v-728fb3ae] {\n    display: none;\n    margin-bottom: 14px;\n}\n.StripeElement--payment-request-button[data-v-728fb3ae] {\n    margin-bottom: 12px;\n}\n.StripeElement--card[data-v-728fb3ae], .stripeElement--input[data-v-728fb3ae] {\n    box-sizing: border-box;\n    height: 40px;\n    padding: 10px 12px;\n    border: 1px solid transparent;\n    border-radius: 5px 5px 5px 5px;\n    background-color: white;\n\n    box-shadow: 0px 0px 0px 1px rgb(224, 224, 224),\n    0px 2px 4px 0px rgba(0, 0, 0, 0.07), 0px 1px 1.5px 0px rgba(0, 0, 0, 0.05);\n    transition: box-shadow 150ms ease;\n}\n.StripeElement--card--focus[data-v-728fb3ae] {\n    box-shadow: 0 1px 3px 0 rgb(207, 215, 223);\n}\n.StripeElement--card--invalid[data-v-728fb3ae] {\n    border-color: rgb(239, 152, 150);\n}\n.StripeElement--card--webkit-autofill[data-v-728fb3ae] {\n    background-color: rgb(254, 253, 229) !important;\n}\n\n", ""]);
 // Exports
 module.exports = exports;
 
@@ -91597,7 +91612,7 @@ __webpack_require__.r(__webpack_exports__);
 
 /***/ }),
 
-/***/ 16:
+/***/ 1:
 /*!*************************************!*\
   !*** multi ./resources/js/admin.js ***!
   \*************************************/

diff --git a/public/css/app.css b/public/css/app.css
index 361be74895023bb73c016c06ec9240e0d03513bc..3cdc799776bb747ce6460accf9a09f14a7537607 100644 (file)
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -11139,7 +11139,7 @@ mark.mark {
 }
 
 .highlight-logo-blue {
-  color: white;
+  color: white !important;
   background-color: #044e9c;
 }
 
@@ -11154,7 +11154,7 @@ mark.mark {
 .highlight-blue,
 .btn-back,
 .btn-big {
-  color: white;
+  color: white !important;
   background-color: #278cd7;
 }
 
@@ -11167,7 +11167,7 @@ mark.mark {
 }
 
 .highlight-purple {
-  color: white;
+  color: white !important;
   background-color: #9a36c8;
 }
 
@@ -11181,7 +11181,7 @@ mark.mark {
 
 .highlight-red,
 h1 {
-  color: white;
+  color: white !important;
   background-color: #cb3239;
 }
 
@@ -11194,7 +11194,7 @@ h1 {
 }
 
 .highlight-cyan {
-  color: white;
+  color: white !important;
   background-color: #14c7eb;
 }
 
@@ -11207,7 +11207,7 @@ h1 {
 }
 
 .highlight-magenta {
-  color: white;
+  color: white !important;
   background-color: #cc33a0;
 }
 
@@ -11220,7 +11220,7 @@ h1 {
 }
 
 .highlight-orange {
-  color: white;
+  color: white !important;
   background-color: #e79b17;
 }
 
@@ -11233,7 +11233,7 @@ h1 {
 }
 
 .highlight-grey {
-  color: white;
+  color: white !important;
   background-color: #546883;
 }
 
@@ -11246,7 +11246,7 @@ h1 {
 }
 
 .highlight-denim {
-  color: white;
+  color: white !important;
   background-color: #0c2c50;
 }
 
@@ -11259,7 +11259,7 @@ h1 {
 }
 
 .highlight-green {
-  color: white;
+  color: white !important;
   background-color: #739b6c;
 }
 
@@ -11272,7 +11272,7 @@ h1 {
 }
 
 .highlight-gold {
-  color: white;
+  color: white !important;
   background-color: #bbb541;
 }
 
@@ -11285,7 +11285,7 @@ h1 {
 }
 
 .highlight-mag-blue {
-  color: white;
+  color: white !important;
   background-color: #2a6ba3;
 }
 

diff --git a/resources/js/components/Stripe/StripeModal.vue b/resources/js/components/Stripe/StripeModal.vue
index fc245e64553b5300b58e8fc92666912a003bacce..47f0e767252626e7fddc78b63ee84522c867fc74 100644 (file)
--- a/resources/js/components/Stripe/StripeModal.vue
+++ b/resources/js/components/Stripe/StripeModal.vue
@@ -69,318 +69,333 @@
                     id="payment-form"
                 >
                     <div class="form-row">
-                        <div class="ElementsModal--forms">
-                            <div id="payment-request-section" class="StripeElement--payment-request">
-                                <div id="payment-request-button" class="StripeElement--payment-request-button">
-                                    <!-- A Stripe Element will be inserted here. -->
-                                </div>
-                                <!-- Used to display form errors. -->
-                                <div
-                                    id="paymentRequest-errors"
-                                    class="ElementsModal--error-message"
-                                    role="alert"
-                                ></div>
-                                <div class="ElementsModal--form-divider">
-                                    <span class="ElementsModal--form-divider-text">Or pay with card</span>
-                                </div>
+                    <div class="ElementsModal--forms">
+
+<!--                        <div>-->
+<!--                            <label for="name" class="w-100">-->
+<!--                                <span class="ElementsModal&#45;&#45;form-label spacer">Name</span>-->
+
+<!--                                <input id="name" name="name" placeholder="Jenny Rosen" required>-->
+<!--                            </label>-->
+<!--                        </div>-->
+<!--                        <div>-->
+<!--                            <label for="email" class="w-100">-->
+<!--                                <span class="ElementsModal&#45;&#45;form-label spacer">Email</span>-->
+
+<!--                                <input id="email" name="email" placeholder="user@example.com" required>-->
+<!--                            </label>-->
+<!--                        </div>-->
+
+
+                        <div id="payment-request-section" class="StripeElement--payment-request">
+                            <div id="payment-request-button" class="StripeElement--payment-request-button">
+                                <!-- A Stripe Element will be inserted here. -->
                             </div>
-                            <div class="ElementsModal--form">
-                                <label for="ElementsModal--card-element">
-                  <span class="ElementsModal--form-label spacer"
-                  >Card details</span
-                  >
-                                    <div class="StripeElement--card" id="card-element">
-                                        <!-- A Stripe Element will be inserted here. -->
-                                    </div>
-                                </label>
-                                <!-- Used to display form errors. -->
-                                <div
-                                    id="card-errors"
-                                    class="ElementsModal--error-message"
-                                    role="alert"
-                                ></div>
+                            <!-- Used to display form errors. -->
+                            <div
+                                id="paymentRequest-errors"
+                                class="ElementsModal--error-message"
+                                role="alert"
+                            ></div>
+                            <div class="ElementsModal--form-divider">
+                                <span class="ElementsModal--form-divider-text">Or pay with card</span>
                             </div>
+                        </div>
+                        <div class="ElementsModal--form">
 
-                            <div class="ElementsModal--form">
-                                <label class="select">
-                  <span class="ElementsModal--form-label spacer"
-                  >Country or region</span
-                  >
-                                    <div id="country" class="ElementsModal--form-select">
-                                        <select name="country" autocomplete="billing country" aria-label="Country or region">
-                                            <option value="AF">Afghanistan</option>
-                                            <option value="AX">Åland Islands</option>
-                                            <option value="AL">Albania</option>
-                                            <option value="DZ">Algeria</option>
-                                            <option value="AD">Andorra</option>
-                                            <option value="AO">Angola</option>
-                                            <option value="AI">Anguilla</option>
-                                            <option value="AQ">Antarctica</option>
-                                            <option value="AG">Antigua &amp; Barbuda</option>
-                                            <option value="AR">Argentina</option>
-                                            <option value="AM">Armenia</option>
-                                            <option value="AW">Aruba</option>
-                                            <option value="AC">Ascension Island</option>
-                                            <option value="AU">Australia</option>
-                                            <option value="AT">Austria</option>
-                                            <option value="AZ">Azerbaijan</option>
-                                            <option value="BS">Bahamas</option>
-                                            <option value="BH">Bahrain</option>
-                                            <option value="BD">Bangladesh</option>
-                                            <option value="BB">Barbados</option>
-                                            <option value="BY">Belarus</option>
-                                            <option value="BE">Belgium</option>
-                                            <option value="BZ">Belize</option>
-                                            <option value="BJ">Benin</option>
-                                            <option value="BM">Bermuda</option>
-                                            <option value="BT">Bhutan</option>
-                                            <option value="BO">Bolivia</option>
-                                            <option value="BA">Bosnia &amp; Herzegovina</option>
-                                            <option value="BW">Botswana</option>
-                                            <option value="BV">Bouvet Island</option>
-                                            <option value="BR">Brazil</option>
-                                            <option value="IO">British Indian Ocean Territory</option>
-                                            <option value="VG">British Virgin Islands</option>
-                                            <option value="BN">Brunei</option>
-                                            <option value="BG">Bulgaria</option>
-                                            <option value="BF">Burkina Faso</option>
-                                            <option value="BI">Burundi</option>
-                                            <option value="KH">Cambodia</option>
-                                            <option value="CM">Cameroon</option>
-                                            <option value="CA">Canada</option>
-                                            <option value="CV">Cape Verde</option>
-                                            <option value="BQ">Caribbean Netherlands</option>
-                                            <option value="KY">Cayman Islands</option>
-                                            <option value="CF">Central African Republic</option>
-                                            <option value="TD">Chad</option>
-                                            <option value="CL">Chile</option>
-                                            <option value="CN">China</option>
-                                            <option value="CO">Colombia</option>
-                                            <option value="KM">Comoros</option>
-                                            <option value="CG">Congo - Brazzaville</option>
-                                            <option value="CD">Congo - Kinshasa</option>
-                                            <option value="CK">Cook Islands</option>
-                                            <option value="CR">Costa Rica</option>
-                                            <option value="CI">Côte d’Ivoire</option>
-                                            <option value="HR">Croatia</option>
-                                            <option value="CW">Curaçao</option>
-                                            <option value="CY">Cyprus</option>
-                                            <option value="CZ">Czechia</option>
-                                            <option value="DK">Denmark</option>
-                                            <option value="DJ">Djibouti</option>
-                                            <option value="DM">Dominica</option>
-                                            <option value="DO">Dominican Republic</option>
-                                            <option value="EC">Ecuador</option>
-                                            <option value="EG">Egypt</option>
-                                            <option value="SV">El Salvador</option>
-                                            <option value="GQ">Equatorial Guinea</option>
-                                            <option value="ER">Eritrea</option>
-                                            <option value="EE">Estonia</option>
-                                            <option value="ET">Ethiopia</option>
-                                            <option value="FK">Falkland Islands</option>
-                                            <option value="FO">Faroe Islands</option>
-                                            <option value="FJ">Fiji</option>
-                                            <option value="FI">Finland</option>
-                                            <option value="FR" selected="selected">France</option>
-                                            <option value="GF">French Guiana</option>
-                                            <option value="PF">French Polynesia</option>
-                                            <option value="TF">French Southern Territories</option>
-                                            <option value="GA">Gabon</option>
-                                            <option value="GM">Gambia</option>
-                                            <option value="GE">Georgia</option>
-                                            <option value="DE">Germany</option>
-                                            <option value="GH">Ghana</option>
-                                            <option value="GI">Gibraltar</option>
-                                            <option value="GR">Greece</option>
-                                            <option value="GL">Greenland</option>
-                                            <option value="GD">Grenada</option>
-                                            <option value="GP">Guadeloupe</option>
-                                            <option value="GU">Guam</option>
-                                            <option value="GT">Guatemala</option>
-                                            <option value="GG">Guernsey</option>
-                                            <option value="GN">Guinea</option>
-                                            <option value="GW">Guinea-Bissau</option>
-                                            <option value="GY">Guyana</option>
-                                            <option value="HT">Haiti</option>
-                                            <option value="HN">Honduras</option>
-                                            <option value="HK">Hong Kong SAR China</option>
-                                            <option value="HU">Hungary</option>
-                                            <option value="IS">Iceland</option>
-                                            <option value="IN">India</option>
-                                            <option value="ID">Indonesia</option>
-                                            <option value="IR">Iran</option>
-                                            <option value="IQ">Iraq</option>
-                                            <option value="IE">Ireland</option>
-                                            <option value="IM">Isle of Man</option>
-                                            <option value="IL">Israel</option>
-                                            <option value="IT">Italy</option>
-                                            <option value="JM">Jamaica</option>
-                                            <option value="JP">Japan</option>
-                                            <option value="JE">Jersey</option>
-                                            <option value="JO">Jordan</option>
-                                            <option value="KZ">Kazakhstan</option>
-                                            <option value="KE">Kenya</option>
-                                            <option value="KI">Kiribati</option>
-                                            <option value="XK">Kosovo</option>
-                                            <option value="KW">Kuwait</option>
-                                            <option value="KG">Kyrgyzstan</option>
-                                            <option value="LA">Laos</option>
-                                            <option value="LV">Latvia</option>
-                                            <option value="LB">Lebanon</option>
-                                            <option value="LS">Lesotho</option>
-                                            <option value="LR">Liberia</option>
-                                            <option value="LY">Libya</option>
-                                            <option value="LI">Liechtenstein</option>
-                                            <option value="LT">Lithuania</option>
-                                            <option value="LU">Luxembourg</option>
-                                            <option value="MO">Macau SAR China</option>
-                                            <option value="MK">Macedonia</option>
-                                            <option value="MG">Madagascar</option>
-                                            <option value="MW">Malawi</option>
-                                            <option value="MY">Malaysia</option>
-                                            <option value="MV">Maldives</option>
-                                            <option value="ML">Mali</option>
-                                            <option value="MT">Malta</option>
-                                            <option value="MQ">Martinique</option>
-                                            <option value="MR">Mauritania</option>
-                                            <option value="MU">Mauritius</option>
-                                            <option value="YT">Mayotte</option>
-                                            <option value="MX">Mexico</option>
-                                            <option value="MD">Moldova</option>
-                                            <option value="MC">Monaco</option>
-                                            <option value="MN">Mongolia</option>
-                                            <option value="ME">Montenegro</option>
-                                            <option value="MS">Montserrat</option>
-                                            <option value="MA">Morocco</option>
-                                            <option value="MZ">Mozambique</option>
-                                            <option value="MM">Myanmar (Burma)</option>
-                                            <option value="NA">Namibia</option>
-                                            <option value="NR">Nauru</option>
-                                            <option value="NP">Nepal</option>
-                                            <option value="NL">Netherlands</option>
-                                            <option value="NC">New Caledonia</option>
-                                            <option value="NZ">New Zealand</option>
-                                            <option value="NI">Nicaragua</option>
-                                            <option value="NE">Niger</option>
-                                            <option value="NG">Nigeria</option>
-                                            <option value="NU">Niue</option>
-                                            <option value="NO">Norway</option>
-                                            <option value="OM">Oman</option>
-                                            <option value="PK">Pakistan</option>
-                                            <option value="PS">Palestinian Territories</option>
-                                            <option value="PA">Panama</option>
-                                            <option value="PG">Papua New Guinea</option>
-                                            <option value="PY">Paraguay</option>
-                                            <option value="PE">Peru</option>
-                                            <option value="PH">Philippines</option>
-                                            <option value="PN">Pitcairn Islands</option>
-                                            <option value="PL">Poland</option>
-                                            <option value="PT">Portugal</option>
-                                            <option value="PR">Puerto Rico</option>
-                                            <option value="QA">Qatar</option>
-                                            <option value="RE">Réunion</option>
-                                            <option value="RO">Romania</option>
-                                            <option value="RU">Russia</option>
-                                            <option value="RW">Rwanda</option>
-                                            <option value="WS">Samoa</option>
-                                            <option value="SM">San Marino</option>
-                                            <option value="ST">São Tomé &amp; Príncipe</option>
-                                            <option value="SA">Saudi Arabia</option>
-                                            <option value="SN">Senegal</option>
-                                            <option value="RS">Serbia</option>
-                                            <option value="SC">Seychelles</option>
-                                            <option value="SL">Sierra Leone</option>
-                                            <option value="SG">Singapore</option>
-                                            <option value="SX">Sint Maarten</option>
-                                            <option value="SK">Slovakia</option>
-                                            <option value="SI">Slovenia</option>
-                                            <option value="SB">Solomon Islands</option>
-                                            <option value="SO">Somalia</option>
-                                            <option value="ZA">South Africa</option>
-                                            <option value="GS">South Georgia &amp; South Sandwich Islands</option>
-                                            <option value="KR">South Korea</option>
-                                            <option value="SS">South Sudan</option>
-                                            <option value="ES">Spain</option>
-                                            <option value="LK">Sri Lanka</option>
-                                            <option value="BL">St. Barthélemy</option>
-                                            <option value="SH">St. Helena</option>
-                                            <option value="KN">St. Kitts &amp; Nevis</option>
-                                            <option value="LC">St. Lucia</option>
-                                            <option value="MF">St. Martin</option>
-                                            <option value="PM">St. Pierre &amp; Miquelon</option>
-                                            <option value="VC">St. Vincent &amp; Grenadines</option>
-                                            <option value="SR">Suriname</option>
-                                            <option value="SJ">Svalbard &amp; Jan Mayen</option>
-                                            <option value="SZ">Swaziland</option>
-                                            <option value="SE">Sweden</option>
-                                            <option value="CH">Switzerland</option>
-                                            <option value="TW">Taiwan</option>
-                                            <option value="TJ">Tajikistan</option>
-                                            <option value="TZ">Tanzania</option>
-                                            <option value="TH">Thailand</option>
-                                            <option value="TL">Timor-Leste</option>
-                                            <option value="TG">Togo</option>
-                                            <option value="TK">Tokelau</option>
-                                            <option value="TO">Tonga</option>
-                                            <option value="TT">Trinidad &amp; Tobago</option>
-                                            <option value="TA">Tristan da Cunha</option>
-                                            <option value="TN">Tunisia</option>
-                                            <option value="TR">Turkey</option>
-                                            <option value="TM">Turkmenistan</option>
-                                            <option value="TC">Turks &amp; Caicos Islands</option>
-                                            <option value="TV">Tuvalu</option>
-                                            <option value="UG">Uganda</option>
-                                            <option value="UA">Ukraine</option>
-                                            <option value="AE">United Arab Emirates</option>
-                                            <option value="GB">United Kingdom</option>
-                                            <option value="US">United States</option>
-                                            <option value="UY">Uruguay</option>
-                                            <option value="UZ">Uzbekistan</option>
-                                            <option value="VU">Vanuatu</option>
-                                            <option value="VA">Vatican City</option>
-                                            <option value="VE">Venezuela</option>
-                                            <option value="VN">Vietnam</option>
-                                            <option value="WF">Wallis &amp; Futuna</option>
-                                            <option value="EH">Western Sahara</option>
-                                            <option value="YE">Yemen</option>
-                                            <option value="ZM">Zambia</option>
-                                            <option alue="ZW">Zimbabwe</option>
-                                        </select>
-                                    </div>
-                                </label>
-                            </div>
+                            <label for="ElementsModal--card-element">
+                                <span class="ElementsModal--form-label spacer">Card details</span>
+                                <div class="StripeElement--card" id="card-element">
+                                    <!-- A Stripe Element will be inserted here. -->
+                                </div>
+                            </label>
+                            <!-- Used to display form errors. -->
+                            <div
+                                id="card-errors"
+                                class="ElementsModal--error-message"
+                                role="alert"
+                            ></div>
+                        </div>
 
-                            <div class="ElementsModal--form">
-                                <input
-                                    type="hidden"
-                                    name="amount"
-                                    :value="content.amount"
-                                />
-                                <input
-                                    type="hidden"
-                                    name="currency"
-                                    :value="content.currency"
-                                />
-                                <input
-                                    type="hidden"
-                                    name="description"
-                                    :value="content.productName"
-                                />
-                                <button class="ElementsModal--pay-button">Payer {{content.amount}}</button>
-                            </div>
 
-                            <!-- Edit your terms and conditions here   -->
-                            <div class="footer ElementsModal--footer-text">
-                                En cliquant sur Payer vous acceptez les
-                                <a class="ElementsModal--footer-text" href="stripe.com"
-                                >Termes and Conditions.</a> de Prescription Santé - Le Quotidien
-                            </div>
+                        <div class="ElementsModal--form">
+                            <label class="select">
+                                <span class="ElementsModal--form-label spacer">Country or region</span>
+                                <div id="country" class="ElementsModal--form-select">
+                                    <select name="country" autocomplete="billing country" aria-label="Country or region">
+                                        <option value="AF">Afghanistan</option>
+                                        <option value="AX">Åland Islands</option>
+                                        <option value="AL">Albania</option>
+                                        <option value="DZ">Algeria</option>
+                                        <option value="AD">Andorra</option>
+                                        <option value="AO">Angola</option>
+                                        <option value="AI">Anguilla</option>
+                                        <option value="AQ">Antarctica</option>
+                                        <option value="AG">Antigua &amp; Barbuda</option>
+                                        <option value="AR">Argentina</option>
+                                        <option value="AM">Armenia</option>
+                                        <option value="AW">Aruba</option>
+                                        <option value="AC">Ascension Island</option>
+                                        <option value="AU">Australia</option>
+                                        <option value="AT">Austria</option>
+                                        <option value="AZ">Azerbaijan</option>
+                                        <option value="BS">Bahamas</option>
+                                        <option value="BH">Bahrain</option>
+                                        <option value="BD">Bangladesh</option>
+                                        <option value="BB">Barbados</option>
+                                        <option value="BY">Belarus</option>
+                                        <option value="BE">Belgium</option>
+                                        <option value="BZ">Belize</option>
+                                        <option value="BJ">Benin</option>
+                                        <option value="BM">Bermuda</option>
+                                        <option value="BT">Bhutan</option>
+                                        <option value="BO">Bolivia</option>
+                                        <option value="BA">Bosnia &amp; Herzegovina</option>
+                                        <option value="BW">Botswana</option>
+                                        <option value="BV">Bouvet Island</option>
+                                        <option value="BR">Brazil</option>
+                                        <option value="IO">British Indian Ocean Territory</option>
+                                        <option value="VG">British Virgin Islands</option>
+                                        <option value="BN">Brunei</option>
+                                        <option value="BG">Bulgaria</option>
+                                        <option value="BF">Burkina Faso</option>
+                                        <option value="BI">Burundi</option>
+                                        <option value="KH">Cambodia</option>
+                                        <option value="CM">Cameroon</option>
+                                        <option value="CA">Canada</option>
+                                        <option value="CV">Cape Verde</option>
+                                        <option value="BQ">Caribbean Netherlands</option>
+                                        <option value="KY">Cayman Islands</option>
+                                        <option value="CF">Central African Republic</option>
+                                        <option value="TD">Chad</option>
+                                        <option value="CL">Chile</option>
+                                        <option value="CN">China</option>
+                                        <option value="CO">Colombia</option>
+                                        <option value="KM">Comoros</option>
+                                        <option value="CG">Congo - Brazzaville</option>
+                                        <option value="CD">Congo - Kinshasa</option>
+                                        <option value="CK">Cook Islands</option>
+                                        <option value="CR">Costa Rica</option>
+                                        <option value="CI">Côte d’Ivoire</option>
+                                        <option value="HR">Croatia</option>
+                                        <option value="CW">Curaçao</option>
+                                        <option value="CY">Cyprus</option>
+                                        <option value="CZ">Czechia</option>
+                                        <option value="DK">Denmark</option>
+                                        <option value="DJ">Djibouti</option>
+                                        <option value="DM">Dominica</option>
+                                        <option value="DO">Dominican Republic</option>
+                                        <option value="EC">Ecuador</option>
+                                        <option value="EG">Egypt</option>
+                                        <option value="SV">El Salvador</option>
+                                        <option value="GQ">Equatorial Guinea</option>
+                                        <option value="ER">Eritrea</option>
+                                        <option value="EE">Estonia</option>
+                                        <option value="ET">Ethiopia</option>
+                                        <option value="FK">Falkland Islands</option>
+                                        <option value="FO">Faroe Islands</option>
+                                        <option value="FJ">Fiji</option>
+                                        <option value="FI">Finland</option>
+                                        <option value="FR" selected="selected">France</option>
+                                        <option value="GF">French Guiana</option>
+                                        <option value="PF">French Polynesia</option>
+                                        <option value="TF">French Southern Territories</option>
+                                        <option value="GA">Gabon</option>
+                                        <option value="GM">Gambia</option>
+                                        <option value="GE">Georgia</option>
+                                        <option value="DE">Germany</option>
+                                        <option value="GH">Ghana</option>
+                                        <option value="GI">Gibraltar</option>
+                                        <option value="GR">Greece</option>
+                                        <option value="GL">Greenland</option>
+                                        <option value="GD">Grenada</option>
+                                        <option value="GP">Guadeloupe</option>
+                                        <option value="GU">Guam</option>
+                                        <option value="GT">Guatemala</option>
+                                        <option value="GG">Guernsey</option>
+                                        <option value="GN">Guinea</option>
+                                        <option value="GW">Guinea-Bissau</option>
+                                        <option value="GY">Guyana</option>
+                                        <option value="HT">Haiti</option>
+                                        <option value="HN">Honduras</option>
+                                        <option value="HK">Hong Kong SAR China</option>
+                                        <option value="HU">Hungary</option>
+                                        <option value="IS">Iceland</option>
+                                        <option value="IN">India</option>
+                                        <option value="ID">Indonesia</option>
+                                        <option value="IR">Iran</option>
+                                        <option value="IQ">Iraq</option>
+                                        <option value="IE">Ireland</option>
+                                        <option value="IM">Isle of Man</option>
+                                        <option value="IL">Israel</option>
+                                        <option value="IT">Italy</option>
+                                        <option value="JM">Jamaica</option>
+                                        <option value="JP">Japan</option>
+                                        <option value="JE">Jersey</option>
+                                        <option value="JO">Jordan</option>
+                                        <option value="KZ">Kazakhstan</option>
+                                        <option value="KE">Kenya</option>
+                                        <option value="KI">Kiribati</option>
+                                        <option value="XK">Kosovo</option>
+                                        <option value="KW">Kuwait</option>
+                                        <option value="KG">Kyrgyzstan</option>
+                                        <option value="LA">Laos</option>
+                                        <option value="LV">Latvia</option>
+                                        <option value="LB">Lebanon</option>
+                                        <option value="LS">Lesotho</option>
+                                        <option value="LR">Liberia</option>
+                                        <option value="LY">Libya</option>
+                                        <option value="LI">Liechtenstein</option>
+                                        <option value="LT">Lithuania</option>
+                                        <option value="LU">Luxembourg</option>
+                                        <option value="MO">Macau SAR China</option>
+                                        <option value="MK">Macedonia</option>
+                                        <option value="MG">Madagascar</option>
+                                        <option value="MW">Malawi</option>
+                                        <option value="MY">Malaysia</option>
+                                        <option value="MV">Maldives</option>
+                                        <option value="ML">Mali</option>
+                                        <option value="MT">Malta</option>
+                                        <option value="MQ">Martinique</option>
+                                        <option value="MR">Mauritania</option>
+                                        <option value="MU">Mauritius</option>
+                                        <option value="YT">Mayotte</option>
+                                        <option value="MX">Mexico</option>
+                                        <option value="MD">Moldova</option>
+                                        <option value="MC">Monaco</option>
+                                        <option value="MN">Mongolia</option>
+                                        <option value="ME">Montenegro</option>
+                                        <option value="MS">Montserrat</option>
+                                        <option value="MA">Morocco</option>
+                                        <option value="MZ">Mozambique</option>
+                                        <option value="MM">Myanmar (Burma)</option>
+                                        <option value="NA">Namibia</option>
+                                        <option value="NR">Nauru</option>
+                                        <option value="NP">Nepal</option>
+                                        <option value="NL">Netherlands</option>
+                                        <option value="NC">New Caledonia</option>
+                                        <option value="NZ">New Zealand</option>
+                                        <option value="NI">Nicaragua</option>
+                                        <option value="NE">Niger</option>
+                                        <option value="NG">Nigeria</option>
+                                        <option value="NU">Niue</option>
+                                        <option value="NO">Norway</option>
+                                        <option value="OM">Oman</option>
+                                        <option value="PK">Pakistan</option>
+                                        <option value="PS">Palestinian Territories</option>
+                                        <option value="PA">Panama</option>
+                                        <option value="PG">Papua New Guinea</option>
+                                        <option value="PY">Paraguay</option>
+                                        <option value="PE">Peru</option>
+                                        <option value="PH">Philippines</option>
+                                        <option value="PN">Pitcairn Islands</option>
+                                        <option value="PL">Poland</option>
+                                        <option value="PT">Portugal</option>
+                                        <option value="PR">Puerto Rico</option>
+                                        <option value="QA">Qatar</option>
+                                        <option value="RE">Réunion</option>
+                                        <option value="RO">Romania</option>
+                                        <option value="RU">Russia</option>
+                                        <option value="RW">Rwanda</option>
+                                        <option value="WS">Samoa</option>
+                                        <option value="SM">San Marino</option>
+                                        <option value="ST">São Tomé &amp; Príncipe</option>
+                                        <option value="SA">Saudi Arabia</option>
+                                        <option value="SN">Senegal</option>
+                                        <option value="RS">Serbia</option>
+                                        <option value="SC">Seychelles</option>
+                                        <option value="SL">Sierra Leone</option>
+                                        <option value="SG">Singapore</option>
+                                        <option value="SX">Sint Maarten</option>
+                                        <option value="SK">Slovakia</option>
+                                        <option value="SI">Slovenia</option>
+                                        <option value="SB">Solomon Islands</option>
+                                        <option value="SO">Somalia</option>
+                                        <option value="ZA">South Africa</option>
+                                        <option value="GS">South Georgia &amp; South Sandwich Islands</option>
+                                        <option value="KR">South Korea</option>
+                                        <option value="SS">South Sudan</option>
+                                        <option value="ES">Spain</option>
+                                        <option value="LK">Sri Lanka</option>
+                                        <option value="BL">St. Barthélemy</option>
+                                        <option value="SH">St. Helena</option>
+                                        <option value="KN">St. Kitts &amp; Nevis</option>
+                                        <option value="LC">St. Lucia</option>
+                                        <option value="MF">St. Martin</option>
+                                        <option value="PM">St. Pierre &amp; Miquelon</option>
+                                        <option value="VC">St. Vincent &amp; Grenadines</option>
+                                        <option value="SR">Suriname</option>
+                                        <option value="SJ">Svalbard &amp; Jan Mayen</option>
+                                        <option value="SZ">Swaziland</option>
+                                        <option value="SE">Sweden</option>
+                                        <option value="CH">Switzerland</option>
+                                        <option value="TW">Taiwan</option>
+                                        <option value="TJ">Tajikistan</option>
+                                        <option value="TZ">Tanzania</option>
+                                        <option value="TH">Thailand</option>
+                                        <option value="TL">Timor-Leste</option>
+                                        <option value="TG">Togo</option>
+                                        <option value="TK">Tokelau</option>
+                                        <option value="TO">Tonga</option>
+                                        <option value="TT">Trinidad &amp; Tobago</option>
+                                        <option value="TA">Tristan da Cunha</option>
+                                        <option value="TN">Tunisia</option>
+                                        <option value="TR">Turkey</option>
+                                        <option value="TM">Turkmenistan</option>
+                                        <option value="TC">Turks &amp; Caicos Islands</option>
+                                        <option value="TV">Tuvalu</option>
+                                        <option value="UG">Uganda</option>
+                                        <option value="UA">Ukraine</option>
+                                        <option value="AE">United Arab Emirates</option>
+                                        <option value="GB">United Kingdom</option>
+                                        <option value="US">United States</option>
+                                        <option value="UY">Uruguay</option>
+                                        <option value="UZ">Uzbekistan</option>
+                                        <option value="VU">Vanuatu</option>
+                                        <option value="VA">Vatican City</option>
+                                        <option value="VE">Venezuela</option>
+                                        <option value="VN">Vietnam</option>
+                                        <option value="WF">Wallis &amp; Futuna</option>
+                                        <option value="EH">Western Sahara</option>
+                                        <option value="YE">Yemen</option>
+                                        <option value="ZM">Zambia</option>
+                                        <option alue="ZW">Zimbabwe</option>
+                                    </select>
+                                </div>
+                            </label>
+                        </div>
+
+                        <div class="ElementsModal--form">
+                            <input
+                                type="hidden"
+                                name="amount"
+                                :value="content.amount"
+                            />
+                            <input
+                                type="hidden"
+                                name="currency"
+                                :value="content.currency"
+                            />
+                            <input
+                                type="hidden"
+                                name="description"
+                                :value="content.productName"
+                            />
+                            <button class="ElementsModal--pay-button">Payer {{content.amount}}</button>
+                        </div>
+
+                        <!-- Edit your terms and conditions here   -->
+                        <div class="footer ElementsModal--footer-text">
+                            En cliquant sur Payer vous acceptez les
+                            <a class="ElementsModal--footer-text" href="stripe.com"
+                            >Termes and Conditions.</a> de Prescription Santé - Le Quotidien
                         </div>
                     </div>
-                </form>
             </div>
+            </form>
         </div>
     </div>
+    </div>
 </template>
 
 <script>
@@ -393,11 +408,17 @@ export default {
     data() {
         return {
             stripe: null,
-            _elementsModal_HOST_URL : '/pay',
             amount: '-',
         }
     },
 
+    mounted(){
+        if (location.search.indexOf('?pay=now')>=0) {
+            this.toggleElementsModalVisibility();
+        }
+
+    },
+
     methods:  {
 
         createIntent() {
@@ -405,20 +426,20 @@ export default {
                 return;
             }
             this.createPaymentIntent(this.content).then((paymentIntent) => {
-            this.amount = this.calculateDisplayAmountFromCurrency(paymentIntent);
-            this.getPublicKey().then(key => {
-                loadStripe(key).then(stripe => this.stripe = stripe)
-                    .then(() => {
-                        this.createElements(this.content, paymentIntent);
-                        this.createPaymentRequest(this.content, paymentIntent);
-                    })
-            });
+                this.amount = this.calculateDisplayAmountFromCurrency(paymentIntent);
+                this.getPublicKey().then(key => {
+                    loadStripe(key).then(stripe => this.stripe = stripe)
+                        .then(() => {
+                            this.createElements(this.content, paymentIntent);
+                            this.createPaymentRequest(this.content, paymentIntent);
+                        })
+                });
             });
         },
 
         getPublicKey() {
-            return Promise.resolve("pk_test_51HcBp3KZBXuYePomhVUc9RxbsZbSfuoiu0NKiotBW4ZKwCbM6sLlPMLSyPDQeB0MUXoQD3qbk23eJ41NVpM1z1oT00lg84Ywcq");
-            return fetch(this._elementsModal_HOST_URL + "/public-key", {
+            // return Promise.resolve("pk_test_51HcBp3KZBXuYePomhVUc9RxbsZbSfuoiu0NKiotBW4ZKwCbM6sLlPMLSyPDQeB0MUXoQD3qbk23eJ41NVpM1z1oT00lg84Ywcq");
+            return fetch("/pay/public-key", {
                 method: "get",
                 headers: {
                     "Content-Type": "application/json"
@@ -436,12 +457,13 @@ export default {
             var modal = document.querySelector(".ElementsModal--modal");
             if (modal && modal.classList) {
                 modal.classList.toggle("ElementsModal--show-modal");
+                this.createIntent();
             }
         },
 
 
         createPaymentIntent(content) {
-            return fetch(  "/pay/payment_intents", {
+            return fetch(  "/pay/payment-intents", {
                 method: "post",
                 headers: {
                     "Content-Type": "application/json",
@@ -665,6 +687,26 @@ export default {
 </script>
 
 <style scoped>
+input{
+    height: 40px;
+    padding: 10px 12px;
+    width: 100%;
+    color: #32325d;
+    background-color: white;
+    border: 1px solid transparent;
+    border-radius: 4px;
+
+    box-shadow: 0 1px 3px 0 #e6ebf1;
+    -webkit-transition: box-shadow 150ms ease;
+    transition: box-shadow 150ms ease;
+}
+
+input:focus {
+    box-shadow: 0 1px 3px 0 #cfd7df;
+}
+
+
+
 .ElementsModal--modal {
     all: initial;
     box-sizing: border-box;
@@ -916,7 +958,7 @@ export default {
     margin-bottom: 12px;
 }
 
-.StripeElement--card {
+.StripeElement--card, .stripeElement--input {
     box-sizing: border-box;
     height: 40px;
     padding: 10px 12px;

diff --git a/resources/js/components/Stripe/UnlockArticle.vue b/resources/js/components/Stripe/UnlockArticle.vue
index b3ef7e5e738d336e8277d28c70bb801a7154b137..9b4d48ada6a082e49876e739a61ee117f96e7760 100644 (file)
--- a/resources/js/components/Stripe/UnlockArticle.vue
+++ b/resources/js/components/Stripe/UnlockArticle.vue
@@ -18,11 +18,8 @@ name: "UnlockArticle",
     props:['content'],
     methods: {
         toggleElementsModalVisibility() {
-            const modal = document.querySelector(".ElementsModal--modal");
-            if (modal && modal.classList) {
-                modal.classList.toggle("ElementsModal--show-modal");
-                this.$refs.stripeModal.createIntent();
-            }
+            this.$refs.stripeModal.toggleElementsModalVisibility();
+
         },
     }
 }

diff --git a/resources/sass/_colors.scss b/resources/sass/_colors.scss
index 1241c2db8d088f84b1a1f3177afd1817c6a11145..a725a1d5e5acaf8690a20f56aa0a2822d3b1ce8e 100644 (file)
--- a/resources/sass/_colors.scss
+++ b/resources/sass/_colors.scss
@@ -58,7 +58,7 @@ $psq_pages: (
     }
 
     .highlight-#{$name} {
-        color: white;
+        color: white !important;
         background-color: $color;
     }
     .border-#{$name} {

diff --git a/resources/views/auth/register.blade.php b/resources/views/auth/register.blade.php
index b4332cacec9e451e120b89fb8eaab9a421517609..82f1c5667e1b0e6f71fed6c0ffcdddcf50625c8d 100644 (file)
--- a/resources/views/auth/register.blade.php
+++ b/resources/views/auth/register.blade.php
@@ -9,6 +9,11 @@
                 <p class="font-weight-bold">Bienvenue sur {{config('app.name')}}</p>
                 <p class="mb-0">Vous bénéficierez de 2 semaines d'accès gratuit dès votre inscription !</p>
             </div>
+            @if(request()->has('payment_process'))
+            <div class="alert-info alert">
+                <p class="mb-0">Veuillez vous inscrire afin de procéder à votre achat. Cela ne vous prendra pas plus d'une minute !</p>
+            </div>
+            @endif
 
             <div class="card">
 
@@ -17,7 +22,9 @@
                 <div class="card-body">
                     <form method="POST" action="{{ route('register') }}">
                         @csrf
-
+                        @if(request()->has('redirect_to'))
+                        <input type="hidden" name="redirect_to" value="{{request()->redirect_to}}">
+                        @endif
                         <div class="form-group row">
                             <label for="first_name" class="col-md-4 col-form-label text-md-right">{{ __('Prénom') }}</label>
 

diff --git a/resources/views/components/login-alert.blade.php b/resources/views/components/login-alert.blade.php
index 0d2499eac7a1506d750b4af5592bc7e89a3cf080..95430f66778434a39ff5db8ce3d37d829a64c0ca 100644 (file)
--- a/resources/views/components/login-alert.blade.php
+++ b/resources/views/components/login-alert.blade.php
@@ -4,11 +4,21 @@
                 <a href="{{route('not-registered')}}" >cliquez ici pour découvrir nos formules d'abonnement.</a>
             </p>
             @if(isset($article) && method_exists($article, 'getStripeData'))
+                @auth
             <p>
                 <unlock-article
                     :content='@json($article->getStripeData())'
                 ></unlock-article>
             </p>
+                @else
+                    <a
+                    class="btn click-here highlight-logo-blue m-auto d-block text-center"
+                    style="max-width: 300px; width: fit-content;"
+                    href="{{route('register', ['redirect_to' => $article->url.'?pay=now', 'payment_process' => true])}}"
+                >
+                    Débloquer cet article pour 1€
+                </a>
+                @endif
             @endif
         </div>
 

diff --git a/routes/web.php b/routes/web.php
index b94a147a1c80f6cd2e676f6fe23aedde6c80e380..da27e72b3747df94b46aec9c7b2e003fafe69b68 100644 (file)
--- a/routes/web.php
+++ b/routes/web.php
@@ -46,7 +46,8 @@ Route::domain(env('CLIENT_DOMAIN_NAME'))->group(function() {
 
     /** Stripe Payment */
     Route::prefix('pay')->middleware('auth')->group(function() {
-       Route::post('payment_intents', 'StripeController@paymentIntents');
+       Route::post('payment-intents', 'StripeController@paymentIntents');
+       Route::get('public-key', 'StripeController@publicKey');
     });
 
     Route::get('unsubscribe/{user}', 'AccountController@unsubscribe')->name('unsubscribe');
@@ -125,7 +126,7 @@ Route::pattern('client_domains', '('.implode('|', [
 
 Route::domain('{client_domains}')->group(function() {
     /** Webhooks */
-    Route::prefix('webhooks')->group(function () {
+    Route::prefix('webhooks')->middleware('json.response')->group(function () {
         Route::post('mailgun-event', 'WebhookController@mailgunEvent');
         Route::get('mailgun-event-test', 'WebhookController@mailgunEventTest');
         Route::post('stripe', 'StripeWebhookController@handleWebhook');