From c47a02c529f1b100eb7bae5d4821c014f7af97a6 Mon Sep 17 00:00:00 2001
From: Avior <github@avior.me>
Date: Tue, 4 Oct 2022 00:51:39 +0200
Subject: [PATCH] feat: Remove post install compilation

Signed-off-by: Avior <github@avior.me>
---
 .npmignore                              |   4 +
 package.json                            |  17 +-
 src/Box/Box.module.styl                 |   2 +-
 src/Button/Button.module.styl           |   4 +-
 src/Checkbox/Checkbox.module.styl       |   2 +-
 src/Input/Input.module.styl             |   2 +-
 src/Menu/Menu.module.styl               |   2 +-
 src/ProgressBar/ProgressBar.module.styl |   4 +-
 src/Sidebar/Sidebar.module.styl         |   6 +-
 src/Text/Text.module.styl               |   2 +-
 src/colors.styl                         | 499 +++++++++++++-----------
 src/config.styl                         |  21 +-
 src/stylusUtils.js                      |  11 -
 13 files changed, 288 insertions(+), 288 deletions(-)
 delete mode 100644 src/stylusUtils.js

diff --git a/.npmignore b/.npmignore
index 14081f6..1061eb2 100644
--- a/.npmignore
+++ b/.npmignore
@@ -1,4 +1,8 @@
 .github/
+src/
+README.md
+tsconfig.json
+vite.config.js
 .storybook/
 node_modules/
 *.stories.js
diff --git a/package.json b/package.json
index 82e499e..ed08a8e 100644
--- a/package.json
+++ b/package.json
@@ -10,11 +10,16 @@
 		"@storybook/builder-vite": "^0.2.2",
 		"@storybook/cli": "^6",
 		"@storybook/react": "^6",
+		"@types/json5": "^2",
 		"@types/node": "^18",
+		"@types/react": "^18",
+		"@types/react-dom": "^18",
 		"next": "^12",
 		"react": "^18",
 		"react-dom": "^18",
-		"style-loader": "^3"
+		"style-loader": "^3",
+		"typescript": "^4",
+		"vite": "^3"
 	},
 	"peerDependencies": {
 		"next": ">=11.0.0",
@@ -24,16 +29,10 @@
 	"scripts": {
 		"dev": "start-storybook --port 6006 --no-version-updates --disable-telemetry --no-manager-cache --modern --no-open",
 		"build": "npx vite build && npx tsc --emitDeclarationOnly",
-		"prepublishOnly": "npx vite build && npx tsc --emitDeclarationOnly",
-		"postinstall": "npx vite build && npx tsc --emitDeclarationOnly"
+		"prepublishOnly": "npx vite build && npx tsc --emitDeclarationOnly"
 	},
 	"dependencies": {
 		"@dzeio/object-util": "^1",
-		"@types/react": "^18",
-		"@types/json5": "^2",
-		"@types/react-dom": "^18",
-		"typescript": "^4",
-		"lucide-react": "^0.88.0",
-		"vite": "^3"
+		"lucide-react": "^0.88.0"
 	}
 }
diff --git a/src/Box/Box.module.styl b/src/Box/Box.module.styl
index 8842be4..4a2bc73 100644
--- a/src/Box/Box.module.styl
+++ b/src/Box/Box.module.styl
@@ -31,6 +31,6 @@
 	width 24px
 	height 24px
 	display inline-block
-	background nativeRGB(var(--theme-color))
+	background nativeRGB(var(--theme-500))
 	border-radius 4px
 	margin-right 8px
diff --git a/src/Button/Button.module.styl b/src/Button/Button.module.styl
index b14bb91..97cf713 100644
--- a/src/Button/Button.module.styl
+++ b/src/Button/Button.module.styl
@@ -17,7 +17,7 @@
 	justify-content center
 	align-items center
 	color white
-	background-color nativeRGB(var(--theme-color))
+	background-color nativeRGB(var(--theme-500))
 
 	// Chrome Specific
 	outline none
@@ -33,7 +33,7 @@
 
 		&:active
 		&:focus
-			background-color nativeRGB(var(--theme-color))
+			background-color nativeRGB(var(--theme-500))
 			color white
 
 	&.outline
