From d3873b37c3647b576925a9353cc9cdd9a4d2a4b6 Mon Sep 17 00:00:00 2001
From: kmacoders <hungkids3003@gmail.com>
Date: Tue, 6 Jul 2021 22:30:02 +0700
Subject: [PATCH] feat: add custom variables buefy

---
 assets/style/main.scss                | 35 ++++++++++++++++++++++++++-
 components/organisms/FeaturedBlog.vue |  5 +++-
 2 files changed, 38 insertions(+), 2 deletions(-)

diff --git a/assets/style/main.scss b/assets/style/main.scss
index a7a5384..f0c535f 100644
--- a/assets/style/main.scss
+++ b/assets/style/main.scss
@@ -1,2 +1,35 @@
+// Import Bulma's core
+@import "~bulma/sass/utilities/_all";
+
+$eHandyPrimaryColor: #0091ea;
+$eHandyPrimaryColor-invert: #fff;
+
 // Set your colors
-$primary: #f00;
+$primary: $eHandyPrimaryColor;
+$primary-invert: $eHandyPrimaryColor-invert;
+
+// Links
+$link: $primary;
+$link-invert: $primary-invert;
+$link-focus-border: $primary;
+
+// 4. Setup your Custom Colors
+$linkedin: #0077b5;
+$linkedin-invert: findcolorinvert($linkedin);
+$twitter: #55acee;
+$twitter-invert: findcolorinvert($twitter);
+$github: #333;
+$github-invert: findcolorinvert($github);
+
+// 5. Add new color variables to the color map.
+$addColors: (
+  "twitter":($twitter, $twitter-invert),
+  "linkedin": ($linkedin, $linkedin-invert),
+  "github": ($github, $github-invert),
+  "primary": ($primary, $primary-invert)
+);
+$colors: map-merge($colors, $addColors);
+
+// Import Bulma and Buefy styles
+@import "~bulma";
+@import "~buefy/src/scss/buefy";
diff --git a/components/organisms/FeaturedBlog.vue b/components/organisms/FeaturedBlog.vue
index 2b3d50d..d2be3ba 100644
--- a/components/organisms/FeaturedBlog.vue
+++ b/components/organisms/FeaturedBlog.vue
@@ -23,7 +23,10 @@
               {{ firstBlog.description }}
             </p>
             <br>
-            <NuxtLink :to="{name: 'blog-slug', params: { slug: firstBlog.slug }}" class="button is-primary">
+            <NuxtLink
+              :to="{name: 'blog-slug', params: { slug: firstBlog.slug }}"
+              class="button is-primary"
+            >
               Đọc thêm
             </NuxtLink>
           </div>