Update

Co-Authored-By: JehanKandy <[email protected]>

Author: BackendExpert

jkcss/v101-alpha2/buttons/button.css

@@ -1,34 +1,3 @@
-@import url("https://fonts.googleapis.com/css2?family=Kanit&family=Roboto&display=swap");
-:root {
-  --jk-blue: #1672fd;
-  --jk-blue-hover: #025ce4;
-  --text-color: white;
-  --jk-gray: grey;
-  --jk-gray-hover: rgb(114, 114, 114);
-  --jk-green: #1b8b57;
-  --jk-green-hover: #147045;
-  --jk-red: #ca2d3dee;
-  --jk-red-hover: #b32432ee;
-  --jk-yellow: #ff9900;
-  --jk-yellow-hover: #ff9900e3;
-  --jk-lightblue: #54b4d3;
-  --jk-lightblue-hover: #54b3d3ea;
-  --jk-purple: #A020F0;
-  --title-font-family: "Kanit", sans-serif;
-  --jk-site-font: "Roboto", sans-serif;
-}
-
-.jk-btn, .jk-blue {
-  padding: 15px 25px;
-  transition: 0.4s;
-  border-radius: 5px;
-}
-
-.jk-btn:hover, .jk-blue:hover {
-  cursor: pointer;
-  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
-}
-
 .no-border, .jk-info:hover, .jk-info, .jk-yellow:hover, .jk-yellow, .jk-red:hover, .jk-red, .jk-green:hover, .jk-green, .jk-gray:hover, .jk-gray, .jk-blue:hover, .jk-blue {
   border: none;
   color: var(--text-color);

jkcss/v101-alpha2/buttons/button.min.css

@@ -1,4 +1,3 @@
-@import "../root";
 
 .no-border{
     border: none;
@@ -8,7 +7,6 @@
 .jk-blue{
     background-color: var(--jk-blue);
     @extend .no-border;
-    @extend .jk-btn;
 }
 .jk-blue:hover{
     background-color: var(--jk-blue-hover);

jkcss/v101-alpha2/buttons/button.scss

@@ -1,35 +1,4 @@
 @import url("https://fonts.googleapis.com/css2?family=Kanit&family=Roboto&display=swap");
-@import url("https://fonts.googleapis.com/css2?family=Kanit&family=Roboto&display=swap");
-:root {
-  --jk-blue: #1672fd;
-  --jk-blue-hover: #025ce4;
-  --text-color: white;
-  --jk-gray: grey;
-  --jk-gray-hover: rgb(114, 114, 114);
-  --jk-green: #1b8b57;
-  --jk-green-hover: #147045;
-  --jk-red: #ca2d3dee;
-  --jk-red-hover: #b32432ee;
-  --jk-yellow: #ff9900;
-  --jk-yellow-hover: #ff9900e3;
-  --jk-lightblue: #54b4d3;
-  --jk-lightblue-hover: #54b3d3ea;
-  --jk-purple: #A020F0;
-  --title-font-family: "Kanit", sans-serif;
-  --jk-site-font: "Roboto", sans-serif;
-}
-
-.jk-btn, .jk-blue {
-  padding: 15px 25px;
-  transition: 0.4s;
-  border-radius: 5px;
-}
-
-.jk-btn:hover, .jk-blue:hover {
-  cursor: pointer;
-  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
-}
-
 :root {
   --jk-blue: #1672fd;
   --jk-blue-hover: #025ce4;
@@ -49,13 +18,13 @@
   --jk-site-font: "Roboto", sans-serif;
 }
 
-.jk-btn, .jk-blue {
+.jkbtn {
   padding: 15px 25px;
   transition: 0.4s;
   border-radius: 5px;
 }
 
-.jk-btn:hover, .jk-blue:hover {
+.jkbtn:hover {
   cursor: pointer;
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
 }

jkcss/v101-alpha2/jkcss.css

@@ -18,13 +18,13 @@
   --jk-site-font: "Roboto", sans-serif;
 }
 
-.jk-btn {
+.jkbtn {
   padding: 15px 25px;
   transition: 0.4s;
   border-radius: 5px;
 }
 
-.jk-btn:hover {
+.jkbtn:hover {
   cursor: pointer;
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
 }

jkcss/v101-alpha2/jkcss.min.css

@@ -19,13 +19,13 @@
   --jk-site-font: "Roboto", sans-serif;
 }
 
-.jk-btn {
+.jkbtn {
   padding: 15px 25px;
   transition: 0.4s;
   border-radius: 5px;
 }
 
-.jk-btn:hover {
+.jkbtn:hover {
   cursor: pointer;
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
 }