diff --git a/src/Checkbox/Checkbox.module.styl b/src/Checkbox/Checkbox.module.styl
index e36646a..6cabbbb 100644
--- a/src/Checkbox/Checkbox.module.styl
+++ b/src/Checkbox/Checkbox.module.styl
@@ -30,7 +30,7 @@ $backColor = #757575
 			border-radius 20px
 			position absolute
 			transition all $transition
-			background nativeRGB(var(--theme-color))
+			background nativeRGB(var(--theme-500))
 
 	svg
 		transition $transition
diff --git a/src/Input/Input.module.styl b/src/Input/Input.module.styl
index d992ac6..a13b6e0 100644
--- a/src/Input/Input.module.styl
+++ b/src/Input/Input.module.styl
@@ -140,7 +140,7 @@
 					@media (prefers-color-scheme dark)
 						color white
 			&:focus
-				border-color nativeRGB(var(--theme-color))
+				border-color nativeRGB(var(--theme-500))
 
 				~ svg
 					color @border-color
diff --git a/src/Menu/Menu.module.styl b/src/Menu/Menu.module.styl
index 9f857c0..6149668 100644
--- a/src/Menu/Menu.module.styl
+++ b/src/Menu/Menu.module.styl
@@ -2,7 +2,7 @@
 
 .menu
 	&.outline
-		border 2px solid nativeRGB(var(--theme-color))
+		border 2px solid nativeRGB(var(--theme-500))
 	&.hidden
 		display none
 	ul
diff --git a/src/ProgressBar/ProgressBar.module.styl b/src/ProgressBar/ProgressBar.module.styl
index c3a7c70..a1f3c97 100644
--- a/src/ProgressBar/ProgressBar.module.styl
+++ b/src/ProgressBar/ProgressBar.module.styl
@@ -2,7 +2,7 @@
 
 .bar
 	width 100%
-	background nativeRGBA(var(--theme-color), 0.15)
+	background nativeRGBA(var(--theme-500), 0.15)
 	height 8px
 	border-radius 8px
 
@@ -21,5 +21,5 @@
 		height 100%
 		max-width 100%
 		width 0
-		background nativeRGB(var(--theme-color))
+		background nativeRGB(var(--theme-500))
 		border-radius 8px
diff --git a/src/Sidebar/Sidebar.module.styl b/src/Sidebar/Sidebar.module.styl
index 280f0d7..c9d2585 100644
--- a/src/Sidebar/Sidebar.module.styl
+++ b/src/Sidebar/Sidebar.module.styl
@@ -59,7 +59,7 @@
 					background nativeRGB(var(--gray-700))
 			&:active
 				color white
-				background nativeRGB(var(--theme-color))
+				background nativeRGB(var(--theme-500))
 	&.short
 		width 88px
 		.userSpace > div:not(:last-child)
@@ -145,7 +145,7 @@
 					background nativeRGB(var(--gray-700))
 			&:active
 				color white
-				background nativeRGB(var(--theme-color))
+				background nativeRGB(var(--theme-500))
 
 			padding 8px
 			display flex
@@ -169,7 +169,7 @@
 
 		&.active > div
 			color white
-			background nativeRGB(var(--theme-color))
+			background nativeRGB(var(--theme-500))
 	ul
 		list-style none
 		margin 0
diff --git a/src/Text/Text.module.styl b/src/Text/Text.module.styl
index 04a9e66..588a842 100644
--- a/src/Text/Text.module.styl
+++ b/src/Text/Text.module.styl
@@ -15,7 +15,7 @@
 	color black
 
 .main
-	color nativeRGB(var(--theme-color))
+	color nativeRGB(var(--theme-500))
 
 for size in 36 28 24 20 18 16 14
 	.size-{size}
diff --git a/src/colors.styl b/src/colors.styl
index 81789f5..b6b92a9 100644
--- a/src/colors.styl
+++ b/src/colors.styl
@@ -2,12 +2,6 @@
 hextorgb(color)
 	red(color) unquote(', ') green(color) unquote(', ') blue(color)
 
