From ef42e59cfdf4b026b05e232dd03cc8045442e200 Mon Sep 17 00:00:00 2001
From: timothypidashev <pidashev.tim@gmail.com>
Date: Thu, 15 Jul 2021 03:21:01 +0000
Subject: [PATCH] add custom scss for bootstrap

---
 assets/scss/custom.scss | 67 +++++++----------------------------------
 nuxt.config.js          | 16 +++++++++-
 package.json            |  2 +-
 plugins/bootstrap.js    |  4 +++
 4 files changed, 31 insertions(+), 58 deletions(-)
 create mode 100644 plugins/bootstrap.js

diff --git a/assets/scss/custom.scss b/assets/scss/custom.scss
index 660f226..36e2ccc 100644
--- a/assets/scss/custom.scss
+++ b/assets/scss/custom.scss
@@ -1,57 +1,12 @@
-$primary: #359499;
-$secondary: #98ddde;
-$success: #81894e;
-$info: #185190;
-$warning: #ffdb3b;
-$danger: #f36e60;
-$light: #f5fbfb;
-$dark: #040b0c;
+$theme-colors: (
+  'primary': #145bea,
+  'secondary': #833bec,
+  'success': #1ce1ac,
+  'info': #ff7d50,
+  'warning': #ffbe0b,
+  'danger': #ff007f,
+  'light': #c0ccda,
+  'dark': #001738,
+);
 
-$link-hover-decoration: none;
-$border-radius: 0;
-$font-family-sans-serif: "Fira Sans", sans-serif;
-$font-family-monospace: "Fira Mono", monospace;
-$font-weight-bold: 600;
-
-@import "~bootstrap/scss/functions";
-@import "~bootstrap/scss/variables";
-@import "~bootstrap/scss/mixins";
-@import "~bootstrap/scss/root";
-@import "~bootstrap/scss/reboot";
-@import "~bootstrap/scss/type";
-@import "~bootstrap/scss/images";
-// @import "~bootstrap/scss/code";
-@import "~bootstrap/scss/grid";
-@import "~bootstrap/scss/tables";
-@import "~bootstrap/scss/forms";
-@import "~bootstrap/scss/buttons";
-@import "~bootstrap/scss/transitions";
-@import "~bootstrap/scss/dropdown";
-@import "~bootstrap/scss/button-group";
-// @import "~bootstrap/scss/input-group";
-@import "~bootstrap/scss/custom-forms";
-@import "~bootstrap/scss/nav";
-@import "~bootstrap/scss/navbar";
-@import "~bootstrap/scss/card";
-@import "~bootstrap/scss/breadcrumb";
-// @import "~bootstrap/scss/pagination";
-// @import "~bootstrap/scss/badge";
-@import "~bootstrap/scss/jumbotron";
-// @import "~bootstrap/scss/alert";
-// @import "~bootstrap/scss/progress";
-// @import "~bootstrap/scss/media";
-@import "~bootstrap/scss/list-group";
-// @import "~bootstrap/scss/close";
-// @import "~bootstrap/scss/toasts";
-// @import "~bootstrap/scss/modal";
-// @import "~bootstrap/scss/tooltip";
-// @import "~bootstrap/scss/popover";
-// @import "~bootstrap/scss/carousel";
-// @import "~bootstrap/scss/spinners";
-@import "~bootstrap/scss/utilities";
-// @import "~bootstrap/scss/print";
-
-::selection {
-  background-color: $primary;
-  color: #fff;
-}
+@import '~/node_modules/bootstrap/scss/bootstrap.scss';
\ No newline at end of file
diff --git a/nuxt.config.js b/nuxt.config.js
index 8c65026..3aaa849 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -18,7 +18,7 @@ export default {
   },
 
   // Global CSS: https://go.nuxtjs.dev/config-css
-  css: [{ src: "@/assets/scss/custom", lang: "scss" }],
+  css: ['@/assets/scss/custom.scss'],
 
   // Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
   plugins: [],
@@ -32,6 +32,20 @@ export default {
   // Modules: https://go.nuxtjs.dev/config-modules
   modules: ['bootstrap-vue/nuxt'],
 
+  module: {
+    rules: [
+      {
+        test: /\.s[ac]ss$/i,
+        use: ['style-loader', 'css-loader', 'sass-loader'],
+      },
+    ],
+  },
+
+  bootstrapVue: {
+    bootstrapCSS: false,
+    icons: true,
+  },
+
   // Build Configuration: https://go.nuxtjs.dev/config-build
   build: {}
 };
diff --git a/package.json b/package.json
index 14687de..6b9a1b3 100644
--- a/package.json
+++ b/package.json
@@ -13,7 +13,7 @@
     "bootstrap-vue": "^2.21.2",
     "core-js": "^3.15.0",
     "nuxt": "^2.15.7",
-    "sass-loader": "^12.1.0",
+    "sass-loader": "^10.1.1",
     "node-sass": "^6.0.1",
     "bootstrap": "^5.0.2"
     
diff --git a/plugins/bootstrap.js b/plugins/bootstrap.js
new file mode 100644
index 0000000..d0f869b
--- /dev/null
+++ b/plugins/bootstrap.js
@@ -0,0 +1,4 @@
+import Vue from 'vue'
+import { BootstrapVue, IconsPlugin } from 'bootstrap-vue'
+Vue.use(BootstrapVue)
+Vue.use(IconsPlugin)