From 3dd9fca138f31a1571dd4fedb6150e39d0c52df9 Mon Sep 17 00:00:00 2001 From: Michael Burton Date: Sun, 4 Feb 2018 12:20:49 +0000 Subject: [PATCH] Add WYSIWYG editor to Create and Edit Post --- package-lock.json | 31 +- package.json | 1 + .../fonts/vendor/trumbowyg/dist/ui/icons.svg | 1 + public/js/backend.js | 640 +++++++++++++++--- public/mix-manifest.json | 2 +- .../app/blog/components/PostCreate.vue | 3 +- .../backend/app/blog/components/PostShow.vue | 6 +- .../js/backend/app/blog/components/index.js | 3 + yarn.lock | 24 +- 9 files changed, 625 insertions(+), 86 deletions(-) create mode 100644 public/fonts/vendor/trumbowyg/dist/ui/icons.svg diff --git a/package-lock.json b/package-lock.json index f8cb161..65e5665 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3016,6 +3016,11 @@ "integrity": "sha1-sgOOhG3DO6pXlhKNCAS0VbjB4h0=", "dev": true }, + "debounce": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/debounce/-/debounce-1.1.0.tgz", + "integrity": "sha512-ZQVKfRVlwRfD150ndzEK8M90ABT+Y/JQKs4Y7U4MXdpuoUkkrr4DwKbVux3YjylA5bUMUj0Nc3pMxPJX6N2QQQ==" + }, "debug": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz", @@ -3429,6 +3434,11 @@ "ware": "1.3.0" } }, + "dropzone": { + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/dropzone/-/dropzone-5.3.0.tgz", + "integrity": "sha1-Qceop8xtI347KGZOegcZZg0Gftw=" + }, "duplexer": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz", @@ -14540,8 +14550,7 @@ "vue": { "version": "2.5.13", "resolved": "https://registry.npmjs.org/vue/-/vue-2.5.13.tgz", - "integrity": "sha512-3D+lY7HTkKbtswDM4BBHgqyq+qo8IAEE8lz8va1dz3LLmttjgo0FxairO4r1iN2OBqk8o1FyL4hvzzTFEdQSEw==", - "dev": true + "integrity": "sha512-3D+lY7HTkKbtswDM4BBHgqyq+qo8IAEE8lz8va1dz3LLmttjgo0FxairO4r1iN2OBqk8o1FyL4hvzzTFEdQSEw==" }, "vue-hot-reload-api": { "version": "2.2.4", @@ -14601,6 +14610,24 @@ "integrity": "sha512-x3LV3wdmmERhVCYy3quqA57NJW7F3i6faas++pJQWtknWT+n7k30F4TVdHvCLn48peTJFRvCpxs3UuFPqgeELg==", "dev": true }, + "vue-wysiwyg": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/vue-wysiwyg/-/vue-wysiwyg-1.4.1.tgz", + "integrity": "sha1-ADQ0kmGIZaMxDO13rS5d2Hwlzls=", + "requires": { + "debounce": "1.1.0", + "vue": "2.5.13", + "vue2-dropzone": "3.0.3" + } + }, + "vue2-dropzone": { + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/vue2-dropzone/-/vue2-dropzone-3.0.3.tgz", + "integrity": "sha512-fVao3GW3KBJSOi1k+lpMob4jwah14f6Mz9vB5MZeRZ0VbVf9bit2cNNB66FJ3xotCeUkSsj1Wd/NY71wZm22vQ==", + "requires": { + "dropzone": "5.3.0" + } + }, "vuex": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/vuex/-/vuex-3.0.1.tgz", diff --git a/package.json b/package.json index 763f40a..c99e159 100644 --- a/package.json +++ b/package.json @@ -25,6 +25,7 @@ "animate.css": "^3.5.2", "dotenv": "^5.0.0", "vue-router": "^3.0.1", + "vue-wysiwyg": "^1.4.1", "vuex": "^3.0.1" } } diff --git a/public/fonts/vendor/trumbowyg/dist/ui/icons.svg b/public/fonts/vendor/trumbowyg/dist/ui/icons.svg new file mode 100644 index 0000000..2415a5a --- /dev/null +++ b/public/fonts/vendor/trumbowyg/dist/ui/icons.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/js/backend.js b/public/js/backend.js index f25e070..b9636c6 100644 --- a/public/js/backend.js +++ b/public/js/backend.js @@ -1669,6 +1669,7 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); // // // +// /* harmony default export */ __webpack_exports__["default"] = ({ data: function data() { @@ -1769,8 +1770,6 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); // // // -// -// /* harmony default export */ __webpack_exports__["default"] = ({ created: function created() { @@ -2030,6 +2029,21 @@ exports.push([module.i, "\n", ""]); // exports +/***/ }), + +/***/ "./node_modules/css-loader/index.js!./node_modules/vue-wysiwyg/dist/vueWysiwyg.css": +/***/ (function(module, exports, __webpack_require__) { + +exports = module.exports = __webpack_require__("./node_modules/css-loader/lib/css-base.js")(false); +// imports + + +// module +exports.push([module.i, "\n.editr {\n border: 1px solid #e4e4e4;\n width: 100%;\n}\n.editr--toolbar {\n background: #f6f6f6;\n border-bottom: 1px solid #e4e4e4;\n position: relative;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n height: 32px;\n}\n.editr--toolbar a {\n display: inline-block;\n width: 8vw;\n max-width: 32px;\n height: 32px;\n color: #333;\n fill: #333;\n cursor: pointer;\n text-align: center;\n line-height: 1;\n}\n.editr--toolbar a:hover {\n background: rgba(0,0,0,0.1);\n}\n.editr--toolbar a:active {\n background: rgba(0,0,0,0.2);\n}\n.editr--toolbar a svg {\n width: 16px;\n height: 16px;\n margin: 8px auto;\n}\n.editr--toolbar a svg path {\n fill: inherit;\n}\n.editr--toolbar a.vw-btn-separator {\n width: 1px;\n margin: 0 10px;\n}\n.editr--toolbar a.vw-btn-separator:hover {\n background: initial;\n cursor: default;\n}\n.editr--toolbar a.vw-btn-separator i {\n border-left: 1px solid rgba(0,0,0,0.1);\n height: 100%;\n position: absolute;\n width: 1px;\n}\n.editr--toolbar .dashboard {\n width: 100%;\n position: absolute;\n top: 32px;\n left: 0;\n text-align: left;\n padding: 0.5rem 1rem;\n background: rgba(255,255,255,0.95);\n border: 1px solid #f6f6f6;\n}\n.editr--content {\n min-height: 150px;\n padding: 0.75rem 0.5rem;\n line-height: 1.33;\n font-family: inherit;\n color: inherit;\n}\n.editr--content[contenteditable=true]:empty:before {\n content: attr(placeholder);\n color: rgba(0,0,0,0.3);\n display: block; /* For Firefox */\n}\n.editr--content img {\n max-width: 100%;\n}\n.editr--content table {\n width: 100%;\n}\n.editr--content table th {\n text-align: left;\n}\n.editr--content:focus {\n outline: 0;\n}\n.editr--content ul li,\n.editr--content ol li {\n list-style-position: inside;\n}/*\n * The MIT License\n * Copyright (c) 2012 Matias Meno \n */\n@-webkit-keyframes passing-through {\n 0% {\n opacity: 0;\n -webkit-transform: translateY(40px);\n -moz-transform: translateY(40px);\n -ms-transform: translateY(40px);\n -o-transform: translateY(40px);\n transform: translateY(40px); }\n 30%, 70% {\n opacity: 1;\n -webkit-transform: translateY(0px);\n -moz-transform: translateY(0px);\n -ms-transform: translateY(0px);\n -o-transform: translateY(0px);\n transform: translateY(0px); }\n 100% {\n opacity: 0;\n -webkit-transform: translateY(-40px);\n -moz-transform: translateY(-40px);\n -ms-transform: translateY(-40px);\n -o-transform: translateY(-40px);\n transform: translateY(-40px); } }\n@-moz-keyframes passing-through {\n 0% {\n opacity: 0;\n -webkit-transform: translateY(40px);\n -moz-transform: translateY(40px);\n -ms-transform: translateY(40px);\n -o-transform: translateY(40px);\n transform: translateY(40px); }\n 30%, 70% {\n opacity: 1;\n -webkit-transform: translateY(0px);\n -moz-transform: translateY(0px);\n -ms-transform: translateY(0px);\n -o-transform: translateY(0px);\n transform: translateY(0px); }\n 100% {\n opacity: 0;\n -webkit-transform: translateY(-40px);\n -moz-transform: translateY(-40px);\n -ms-transform: translateY(-40px);\n -o-transform: translateY(-40px);\n transform: translateY(-40px); } }\n@keyframes passing-through {\n 0% {\n opacity: 0;\n -webkit-transform: translateY(40px);\n -moz-transform: translateY(40px);\n -ms-transform: translateY(40px);\n -o-transform: translateY(40px);\n transform: translateY(40px); }\n 30%, 70% {\n opacity: 1;\n -webkit-transform: translateY(0px);\n -moz-transform: translateY(0px);\n -ms-transform: translateY(0px);\n -o-transform: translateY(0px);\n transform: translateY(0px); }\n 100% {\n opacity: 0;\n -webkit-transform: translateY(-40px);\n -moz-transform: translateY(-40px);\n -ms-transform: translateY(-40px);\n -o-transform: translateY(-40px);\n transform: translateY(-40px); } }\n@-webkit-keyframes slide-in {\n 0% {\n opacity: 0;\n -webkit-transform: translateY(40px);\n -moz-transform: translateY(40px);\n -ms-transform: translateY(40px);\n -o-transform: translateY(40px);\n transform: translateY(40px); }\n 30% {\n opacity: 1;\n -webkit-transform: translateY(0px);\n -moz-transform: translateY(0px);\n -ms-transform: translateY(0px);\n -o-transform: translateY(0px);\n transform: translateY(0px); } }\n@-moz-keyframes slide-in {\n 0% {\n opacity: 0;\n -webkit-transform: translateY(40px);\n -moz-transform: translateY(40px);\n -ms-transform: translateY(40px);\n -o-transform: translateY(40px);\n transform: translateY(40px); }\n 30% {\n opacity: 1;\n -webkit-transform: translateY(0px);\n -moz-transform: translateY(0px);\n -ms-transform: translateY(0px);\n -o-transform: translateY(0px);\n transform: translateY(0px); } }\n@keyframes slide-in {\n 0% {\n opacity: 0;\n -webkit-transform: translateY(40px);\n -moz-transform: translateY(40px);\n -ms-transform: translateY(40px);\n -o-transform: translateY(40px);\n transform: translateY(40px); }\n 30% {\n opacity: 1;\n -webkit-transform: translateY(0px);\n -moz-transform: translateY(0px);\n -ms-transform: translateY(0px);\n -o-transform: translateY(0px);\n transform: translateY(0px); } }\n@-webkit-keyframes pulse {\n 0% {\n -webkit-transform: scale(1);\n -moz-transform: scale(1);\n -ms-transform: scale(1);\n -o-transform: scale(1);\n transform: scale(1); }\n 10% {\n -webkit-transform: scale(1.1);\n -moz-transform: scale(1.1);\n -ms-transform: scale(1.1);\n -o-transform: scale(1.1);\n transform: scale(1.1); }\n 20% {\n -webkit-transform: scale(1);\n -moz-transform: scale(1);\n -ms-transform: scale(1);\n -o-transform: scale(1);\n transform: scale(1); } }\n@-moz-keyframes pulse {\n 0% {\n -webkit-transform: scale(1);\n -moz-transform: scale(1);\n -ms-transform: scale(1);\n -o-transform: scale(1);\n transform: scale(1); }\n 10% {\n -webkit-transform: scale(1.1);\n -moz-transform: scale(1.1);\n -ms-transform: scale(1.1);\n -o-transform: scale(1.1);\n transform: scale(1.1); }\n 20% {\n -webkit-transform: scale(1);\n -moz-transform: scale(1);\n -ms-transform: scale(1);\n -o-transform: scale(1);\n transform: scale(1); } }\n@keyframes pulse {\n 0% {\n -webkit-transform: scale(1);\n -moz-transform: scale(1);\n -ms-transform: scale(1);\n -o-transform: scale(1);\n transform: scale(1); }\n 10% {\n -webkit-transform: scale(1.1);\n -moz-transform: scale(1.1);\n -ms-transform: scale(1.1);\n -o-transform: scale(1.1);\n transform: scale(1.1); }\n 20% {\n -webkit-transform: scale(1);\n -moz-transform: scale(1);\n -ms-transform: scale(1);\n -o-transform: scale(1);\n transform: scale(1); } }\n.dropzone, .dropzone * {\n box-sizing: border-box; }\n\n.dropzone {\n min-height: 150px;\n border: 2px solid rgba(0, 0, 0, 0.3);\n background: white;\n padding: 20px 20px; }\n .dropzone.dz-clickable {\n cursor: pointer; }\n .dropzone.dz-clickable * {\n cursor: default; }\n .dropzone.dz-clickable .dz-message, .dropzone.dz-clickable .dz-message * {\n cursor: pointer; }\n .dropzone.dz-started .dz-message {\n display: none; }\n .dropzone.dz-drag-hover {\n border-style: solid; }\n .dropzone.dz-drag-hover .dz-message {\n opacity: 0.5; }\n .dropzone .dz-message {\n text-align: center;\n margin: 2em 0; }\n .dropzone .dz-preview {\n position: relative;\n display: inline-block;\n vertical-align: top;\n margin: 16px;\n min-height: 100px; }\n .dropzone .dz-preview:hover {\n z-index: 1000; }\n .dropzone .dz-preview:hover .dz-details {\n opacity: 1; }\n .dropzone .dz-preview.dz-file-preview .dz-image {\n border-radius: 20px;\n background: #999;\n background: linear-gradient(to bottom, #eee, #ddd); }\n .dropzone .dz-preview.dz-file-preview .dz-details {\n opacity: 1; }\n .dropzone .dz-preview.dz-image-preview {\n background: white; }\n .dropzone .dz-preview.dz-image-preview .dz-details {\n -webkit-transition: opacity 0.2s linear;\n -moz-transition: opacity 0.2s linear;\n -ms-transition: opacity 0.2s linear;\n -o-transition: opacity 0.2s linear;\n transition: opacity 0.2s linear; }\n .dropzone .dz-preview .dz-remove {\n font-size: 14px;\n text-align: center;\n display: block;\n cursor: pointer;\n border: none; }\n .dropzone .dz-preview .dz-remove:hover {\n text-decoration: underline; }\n .dropzone .dz-preview:hover .dz-details {\n opacity: 1; }\n .dropzone .dz-preview .dz-details {\n z-index: 20;\n position: absolute;\n top: 0;\n left: 0;\n opacity: 0;\n font-size: 13px;\n min-width: 100%;\n max-width: 100%;\n padding: 2em 1em;\n text-align: center;\n color: rgba(0, 0, 0, 0.9);\n line-height: 150%; }\n .dropzone .dz-preview .dz-details .dz-size {\n margin-bottom: 1em;\n font-size: 16px; }\n .dropzone .dz-preview .dz-details .dz-filename {\n white-space: nowrap; }\n .dropzone .dz-preview .dz-details .dz-filename:hover span {\n border: 1px solid rgba(200, 200, 200, 0.8);\n background-color: rgba(255, 255, 255, 0.8); }\n .dropzone .dz-preview .dz-details .dz-filename:not(:hover) {\n overflow: hidden;\n text-overflow: ellipsis; }\n .dropzone .dz-preview .dz-details .dz-filename:not(:hover) span {\n border: 1px solid transparent; }\n .dropzone .dz-preview .dz-details .dz-filename span, .dropzone .dz-preview .dz-details .dz-size span {\n background-color: rgba(255, 255, 255, 0.4);\n padding: 0 0.4em;\n border-radius: 3px; }\n .dropzone .dz-preview:hover .dz-image img {\n -webkit-transform: scale(1.05, 1.05);\n -moz-transform: scale(1.05, 1.05);\n -ms-transform: scale(1.05, 1.05);\n -o-transform: scale(1.05, 1.05);\n transform: scale(1.05, 1.05);\n -webkit-filter: blur(8px);\n filter: blur(8px); }\n .dropzone .dz-preview .dz-image {\n border-radius: 20px;\n overflow: hidden;\n width: 120px;\n height: 120px;\n position: relative;\n display: block;\n z-index: 10; }\n .dropzone .dz-preview .dz-image img {\n display: block; }\n .dropzone .dz-preview.dz-success .dz-success-mark {\n -webkit-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);\n -moz-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);\n -ms-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);\n -o-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);\n animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1); }\n .dropzone .dz-preview.dz-error .dz-error-mark {\n opacity: 1;\n -webkit-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);\n -moz-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);\n -ms-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);\n -o-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);\n animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1); }\n .dropzone .dz-preview .dz-success-mark, .dropzone .dz-preview .dz-error-mark {\n pointer-events: none;\n opacity: 0;\n z-index: 500;\n position: absolute;\n display: block;\n top: 50%;\n left: 50%;\n margin-left: -27px;\n margin-top: -27px; }\n .dropzone .dz-preview .dz-success-mark svg, .dropzone .dz-preview .dz-error-mark svg {\n display: block;\n width: 54px;\n height: 54px; }\n .dropzone .dz-preview.dz-processing .dz-progress {\n opacity: 1;\n -webkit-transition: all 0.2s linear;\n -moz-transition: all 0.2s linear;\n -ms-transition: all 0.2s linear;\n -o-transition: all 0.2s linear;\n transition: all 0.2s linear; }\n .dropzone .dz-preview.dz-complete .dz-progress {\n opacity: 0;\n -webkit-transition: opacity 0.4s ease-in;\n -moz-transition: opacity 0.4s ease-in;\n -ms-transition: opacity 0.4s ease-in;\n -o-transition: opacity 0.4s ease-in;\n transition: opacity 0.4s ease-in; }\n .dropzone .dz-preview:not(.dz-processing) .dz-progress {\n -webkit-animation: pulse 6s ease infinite;\n -moz-animation: pulse 6s ease infinite;\n -ms-animation: pulse 6s ease infinite;\n -o-animation: pulse 6s ease infinite;\n animation: pulse 6s ease infinite; }\n .dropzone .dz-preview .dz-progress {\n opacity: 1;\n z-index: 1000;\n pointer-events: none;\n position: absolute;\n height: 16px;\n left: 50%;\n top: 50%;\n margin-top: -8px;\n width: 80px;\n margin-left: -40px;\n background: rgba(255, 255, 255, 0.9);\n -webkit-transform: scale(1);\n border-radius: 8px;\n overflow: hidden; }\n .dropzone .dz-preview .dz-progress .dz-upload {\n background: #333;\n background: linear-gradient(to bottom, #666, #444);\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n width: 0;\n -webkit-transition: width 300ms ease-in-out;\n -moz-transition: width 300ms ease-in-out;\n -ms-transition: width 300ms ease-in-out;\n -o-transition: width 300ms ease-in-out;\n transition: width 300ms ease-in-out; }\n .dropzone .dz-preview.dz-error .dz-error-message {\n display: block; }\n .dropzone .dz-preview.dz-error:hover .dz-error-message {\n opacity: 1;\n pointer-events: auto; }\n .dropzone .dz-preview .dz-error-message {\n pointer-events: none;\n z-index: 1000;\n position: absolute;\n display: block;\n display: none;\n opacity: 0;\n -webkit-transition: opacity 0.3s ease;\n -moz-transition: opacity 0.3s ease;\n -ms-transition: opacity 0.3s ease;\n -o-transition: opacity 0.3s ease;\n transition: opacity 0.3s ease;\n border-radius: 8px;\n font-size: 13px;\n top: 130px;\n left: -10px;\n width: 140px;\n background: #be2626;\n background: linear-gradient(to bottom, #be2626, #a92222);\n padding: 0.5em 1.2em;\n color: white; }\n .dropzone .dz-preview .dz-error-message:after {\n content: '';\n position: absolute;\n top: -6px;\n left: 64px;\n width: 0;\n height: 0;\n border-left: 6px solid transparent;\n border-right: 6px solid transparent;\n border-bottom: 6px solid #be2626; }\n\n.vue-dropzone {\n border: 2px solid #E5E5E5;\n font-family: 'Arial', sans-serif;\n letter-spacing: 0.2px;\n color: #777;\n transition: background-color 0.2s linear;\n}\n.vue-dropzone:hover {\n background-color: #F6F6F6;\n}\n.vue-dropzone i {\n color: #CCC;\n}\n.vue-dropzone .dz-preview .dz-image {\n border-radius: 0;\n width: 100%;\n height: 100%;\n}\n.vue-dropzone .dz-preview .dz-image img:not([src]) {\n width: 200px;\n height: 200px;\n}\n.vue-dropzone .dz-preview .dz-image:hover img {\n transform: none;\n -webkit-filter: none;\n}\n.vue-dropzone .dz-preview .dz-details {\n bottom: 0;\n top: 0;\n color: white;\n background-color: rgba(33, 150, 243, 0.8);\n transition: opacity .2s linear;\n text-align: left;\n}\n.vue-dropzone .dz-preview .dz-details .dz-filename {\n overflow: hidden;\n}\n.vue-dropzone .dz-preview .dz-details .dz-filename span,\n.vue-dropzone .dz-preview .dz-details .dz-size span {\n background-color: transparent;\n}\n.vue-dropzone .dz-preview .dz-details .dz-filename:not(:hover) span {\n border: none;\n}\n.vue-dropzone .dz-preview .dz-details .dz-filename:hover span {\n background-color: transparent;\n border: none;\n}\n.vue-dropzone .dz-preview .dz-progress .dz-upload {\n background: #cccccc;\n}\n.vue-dropzone .dz-preview .dz-remove {\n position: absolute;\n z-index: 30;\n color: white;\n margin-left: 15px;\n padding: 10px;\n top: inherit;\n bottom: 15px;\n border: 2px white solid;\n text-decoration: none;\n text-transform: uppercase;\n font-size: 0.8rem;\n font-weight: 800;\n letter-spacing: 1.1px;\n opacity: 0;\n}\n.vue-dropzone .dz-preview:hover .dz-remove {\n opacity: 1;\n}\n.vue-dropzone .dz-preview .dz-success-mark,\n.vue-dropzone .dz-preview .dz-error-mark {\n margin-left: auto;\n margin-top: auto;\n width: 100%;\n top: 35%;\n left: 0;\n}\n.vue-dropzone .dz-preview .dz-success-mark svg,\n.vue-dropzone .dz-preview .dz-error-mark svg {\n margin-left: auto;\n margin-right: auto;\n}\n.vue-dropzone .dz-preview .dz-error-message {\n top: calc(15%);\n margin-left: auto;\n margin-right: auto;\n left: 0;\n width: 100%;\n}\n.vue-dropzone .dz-preview .dz-error-message:after {\n bottom: -6px;\n top: initial;\n border-top: 6px solid #a92222;\n border-bottom: none;\n}\n\n\n.form[data-v-ea2a38b0] {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-line-pack: end;\n align-content: flex-end;\n}\n.form label[data-v-ea2a38b0] {\n margin-right: 1rem;\n}", ""]); + +// exports + + /***/ }), /***/ "./node_modules/css-loader/lib/css-base.js": @@ -19619,6 +19633,462 @@ process.umask = function() { return 0; }; /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__("./node_modules/webpack/buildin/global.js"), __webpack_require__("./node_modules/process/browser.js"))) +/***/ }), + +/***/ "./node_modules/style-loader/lib/addStyles.js": +/***/ (function(module, exports, __webpack_require__) { + +/* + MIT License http://www.opensource.org/licenses/mit-license.php + Author Tobias Koppers @sokra +*/ + +var stylesInDom = {}; + +var memoize = function (fn) { + var memo; + + return function () { + if (typeof memo === "undefined") memo = fn.apply(this, arguments); + return memo; + }; +}; + +var isOldIE = memoize(function () { + // Test for IE <= 9 as proposed by Browserhacks + // @see http://browserhacks.com/#hack-e71d8692f65334173fee715c222cb805 + // Tests for existence of standard globals is to allow style-loader + // to operate correctly into non-standard environments + // @see https://github.com/webpack-contrib/style-loader/issues/177 + return window && document && document.all && !window.atob; +}); + +var getElement = (function (fn) { + var memo = {}; + + return function(selector) { + if (typeof memo[selector] === "undefined") { + memo[selector] = fn.call(this, selector); + } + + return memo[selector] + }; +})(function (target) { + return document.querySelector(target) +}); + +var singleton = null; +var singletonCounter = 0; +var stylesInsertedAtTop = []; + +var fixUrls = __webpack_require__("./node_modules/style-loader/lib/urls.js"); + +module.exports = function(list, options) { + if (typeof DEBUG !== "undefined" && DEBUG) { + if (typeof document !== "object") throw new Error("The style-loader cannot be used in a non-browser environment"); + } + + options = options || {}; + + options.attrs = typeof options.attrs === "object" ? options.attrs : {}; + + // Force single-tag solution on IE6-9, which has a hard limit on the # of