-// not as :root for other components to use the closest value
-*
-	--theme-color: var(--theme-500)
-	// @media (prefers-color-scheme dark)
-	// 	--theme-color: var(--theme-500)
-
 generateTheme($name, c50, c100, c200, c300, c400, c500, c600, c700, c800, c900)
 	{"--" + $name + "-50"}: hextorgb(c50)
 	{"--" + $name + "-100"}: hextorgb(c100)
@@ -19,16 +13,6 @@ generateTheme($name, c50, c100, c200, c300, c400, c500, c600, c700, c800, c900)
 	{"--" + $name + "-700"}: hextorgb(c700)
 	{"--" + $name + "-800"}: hextorgb(c800)
 	{"--" + $name + "-900"}: hextorgb(c900)
-	{"--" + $name + "-50-color"}: hextorgb(c50)
-	{"--" + $name + "-100-color"}: hextorgb(c100)
-	{"--" + $name + "-200-color"}: hextorgb(c200)
-	{"--" + $name + "-300-color"}: hextorgb(c300)
-	{"--" + $name + "-400-color"}: hextorgb(c400)
-	{"--" + $name + "-500-color"}: hextorgb(c500)
-	{"--" + $name + "-600-color"}: hextorgb(c600)
-	{"--" + $name + "-700-color"}: hextorgb(c700)
-	{"--" + $name + "-800-color"}: hextorgb(c800)
-	{"--" + $name + "-900-color"}: hextorgb(c900)
 	{"--" + $name + "-50-text"}: light(c50 ) ? black : white
 	{"--" + $name + "-100-text"}: light(c100) ? black : white
 	{"--" + $name + "-200-text"}: light(c200) ? black : white
@@ -41,278 +25,321 @@ generateTheme($name, c50, c100, c200, c300, c400, c500, c600, c700, c800, c900)
 	{"--" + $name + "-900-text"}: light(c900) ? black : white
 
 :root
-	generateTheme(
-		'test',
-		#000,
-		#100,
-		#200,
-		#003,
-		#004,
-		#005,
-		#006,
-		#007,
-		#008,
-		#fff
-	)
 	// gray is not a theme
-	--gray-50 hextorgb(#FAFAFA)
-	--gray-100 hextorgb(#F5F5F5)
-	--gray-200 hextorgb(#EEEEEE)
-	--gray-300 hextorgb(#E0E0E0)
-	--gray-400 hextorgb(#BDBDBD)
-	--gray-500 hextorgb(#9E9E9E)
-	--gray-600 hextorgb(#757575)
-	--gray-700 hextorgb(#616161)
-	--gray-800 hextorgb(#424242)
-	--gray-900 hextorgb(#212121)
-
+	generateTheme(
+		'gray',
+		#FAFAFA,
+		#F5F5F5,
+		#EEEEEE,
+		#E0E0E0,
+		#BDBDBD,
+		#9E9E9E,
+		#757575,
+		#616161,
+		#424242,
+		#212121
+	)
 :root
 :root.theme-base-red
 .red
 .red *
-	--theme-50: hextorgb(#FFEBEE)
-	--theme-100: hextorgb(#FFCDD2)
-	--theme-200: hextorgb(#EF9A9A)
-	--theme-300: hextorgb(#E57373)
-	--theme-400: hextorgb(#EF5350)
-	--theme-500: hextorgb(#F44336)
-	--theme-600: hextorgb(#E53935)
-	--theme-700: hextorgb(#D32F2F)
-	--theme-800: hextorgb(#C62828)
-	--theme-900: hextorgb(#B71C1C)
-
+	generateTheme(
+		'theme',
+		#FFEBEE,
+		#FFCDD2,
+		#EF9A9A,
+		#E57373,
+		#EF5350,
+		#F44336,
+		#E53935,
+		#D32F2F,
+		#C62828,
+		#D50000
+	)
 :root.theme-base-pink
 .pink
 .pink *
-	--theme-50: hextorgb(#FCE4EC)
-	--theme-100: hextorgb(#F8BBD0)
-	--theme-200: hextorgb(#F48FB1)
-	--theme-300: hextorgb(#F06292)
-	--theme-400: hextorgb(#EC407A)
-	--theme-500: hextorgb(#E91E63)
-	--theme-600: hextorgb(#D81B60)
-	--theme-700: hextorgb(#C2185B)
-	--theme-800: hextorgb(#AD1457)
-	--theme-900: hextorgb(#880E4F)
-
+	generateTheme(
+		'theme',
+		#FCE4EC,
+		#F8BBD0,
+		#F48FB1,
+		#F06292,
+		#EC407A,
+		#E91E63,
+		#D81B60,
+		#C2185B,
+		#AD1457,
+		#880E4F
+	)
 :root.theme-base-purple
 .purple
 .purple *
-	--theme-50: hextorgb(#F3E5F5)
-	--theme-100: hextorgb(#E1BEE7)
-	--theme-200: hextorgb(#CE93D8)
-	--theme-300: hextorgb(#BA68C8)
-	--theme-400: hextorgb(#AB47BC)
-	--theme-500: hextorgb(#9C27B0)
-	--theme-600: hextorgb(#8E24AA)
-	--theme-700: hextorgb(#7B1FA2)
-	--theme-800: hextorgb(#6A1B9A)
-	--theme-900: hextorgb(#4A148C)
-
+	generateTheme(
+		'theme',
+		#F3E5F5,
+		#E1BEE7,
+		#CE93D8,
+		#BA68C8,
+		#AB47BC,
+		#9C27B0,
+		#8E24AA,
+		#7B1FA2,
+		#6A1B9A,
+		#4A148C
+	)
 .deep-purple
 .deep-purple *
-	--theme-50 hextorgb(#EDE7F6)
-	--theme-100 hextorgb(#D1C4E9)
-	--theme-200 hextorgb(#B39DDB)
-	--theme-300 hextorgb(#9575CD)
-	--theme-400 hextorgb(#7E57C2)
-	--theme-500 hextorgb(#673AB7)
-	--theme-600 hextorgb(#5E35B1)
-	--theme-700 hextorgb(#512DA8)
-	--theme-800 hextorgb(#4527A0)
-	--theme-900 hextorgb(#311B92)
-
+	generateTheme(
+		'theme',
+		#EDE7F6,
+		#D1C4E9,
+		#B39DDB,
+		#9575CD,
+		#7E57C2,
+		#673AB7,
+		#5E35B1,
+		#512DA8,
+		#4527A0,
+		#311B92
+	)
 :root.theme-base-indigo
 .indigo
 .indigo *
-	--theme-50 hextorgb(#E8EAF6)
-	--theme-100 hextorgb(#C5CAE9)
-	--theme-200 hextorgb(#9FA8DA)
-	--theme-300 hextorgb(#7986CB)
-	--theme-400 hextorgb(#5C6BC0)
-	--theme-500 hextorgb(#3F51B5)
-	--theme-600 hextorgb(#3949AB)
-	--theme-700 hextorgb(#303F9F)
-	--theme-800 hextorgb(#283593)
-	--theme-900 hextorgb(#1A237E)
-
+	generateTheme(
+		'theme',
+		#E8EAF6,
+		#C5CAE9,
+		#9FA8DA,
+		#7986CB,
+		#5C6BC0,
+		#3F51B5,
+		#3949AB,
+		#303F9F,
+		#283593,
+		#1A237E
+	)
 :root.theme-base-blue
 .blue
 .blue *
-	--theme-50 hextorgb(#E3F2FD)
-	--theme-100 hextorgb(#BBDEFB)
-	--theme-200 hextorgb(#90CAF9)
-	--theme-300 hextorgb(#64B5F6)
-	--theme-400 hextorgb(#42A5F5)
-	--theme-500 hextorgb(#2196F3)
-	--theme-600 hextorgb(#1E88E5)
-	--theme-700 hextorgb(#1976D2)
-	--theme-800 hextorgb(#1565C0)
-	--theme-900 hextorgb(#0D47A1)
-
+	generateTheme(
+		'theme',
+		#E3F2FD,
+		#BBDEFB,
+		#90CAF9,
+		#64B5F6,
+		#42A5F5,
+		#2196F3,
+		#1E88E5,
+		#1976D2,
+		#1565C0,
+		#0D47A1
+	)
 .light-blue
 .light-blue *
-	--theme-50 hextorgb(#E1F5FE)
-	--theme-100 hextorgb(#B3E5FC)
-	--theme-200 hextorgb(#81D4FA)
-	--theme-300 hextorgb(#4FC3F7)
-	--theme-400 hextorgb(#29B6F6)
-	--theme-500 hextorgb(#03A9F4)
-	--theme-600 hextorgb(#039BE5)
-	--theme-700 hextorgb(#0288D1)
-	--theme-800 hextorgb(#0277BD)
-	--theme-900 hextorgb(#01579B)
-
+	generateTheme(
+		'theme',
+		#E1F5FE,
+		#B3E5FC,
+		#81D4FA,
+		#4FC3F7,
+		#29B6F6,
+		#03A9F4,
+		#039BE5,
+		#0288D1,
+		#0277BD,
+		#01579B
+	)
 :root.theme-base-cyan
 .cyan
 .cyan *
-	--theme-50 hextorgb(#E0F7FA)
-	--theme-100 hextorgb(#B2EBF2)
-	--theme-200 hextorgb(#80DEEA)
-	--theme-300 hextorgb(#4DD0E1)
-	--theme-400 hextorgb(#26C6DA)
-	--theme-500 hextorgb(#00BCD4)
-	--theme-600 hextorgb(#00ACC1)
-	--theme-700 hextorgb(#0097A7)
-	--theme-800 hextorgb(#00838F)
-	--theme-900 hextorgb(#006064)
-
+	generateTheme(
+		'theme',
+		#E0F7FA,
+		#B2EBF2,
+		#80DEEA,
+		#4DD0E1,
+		#26C6DA,
+		#00BCD4,
+		#00ACC1,
+		#0097A7,
+		#00838F,
+		#006064
+	)
 :root.theme-base-teal
 .teal
 .teal *
-	--theme-50 hextorgb(#E0F2F1)
-	--theme-100 hextorgb(#B2DFDB)
-	--theme-200 hextorgb(#80CBC4)
-	--theme-300 hextorgb(#4DB6AC)
-	--theme-400 hextorgb(#26A69A)
-	--theme-500 hextorgb(#009688)
-	--theme-600 hextorgb(#00897B)
-	--theme-700 hextorgb(#00796B)
-	--theme-800 hextorgb(#00695C)
-	--theme-900 hextorgb(#004D40)
-
+	generateTheme(
+		'theme',
+		#E0F2F1,
+		#B2DFDB,
+		#80CBC4,
+		#4DB6AC,
+		#26A69A,
+		#009688,
+		#00897B,
+		#00796B,
+		#00695C,
+		#004D40
+	)
 :root.theme-base-green
 .green
 .green *
-	--theme-50 hextorgb(#E8F5E9)
-	--theme-100 hextorgb(#C8E6C9)
-	--theme-200 hextorgb(#A5D6A7)
-	--theme-300 hextorgb(#81C784)
-	--theme-400 hextorgb(#66BB6A)
-	--theme-500 hextorgb(#4CAF50)
-	--theme-600 hextorgb(#43A047)
-	--theme-700 hextorgb(#388E3C)
-	--theme-800 hextorgb(#2E7D32)
-	--theme-900 hextorgb(#1B5E20)
-
+	generateTheme(
+		'theme',
+		#E8F5E9,
+		#C8E6C9,
+		#A5D6A7,
+		#81C784,
+		#66BB6A,
+		#4CAF50,
+		#43A047,
+		#388E3C,
+		#2E7D32,
+		#1B5E20
+	)
 :root.theme-base-light-green
 .light-green
 .light-green *
-	--theme-50 hextorgb(#F1F8E9)
-	--theme-100 hextorgb(#DCEDC8)
-	--theme-200 hextorgb(#C5E1A5)
-	--theme-300 hextorgb(#AED581)
-	--theme-400 hextorgb(#9CCC65)
-	--theme-500 hextorgb(#8BC34A)
-	--theme-600 hextorgb(#7CB342)
-	--theme-700 hextorgb(#689F38)
-	--theme-800 hextorgb(#558B2F)
-	--theme-900 hextorgb(#33691E)
-
+	generateTheme(
+		'theme',
+		#F1F8E9,
+		#DCEDC8,
+		#C5E1A5,
+		#AED581,
+		#9CCC65,
+		#8BC34A,
+		#7CB342,
+		#689F38,
+		#558B2F,
+		#33691E
+	)
 :root.theme-base-lime
 .lime
 .lime *
-	--theme-50 hextorgb(#F9FBE7)
-	--theme-100 hextorgb(#F0F4C3)
-	--theme-200 hextorgb(#E6EE9C)
-	--theme-300 hextorgb(#DCE775)
-	--theme-400 hextorgb(#D4E157)
-	--theme-500 hextorgb(#CDDC39)
-	--theme-600 hextorgb(#C0CA33)
-	--theme-700 hextorgb(#AFB42B)
-	--theme-800 hextorgb(#9E9D24)
-	--theme-900 hextorgb(#827717)
-
+	generateTheme(
+		'theme',
+		#F9FBE7,
+		#F0F4C3,
+		#E6EE9C,
+		#DCE775,
+		#D4E157,
+		#CDDC39,
+		#C0CA33,
+		#AFB42B,
+		#9E9D24,
+		#827717
+	)
 :root.theme-base-yellow
 .yellow
 .yellow *
-	--theme-50 hextorgb(#FFFDE7)
-	--theme-100 hextorgb(#FFF9C4)
-	--theme-200 hextorgb(#FFF59D)
-	--theme-300 hextorgb(#FFF176)
-	--theme-400 hextorgb(#FFEE58)
-	--theme-500 hextorgb(#FFEB3B)
-	--theme-600 hextorgb(#FDD835)
-	--theme-700 hextorgb(#FBC02D)
-	--theme-800 hextorgb(#F9A825)
-	--theme-900 hextorgb(#F57F17)
-
+	generateTheme(
+		'theme',
+		#FFFDE7,
+		#FFF9C4,
+		#FFF59D,
+		#FFF176,
+		#FFEE58,
+		#FFEB3B,
+		#FDD835,
+		#FBC02D,
+		#F9A825,
+		#F57F17
+	)
 :root.theme-base-amber
 .amber
 .amber *
-	--theme-100 hextorgb(#FFECB3)
-	--theme-200 hextorgb(#FFE082)
-	--theme-300 hextorgb(#FFD54F)
-	--theme-400 hextorgb(#FFCA28)
-	--theme-500 hextorgb(#FFC107)
-	--theme-600 hextorgb(#FFB300)
-	--theme-700 hextorgb(#FFA000)
-	--theme-800 hextorgb(#FF8F00)
-	--theme-900 hextorgb(#FF6F00)
-
+	generateTheme(
+		'theme',
+		#FFF8E1,
+		#FFECB3,
+		#FFE082,
+		#FFD54F,
+		#FFCA28,
+		#FFC107,
+		#FFB300,
+		#FFA000,
+		#FF8F00,
+		#FF6F00
+	)
 :root.theme-base-orange
 .orange
 .orange *
-	--theme-50 hextorgb(#FFF3E0)
-	--theme-100 hextorgb(#FFE0B2)
-	--theme-200 hextorgb(#FFCC80)
-	--theme-300 hextorgb(#FFB74D)
-	--theme-400 hextorgb(#FFA726)
-	--theme-500 hextorgb(#FF9800)
-	--theme-600 hextorgb(#FB8C00)
-	--theme-700 hextorgb(#F57C00)
-	--theme-800 hextorgb(#EF6C00)
-	--theme-900 hextorgb(#E65100)
-
+	generateTheme(
+		'theme',
+		#FFF3E0,
+		#FFE0B2,
+		#FFCC80,
+		#FFB74D,
+		#FFA726,
+		#FF9800,
+		#FB8C00,
+		#F57C00,
+		#EF6C00,
+		#E65100
+	)
 :root.theme-base-deep-orange
 .deep-orange
 .deep-orange *
-	--theme-50 hextorgb(#FBE9E7)
-	--theme-100 hextorgb(#FFCCBC)
-	--theme-200 hextorgb(#FFAB91)
-	--theme-300 hextorgb(#FF8A65)
-	--theme-400 hextorgb(#FF7043)
-	--theme-500 hextorgb(#FF5722)
-	--theme-600 hextorgb(#F4511E)
-	--theme-700 hextorgb(#E64A19)
-	--theme-800 hextorgb(#D84315)
-	--theme-900 hextorgb(#BF360C)
-
+	generateTheme(
+		'theme',
+		#FBE9E7,
+		#FFCCBC,
+		#FFAB91,
+		#FF8A65,
+		#FF7043,
+		#FF5722,
+		#F4511E,
+		#E64A19,
+		#D84315,
+		#BF360C
+	)
 
 :root.theme-base-brown
 .brown
 .brown *
-	--theme-50 hextorgb(#EFEBE9)
-	--theme-100 hextorgb(#D7CCC8)
-	--theme-200 hextorgb(#BCAAA4)
-	--theme-300 hextorgb(#A1887F)
-	--theme-400 hextorgb(#8D6E63)
-	--theme-500 hextorgb(#795548)
-	--theme-600 hextorgb(#6D4C41)
-	--theme-700 hextorgb(#5D4037)
-	--theme-800 hextorgb(#4E342E)
-	--theme-900 hextorgb(#3E2723)
-
+	generateTheme(
+		'theme',
+		#EFEBE9,
+		#D7CCC8,
+		#BCAAA4,
+		#A1887F,
+		#8D6E63,
+		#795548,
+		#6D4C41,
+		#5D4037,
+		#4E342E,
+		#3E2723
+	)
 :root.theme-base-blue-gray
 .blue-gray
 .blue-gray *
-	--theme-50 hextorgb(#ECEFF1)
-	--theme-100 hextorgb(#CFD8DC)
-	--theme-200 hextorgb(#B0BEC5)
-	--theme-300 hextorgb(#90A4AE)
-	--theme-400 hextorgb(#78909C)
-	--theme-500 hextorgb(#607D8B)
-	--theme-600 hextorgb(#546E7A)
-	--theme-700 hextorgb(#455A64)
-	--theme-800 hextorgb(#37474F)
-	--theme-900 hextorgb(#263238)
+	generateTheme(
+		'theme',
+		#ECEFF1,
+		#CFD8DC,
+		#B0BEC5,
+		#90A4AE,
+		#78909C,
+		#607D8B,
+		#546E7A,
+		#455A64,
+		#37474F,
+		#263238
+	)
+:root.theme-base-gray
+.gray
+.gray *
+	generateTheme(
+		'theme',
+		#FAFAFA,
+		#F5F5F5,
+		#EEEEEE,
+		#E0E0E0,
+		#BDBDBD,
+		#9E9E9E,
+		#757575,
+		#616161,
+		#424242,
+		#212121
+	)
diff --git a/src/config.styl b/src/config.styl
index f324c2e..0391131 100644
--- a/src/config.styl
+++ b/src/config.styl
@@ -5,21 +5,8 @@ nativeRGB(color)
 	unquote('rgb(') color unquote(');')
 
 // @deprecated
-$main = nativeRGB(var(--theme-color))
+$main = nativeRGB(var(--theme-500))
 $textOnMain = white
-$mainGradient = linear-gradient(to right, $main, nativeRGB(var(--theme-color)))
-
-$infoDark = #01579B
-$infoLight = #29B6F6
-
-$successDark = #1B5E20
-$successLight = #7CB342
-
-$errorDark = #7F0000
-$errorLight = #F44336
-
-$warningDark = #C43E00
-$warningLight = #FF9800
 
 $backgroundDark = nativeRGB(var(--gray-900))
 $backgroundLight = nativeRGB(var(--gray-50))
@@ -54,9 +41,3 @@ $gapSize = 16px
 
 rem($a)
 	($a / 16)rem
-
-// See https://github.com/stylus/stylus/issues/1872#issuecomment-86553717
-use('stylusUtils.js')
-
-// Import theme in the root folder of the project
-@import '../../../../../theme' if file-exists('../../../../../theme.styl')
diff --git a/src/stylusUtils.js b/src/stylusUtils.js
deleted file mode 100644
index fef81ba..0000000
--- a/src/stylusUtils.js
+++ /dev/null
@@ -1,11 +0,0 @@
-
-// See https://github.com/stylus/stylus/issues/1872#issuecomment-86553717
-var stylus = require('stylus');
-
-module.exports = function() {
-	return function(style) {
-		style.define('file-exists', function(path) {
-		return !!stylus.utils.lookup(path.string, this.paths);
-		});
-	};
-};
\ No newline at end of file