@code-coaching/vuetiful 0.4.1 → 0.5.0

package/src/themes/theme-vintage.css

@@ -1,125 +1,125 @@
 /* https://fonts.google.com/specimen/Abril+Fatface?query=Abril+Fatface&noto.query=Abril */
-@import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&display=swap');
+@import url("https://fonts.googleapis.com/css2?family=Abril+Fatface&display=swap");
 /* https://fonts.google.com/noto/specimen/Noto+Sans?query=sans */
-@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;1,100;1,200;1,300&display=swap');
+@import url("https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;1,100;1,200;1,300&display=swap");
 
 :root {
-	/* =~= Theme Styles =~= */
-	--theme-font-family-base: 'Noto Sans', sans-serif;
-	--theme-font-family-heading: 'Abril Fatface', cursive;
-	--theme-font-color-base: var(--color-primary-900);
-	--theme-font-color-dark: var(--color-primary-100);
-	--theme-rounded-base: 2px;
-	--theme-rounded-container: 4px;
-	--theme-border-base: 1px;
-	/* =~= Theme On-X Colors =~= */
-	--on-primary: 0 0 0;
-	--on-secondary: 0 0 0;
-	--on-tertiary: 0 0 0;
-	--on-success: 0 0 0;
-	--on-warning: 0 0 0;
-	--on-error: 0 0 0;
-	--on-surface: 255 255 255;
-	/* =~= Theme Colors  =~= */
-	/* primary | #ea861a */
-	--color-primary-50: 252 237 221; /* ⬅ #fceddd */
-	--color-primary-100: 251 231 209; /* ⬅ #fbe7d1 */
-	--color-primary-200: 250 225 198; /* ⬅ #fae1c6 */
-	--color-primary-300: 247 207 163; /* ⬅ #f7cfa3 */
-	--color-primary-400: 240 170 95; /* ⬅ #f0aa5f */
-	--color-primary-500: 234 134 26; /* ⬅ #ea861a */
-	--color-primary-600: 211 121 23; /* ⬅ #d37917 */
-	--color-primary-700: 176 101 20; /* ⬅ #b06514 */
-	--color-primary-800: 140 80 16; /* ⬅ #8c5010 */
-	--color-primary-900: 115 66 13; /* ⬅ #73420d */
-	/* secondary | #97cea5 */
-	--color-secondary-50: 239 248 242; /* ⬅ #eff8f2 */
-	--color-secondary-100: 234 245 237; /* ⬅ #eaf5ed */
-	--color-secondary-200: 229 243 233; /* ⬅ #e5f3e9 */
-	--color-secondary-300: 213 235 219; /* ⬅ #d5ebdb */
-	--color-secondary-400: 182 221 192; /* ⬅ #b6ddc0 */
-	--color-secondary-500: 151 206 165; /* ⬅ #97cea5 */
-	--color-secondary-600: 136 185 149; /* ⬅ #88b995 */
-	--color-secondary-700: 113 155 124; /* ⬅ #719b7c */
-	--color-secondary-800: 91 124 99; /* ⬅ #5b7c63 */
-	--color-secondary-900: 74 101 81; /* ⬅ #4a6551 */
-	/* tertiary | #06b6d4 */
-	--color-tertiary-50: 218 244 249; /* ⬅ #daf4f9 */
-	--color-tertiary-100: 205 240 246; /* ⬅ #cdf0f6 */
-	--color-tertiary-200: 193 237 244; /* ⬅ #c1edf4 */
-	--color-tertiary-300: 155 226 238; /* ⬅ #9be2ee */
-	--color-tertiary-400: 81 204 225; /* ⬅ #51cce1 */
-	--color-tertiary-500: 6 182 212; /* ⬅ #06b6d4 */
-	--color-tertiary-600: 5 164 191; /* ⬅ #05a4bf */
-	--color-tertiary-700: 5 137 159; /* ⬅ #05899f */
-	--color-tertiary-800: 4 109 127; /* ⬅ #046d7f */
-	--color-tertiary-900: 3 89 104; /* ⬅ #035968 */
-	/* success | #84cb5d */
-	--color-success-50: 237 247 231; /* ⬅ #edf7e7 */
-	--color-success-100: 230 245 223; /* ⬅ #e6f5df */
-	--color-success-200: 224 242 215; /* ⬅ #e0f2d7 */
-	--color-success-300: 206 234 190; /* ⬅ #ceeabe */
-	--color-success-400: 169 219 142; /* ⬅ #a9db8e */
-	--color-success-500: 132 203 93; /* ⬅ #84cb5d */
-	--color-success-600: 119 183 84; /* ⬅ #77b754 */
-	--color-success-700: 99 152 70; /* ⬅ #639846 */
-	--color-success-800: 79 122 56; /* ⬅ #4f7a38 */
-	--color-success-900: 65 99 46; /* ⬅ #41632e */
-	/* warning | #f2ac23 */
-	--color-warning-50: 253 243 222; /* ⬅ #fdf3de */
-	--color-warning-100: 252 238 211; /* ⬅ #fceed3 */
-	--color-warning-200: 252 234 200; /* ⬅ #fceac8 */
-	--color-warning-300: 250 222 167; /* ⬅ #fadea7 */
-	--color-warning-400: 246 197 101; /* ⬅ #f6c565 */
-	--color-warning-500: 242 172 35; /* ⬅ #f2ac23 */
-	--color-warning-600: 218 155 32; /* ⬅ #da9b20 */
-	--color-warning-700: 182 129 26; /* ⬅ #b6811a */
-	--color-warning-800: 145 103 21; /* ⬅ #916715 */
-	--color-warning-900: 119 84 17; /* ⬅ #775411 */
-	/* error | #d57e78 */
-	--color-error-50: 249 236 235; /* ⬅ #f9eceb */
-	--color-error-100: 247 229 228; /* ⬅ #f7e5e4 */
-	--color-error-200: 245 223 221; /* ⬅ #f5dfdd */
-	--color-error-300: 238 203 201; /* ⬅ #eecbc9 */
-	--color-error-400: 226 165 161; /* ⬅ #e2a5a1 */
-	--color-error-500: 213 126 120; /* ⬅ #d57e78 */
-	--color-error-600: 192 113 108; /* ⬅ #c0716c */
-	--color-error-700: 160 95 90; /* ⬅ #a05f5a */
-	--color-error-800: 128 76 72; /* ⬅ #804c48 */
-	--color-error-900: 104 62 59; /* ⬅ #683e3b */
-	/* surface | #3f3731 */
-	--color-surface-50: 226 225 224; /* ⬅ #e2e1e0 */
-	--color-surface-100: 217 215 214; /* ⬅ #d9d7d6 */
-	--color-surface-200: 207 205 204; /* ⬅ #cfcdcc */
-	--color-surface-300: 178 175 173; /* ⬅ #b2afad */
-	--color-surface-400: 121 115 111; /* ⬅ #79736f */
-	--color-surface-500: 63 55 49; /* ⬅ #3f3731 */
-	--color-surface-600: 57 50 44; /* ⬅ #39322c */
-	--color-surface-700: 47 41 37; /* ⬅ #2f2925 */
-	--color-surface-800: 38 33 29; /* ⬅ #26211d */
-	--color-surface-900: 31 27 24; /* ⬅ #1f1b18 */
+  /* =~= Theme Styles =~= */
+  --theme-font-family-base: "Noto Sans", sans-serif;
+  --theme-font-family-heading: "Abril Fatface", cursive;
+  --theme-font-color-base: var(--color-primary-900);
+  --theme-font-color-dark: var(--color-primary-100);
+  --theme-rounded-base: 2px;
+  --theme-rounded-container: 4px;
+  --theme-border-base: 1px;
+  /* =~= Theme On-X Colors =~= */
+  --on-primary: 0 0 0;
+  --on-secondary: 0 0 0;
+  --on-tertiary: 0 0 0;
+  --on-success: 0 0 0;
+  --on-warning: 0 0 0;
+  --on-error: 0 0 0;
+  --on-surface: 255 255 255;
+  /* =~= Theme Colors  =~= */
+  /* primary | #ea861a */
+  --color-primary-50: 252 237 221; /* ⬅ #fceddd */
+  --color-primary-100: 251 231 209; /* ⬅ #fbe7d1 */
+  --color-primary-200: 250 225 198; /* ⬅ #fae1c6 */
+  --color-primary-300: 247 207 163; /* ⬅ #f7cfa3 */
+  --color-primary-400: 240 170 95; /* ⬅ #f0aa5f */
+  --color-primary-500: 234 134 26; /* ⬅ #ea861a */
+  --color-primary-600: 211 121 23; /* ⬅ #d37917 */
+  --color-primary-700: 176 101 20; /* ⬅ #b06514 */
+  --color-primary-800: 140 80 16; /* ⬅ #8c5010 */
+  --color-primary-900: 115 66 13; /* ⬅ #73420d */
+  /* secondary | #97cea5 */
+  --color-secondary-50: 239 248 242; /* ⬅ #eff8f2 */
+  --color-secondary-100: 234 245 237; /* ⬅ #eaf5ed */
+  --color-secondary-200: 229 243 233; /* ⬅ #e5f3e9 */
+  --color-secondary-300: 213 235 219; /* ⬅ #d5ebdb */
+  --color-secondary-400: 182 221 192; /* ⬅ #b6ddc0 */
+  --color-secondary-500: 151 206 165; /* ⬅ #97cea5 */
+  --color-secondary-600: 136 185 149; /* ⬅ #88b995 */
+  --color-secondary-700: 113 155 124; /* ⬅ #719b7c */
+  --color-secondary-800: 91 124 99; /* ⬅ #5b7c63 */
+  --color-secondary-900: 74 101 81; /* ⬅ #4a6551 */
+  /* tertiary | #06b6d4 */
+  --color-tertiary-50: 218 244 249; /* ⬅ #daf4f9 */
+  --color-tertiary-100: 205 240 246; /* ⬅ #cdf0f6 */
+  --color-tertiary-200: 193 237 244; /* ⬅ #c1edf4 */
+  --color-tertiary-300: 155 226 238; /* ⬅ #9be2ee */
+  --color-tertiary-400: 81 204 225; /* ⬅ #51cce1 */
+  --color-tertiary-500: 6 182 212; /* ⬅ #06b6d4 */
+  --color-tertiary-600: 5 164 191; /* ⬅ #05a4bf */
+  --color-tertiary-700: 5 137 159; /* ⬅ #05899f */
+  --color-tertiary-800: 4 109 127; /* ⬅ #046d7f */
+  --color-tertiary-900: 3 89 104; /* ⬅ #035968 */
+  /* success | #84cb5d */
+  --color-success-50: 237 247 231; /* ⬅ #edf7e7 */
+  --color-success-100: 230 245 223; /* ⬅ #e6f5df */
+  --color-success-200: 224 242 215; /* ⬅ #e0f2d7 */
+  --color-success-300: 206 234 190; /* ⬅ #ceeabe */
+  --color-success-400: 169 219 142; /* ⬅ #a9db8e */
+  --color-success-500: 132 203 93; /* ⬅ #84cb5d */
+  --color-success-600: 119 183 84; /* ⬅ #77b754 */
+  --color-success-700: 99 152 70; /* ⬅ #639846 */
+  --color-success-800: 79 122 56; /* ⬅ #4f7a38 */
+  --color-success-900: 65 99 46; /* ⬅ #41632e */
+  /* warning | #f2ac23 */
+  --color-warning-50: 253 243 222; /* ⬅ #fdf3de */
+  --color-warning-100: 252 238 211; /* ⬅ #fceed3 */
+  --color-warning-200: 252 234 200; /* ⬅ #fceac8 */
+  --color-warning-300: 250 222 167; /* ⬅ #fadea7 */
+  --color-warning-400: 246 197 101; /* ⬅ #f6c565 */
+  --color-warning-500: 242 172 35; /* ⬅ #f2ac23 */
+  --color-warning-600: 218 155 32; /* ⬅ #da9b20 */
+  --color-warning-700: 182 129 26; /* ⬅ #b6811a */
+  --color-warning-800: 145 103 21; /* ⬅ #916715 */
+  --color-warning-900: 119 84 17; /* ⬅ #775411 */
+  /* error | #d57e78 */
+  --color-error-50: 249 236 235; /* ⬅ #f9eceb */
+  --color-error-100: 247 229 228; /* ⬅ #f7e5e4 */
+  --color-error-200: 245 223 221; /* ⬅ #f5dfdd */
+  --color-error-300: 238 203 201; /* ⬅ #eecbc9 */
+  --color-error-400: 226 165 161; /* ⬅ #e2a5a1 */
+  --color-error-500: 213 126 120; /* ⬅ #d57e78 */
+  --color-error-600: 192 113 108; /* ⬅ #c0716c */
+  --color-error-700: 160 95 90; /* ⬅ #a05f5a */
+  --color-error-800: 128 76 72; /* ⬅ #804c48 */
+  --color-error-900: 104 62 59; /* ⬅ #683e3b */
+  /* surface | #3f3731 */
+  --color-surface-50: 226 225 224; /* ⬅ #e2e1e0 */
+  --color-surface-100: 217 215 214; /* ⬅ #d9d7d6 */
+  --color-surface-200: 207 205 204; /* ⬅ #cfcdcc */
+  --color-surface-300: 178 175 173; /* ⬅ #b2afad */
+  --color-surface-400: 121 115 111; /* ⬅ #79736f */
+  --color-surface-500: 63 55 49; /* ⬅ #3f3731 */
+  --color-surface-600: 57 50 44; /* ⬅ #39322c */
+  --color-surface-700: 47 41 37; /* ⬅ #2f2925 */
+  --color-surface-800: 38 33 29; /* ⬅ #26211d */
+  --color-surface-900: 31 27 24; /* ⬅ #1f1b18 */
 }
 
-[data-theme='vintage'] h1,
-[data-theme='vintage'] h2,
-[data-theme='vintage'] h3,
-[data-theme='vintage'] h4,
-[data-theme='vintage'] h5,
-[data-theme='vintage'] h6 {
-	letter-spacing: 1px;
+[data-theme="vintage"] h1,
+[data-theme="vintage"] h2,
+[data-theme="vintage"] h3,
+[data-theme="vintage"] h4,
+[data-theme="vintage"] h5,
+[data-theme="vintage"] h6 {
+  letter-spacing: 1px;
 }
 
 /* Applied to body with `<body data-theme="vintage">` */
 /* Created with: https://csshero.org/mesher/ */
-[data-theme='vintage'] {
-	/* prettier-ignore */
-	background-image:
+[data-theme="vintage"] {
+  /* prettier-ignore */
+  background-image:
 		radial-gradient(at 100% 0%, hsla(135,34%,70%,0.20) 0px, transparent 50%),
 		radial-gradient(at 85% 100%, hsla(31,83%,50%,0.20) 0px, transparent 50%);
 }
-.dark [data-theme='vintage'] {
-	/* prettier-ignore */
-	background-image:
+.dark [data-theme="vintage"] {
+  /* prettier-ignore */
+  background-image:
 		radial-gradient(at 100% 0%, hsla(135,34%,70%,0.14) 0px, transparent 50%),
 		radial-gradient(at 85% 100%, hsla(31,83%,50%,0.14) 0px, transparent 50%);
 }

package/src/themes/theme-vuetiful-0.0.1.css

@@ -1,126 +1,126 @@
 /* https://fonts.google.com/specimen/Quicksand?query=Quicksand */
-@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap');
+@import url("https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap");
 
 :root {
-	/* =~= Theme Properties =~= */
-	--theme-font-family-base: 'Quicksand', sans-serif;
-	--theme-font-family-heading: 'Quicksand', sans-serif;
-	--theme-font-color-base: var(--color-surface-900);
-	--theme-font-color-dark: var(--color-tertiary-50);
-	--theme-rounded-base: 12px;
-	--theme-rounded-container: 12px;
-	--theme-border-base: 0px;
-	/* =~= Theme On-X Colors =~= */
-	--on-primary: 0 0 0;
-	--on-secondary: 0 0 0;
-	--on-tertiary: 0 0 0;
-	--on-success: 0 0 0;
-	--on-warning: 0 0 0;
-	--on-error: 255 255 255;
-	--on-surface: 255 255 255;
-	/* =~= Theme Colors  =~= */
-	/* primary | #ec4899 */
-	--color-primary-50: 252 228 240; /* ⬅ #fce4f0 */
-	--color-primary-100: 251 218 235; /* ⬅ #fbdaeb */
-	--color-primary-200: 250 209 230; /* ⬅ #fad1e6 */
-	--color-primary-300: 247 182 214; /* ⬅ #f7b6d6 */
-	--color-primary-400: 242 127 184; /* ⬅ #f27fb8 */
-	--color-primary-500: 236 72 153; /* ⬅ #ec4899 */
-	--color-primary-600: 212 65 138; /* ⬅ #d4418a */
-	--color-primary-700: 177 54 115; /* ⬅ #b13673 */
-	--color-primary-800: 142 43 92; /* ⬅ #8e2b5c */
-	--color-primary-900: 116 35 75; /* ⬅ #74234b */
-	/* secondary | #06b6d4 */
-	--color-secondary-50: 218 244 249; /* ⬅ #daf4f9 */
-	--color-secondary-100: 205 240 246; /* ⬅ #cdf0f6 */
-	--color-secondary-200: 193 237 244; /* ⬅ #c1edf4 */
-	--color-secondary-300: 155 226 238; /* ⬅ #9be2ee */
-	--color-secondary-400: 81 204 225; /* ⬅ #51cce1 */
-	--color-secondary-500: 6 182 212; /* ⬅ #06b6d4 */
-	--color-secondary-600: 5 164 191; /* ⬅ #05a4bf */
-	--color-secondary-700: 5 137 159; /* ⬅ #05899f */
-	--color-secondary-800: 4 109 127; /* ⬅ #046d7f */
-	--color-secondary-900: 3 89 104; /* ⬅ #035968 */
-	/* tertiary | #14b8a6 */
-	--color-tertiary-50: 220 244 242; /* ⬅ #dcf4f2 */
-	--color-tertiary-100: 208 241 237; /* ⬅ #d0f1ed */
-	--color-tertiary-200: 196 237 233; /* ⬅ #c4ede9 */
-	--color-tertiary-300: 161 227 219; /* ⬅ #a1e3db */
-	--color-tertiary-400: 91 205 193; /* ⬅ #5bcdc1 */
-	--color-tertiary-500: 20 184 166; /* ⬅ #14b8a6 */
-	--color-tertiary-600: 18 166 149; /* ⬅ #12a695 */
-	--color-tertiary-700: 15 138 125; /* ⬅ #0f8a7d */
-	--color-tertiary-800: 12 110 100; /* ⬅ #0c6e64 */
-	--color-tertiary-900: 10 90 81; /* ⬅ #0a5a51 */
-	/* success | #84cc16 */
-	--color-success-50: 237 247 220; /* ⬅ #edf7dc */
-	--color-success-100: 230 245 208; /* ⬅ #e6f5d0 */
-	--color-success-200: 224 242 197; /* ⬅ #e0f2c5 */
-	--color-success-300: 206 235 162; /* ⬅ #ceeba2 */
-	--color-success-400: 169 219 92; /* ⬅ #a9db5c */
-	--color-success-500: 132 204 22; /* ⬅ #84cc16 */
-	--color-success-600: 119 184 20; /* ⬅ #77b814 */
-	--color-success-700: 99 153 17; /* ⬅ #639911 */
-	--color-success-800: 79 122 13; /* ⬅ #4f7a0d */
-	--color-success-900: 65 100 11; /* ⬅ #41640b */
-	/* warning | #eab308 */
-	--color-warning-50: 252 244 218; /* ⬅ #fcf4da */
-	--color-warning-100: 251 240 206; /* ⬅ #fbf0ce */
-	--color-warning-200: 250 236 193; /* ⬅ #faecc1 */
-	--color-warning-300: 247 225 156; /* ⬅ #f7e19c */
-	--color-warning-400: 240 202 82; /* ⬅ #f0ca52 */
-	--color-warning-500: 234 179 8; /* ⬅ #eab308 */
-	--color-warning-600: 211 161 7; /* ⬅ #d3a107 */
-	--color-warning-700: 176 134 6; /* ⬅ #b08606 */
-	--color-warning-800: 140 107 5; /* ⬅ #8c6b05 */
-	--color-warning-900: 115 88 4; /* ⬅ #735804 */
-	/* error | #ef4444 */
-	--color-error-50: 253 227 227; /* ⬅ #fde3e3 */
-	--color-error-100: 252 218 218; /* ⬅ #fcdada */
-	--color-error-200: 251 208 208; /* ⬅ #fbd0d0 */
-	--color-error-300: 249 180 180; /* ⬅ #f9b4b4 */
-	--color-error-400: 244 124 124; /* ⬅ #f47c7c */
-	--color-error-500: 239 68 68; /* ⬅ #ef4444 */
-	--color-error-600: 215 61 61; /* ⬅ #d73d3d */
-	--color-error-700: 179 51 51; /* ⬅ #b33333 */
-	--color-error-800: 143 41 41; /* ⬅ #8f2929 */
-	--color-error-900: 117 33 33; /* ⬅ #752121 */
-	/* surface | #6366f1 */
-	--color-surface-50: 232 232 253; /* ⬅ #e8e8fd */
-	--color-surface-100: 224 224 252; /* ⬅ #e0e0fc */
-	--color-surface-200: 216 217 252; /* ⬅ #d8d9fc */
-	--color-surface-300: 193 194 249; /* ⬅ #c1c2f9 */
-	--color-surface-400: 146 148 245; /* ⬅ #9294f5 */
-	--color-surface-500: 99 102 241; /* ⬅ #6366f1 */
-	--color-surface-600: 89 92 217; /* ⬅ #595cd9 */
-	--color-surface-700: 74 77 181; /* ⬅ #4a4db5 */
-	--color-surface-800: 59 61 145; /* ⬅ #3b3d91 */
-	--color-surface-900: 49 50 118; /* ⬅ #313276 */
+  /* =~= Theme Properties =~= */
+  --theme-font-family-base: "Quicksand", sans-serif;
+  --theme-font-family-heading: "Quicksand", sans-serif;
+  --theme-font-color-base: var(--color-surface-900);
+  --theme-font-color-dark: var(--color-tertiary-50);
+  --theme-rounded-base: 12px;
+  --theme-rounded-container: 12px;
+  --theme-border-base: 0px;
+  /* =~= Theme On-X Colors =~= */
+  --on-primary: 0 0 0;
+  --on-secondary: 0 0 0;
+  --on-tertiary: 0 0 0;
+  --on-success: 0 0 0;
+  --on-warning: 0 0 0;
+  --on-error: 255 255 255;
+  --on-surface: 255 255 255;
+  /* =~= Theme Colors  =~= */
+  /* primary | #ec4899 */
+  --color-primary-50: 252 228 240; /* ⬅ #fce4f0 */
+  --color-primary-100: 251 218 235; /* ⬅ #fbdaeb */
+  --color-primary-200: 250 209 230; /* ⬅ #fad1e6 */
+  --color-primary-300: 247 182 214; /* ⬅ #f7b6d6 */
+  --color-primary-400: 242 127 184; /* ⬅ #f27fb8 */
+  --color-primary-500: 236 72 153; /* ⬅ #ec4899 */
+  --color-primary-600: 212 65 138; /* ⬅ #d4418a */
+  --color-primary-700: 177 54 115; /* ⬅ #b13673 */
+  --color-primary-800: 142 43 92; /* ⬅ #8e2b5c */
+  --color-primary-900: 116 35 75; /* ⬅ #74234b */
+  /* secondary | #06b6d4 */
+  --color-secondary-50: 218 244 249; /* ⬅ #daf4f9 */
+  --color-secondary-100: 205 240 246; /* ⬅ #cdf0f6 */
+  --color-secondary-200: 193 237 244; /* ⬅ #c1edf4 */
+  --color-secondary-300: 155 226 238; /* ⬅ #9be2ee */
+  --color-secondary-400: 81 204 225; /* ⬅ #51cce1 */
+  --color-secondary-500: 6 182 212; /* ⬅ #06b6d4 */
+  --color-secondary-600: 5 164 191; /* ⬅ #05a4bf */
+  --color-secondary-700: 5 137 159; /* ⬅ #05899f */
+  --color-secondary-800: 4 109 127; /* ⬅ #046d7f */
+  --color-secondary-900: 3 89 104; /* ⬅ #035968 */
+  /* tertiary | #14b8a6 */
+  --color-tertiary-50: 220 244 242; /* ⬅ #dcf4f2 */
+  --color-tertiary-100: 208 241 237; /* ⬅ #d0f1ed */
+  --color-tertiary-200: 196 237 233; /* ⬅ #c4ede9 */
+  --color-tertiary-300: 161 227 219; /* ⬅ #a1e3db */
+  --color-tertiary-400: 91 205 193; /* ⬅ #5bcdc1 */
+  --color-tertiary-500: 20 184 166; /* ⬅ #14b8a6 */
+  --color-tertiary-600: 18 166 149; /* ⬅ #12a695 */
+  --color-tertiary-700: 15 138 125; /* ⬅ #0f8a7d */
+  --color-tertiary-800: 12 110 100; /* ⬅ #0c6e64 */
+  --color-tertiary-900: 10 90 81; /* ⬅ #0a5a51 */
+  /* success | #84cc16 */
+  --color-success-50: 237 247 220; /* ⬅ #edf7dc */
+  --color-success-100: 230 245 208; /* ⬅ #e6f5d0 */
+  --color-success-200: 224 242 197; /* ⬅ #e0f2c5 */
+  --color-success-300: 206 235 162; /* ⬅ #ceeba2 */
+  --color-success-400: 169 219 92; /* ⬅ #a9db5c */
+  --color-success-500: 132 204 22; /* ⬅ #84cc16 */
+  --color-success-600: 119 184 20; /* ⬅ #77b814 */
+  --color-success-700: 99 153 17; /* ⬅ #639911 */
+  --color-success-800: 79 122 13; /* ⬅ #4f7a0d */
+  --color-success-900: 65 100 11; /* ⬅ #41640b */
+  /* warning | #eab308 */
+  --color-warning-50: 252 244 218; /* ⬅ #fcf4da */
+  --color-warning-100: 251 240 206; /* ⬅ #fbf0ce */
+  --color-warning-200: 250 236 193; /* ⬅ #faecc1 */
+  --color-warning-300: 247 225 156; /* ⬅ #f7e19c */
+  --color-warning-400: 240 202 82; /* ⬅ #f0ca52 */
+  --color-warning-500: 234 179 8; /* ⬅ #eab308 */
+  --color-warning-600: 211 161 7; /* ⬅ #d3a107 */
+  --color-warning-700: 176 134 6; /* ⬅ #b08606 */
+  --color-warning-800: 140 107 5; /* ⬅ #8c6b05 */
+  --color-warning-900: 115 88 4; /* ⬅ #735804 */
+  /* error | #ef4444 */
+  --color-error-50: 253 227 227; /* ⬅ #fde3e3 */
+  --color-error-100: 252 218 218; /* ⬅ #fcdada */
+  --color-error-200: 251 208 208; /* ⬅ #fbd0d0 */
+  --color-error-300: 249 180 180; /* ⬅ #f9b4b4 */
+  --color-error-400: 244 124 124; /* ⬅ #f47c7c */
+  --color-error-500: 239 68 68; /* ⬅ #ef4444 */
+  --color-error-600: 215 61 61; /* ⬅ #d73d3d */
+  --color-error-700: 179 51 51; /* ⬅ #b33333 */
+  --color-error-800: 143 41 41; /* ⬅ #8f2929 */
+  --color-error-900: 117 33 33; /* ⬅ #752121 */
+  /* surface | #6366f1 */
+  --color-surface-50: 232 232 253; /* ⬅ #e8e8fd */
+  --color-surface-100: 224 224 252; /* ⬅ #e0e0fc */
+  --color-surface-200: 216 217 252; /* ⬅ #d8d9fc */
+  --color-surface-300: 193 194 249; /* ⬅ #c1c2f9 */
+  --color-surface-400: 146 148 245; /* ⬅ #9294f5 */
+  --color-surface-500: 99 102 241; /* ⬅ #6366f1 */
+  --color-surface-600: 89 92 217; /* ⬅ #595cd9 */
+  --color-surface-700: 74 77 181; /* ⬅ #4a4db5 */
+  --color-surface-800: 59 61 145; /* ⬅ #3b3d91 */
+  --color-surface-900: 49 50 118; /* ⬅ #313276 */
 }
 
-[data-theme='vuetiful'] h1,
-[data-theme='vuetiful'] h2,
-[data-theme='vuetiful'] h3,
-[data-theme='vuetiful'] h4,
-[data-theme='vuetiful'] h5,
-[data-theme='vuetiful'] h6,
-[data-theme='vuetiful'] a,
-[data-theme='vuetiful'] button {
-	font-weight: bold;
+[data-theme="vuetiful"] h1,
+[data-theme="vuetiful"] h2,
+[data-theme="vuetiful"] h3,
+[data-theme="vuetiful"] h4,
+[data-theme="vuetiful"] h5,
+[data-theme="vuetiful"] h6,
+[data-theme="vuetiful"] a,
+[data-theme="vuetiful"] button {
+  font-weight: bold;
 }
 
 /* Applied to body with `<body data-theme="vuetiful">` */
 /* Created with: https://csshero.org/mesher/ */
-[data-theme='vuetiful'] {
-	/* prettier-ignore */
-	background-image:
+[data-theme="vuetiful"] {
+  /* prettier-ignore */
+  background-image:
 		radial-gradient(at 76% 0%, hsla(189,100%,56%,0.36) 0px, transparent 50%),
 		radial-gradient(at 1% 0%, hsla(340,100%,76%,0.26) 0px, transparent 50%),
 		radial-gradient(at 20% 100%, hsla(241,100%,70%,0.47) 0px, transparent 50%);
 }
-.dark [data-theme='vuetiful'] {
-	/* prettier-ignore */
-	background-image:
+.dark [data-theme="vuetiful"] {
+  /* prettier-ignore */
+  background-image:
 		radial-gradient(at 76% 0%, hsla(189,100%,56%,0.20) 0px, transparent 50%),
 		radial-gradient(at 1% 0%, hsla(340,100%,76%,0.15) 0px, transparent 50%),
 		radial-gradient(at 20% 100%, hsla(241,100%,70%,0.30) 0px, transparent 50%);

package/src/types/index.ts

@@ -1 +1 @@
-export * from './tailwind';
+export * from "./tailwind";

package/src/types/tailwind.ts

@@ -1,7 +1,26 @@
-export const tailwindNumbers = ['50', '100', '200', '300', '400', '500', '600', '700', '800', '900'] as const;
+export const tailwindNumbers = [
+  "50",
+  "100",
+  "200",
+  "300",
+  "400",
+  "500",
+  "600",
+  "700",
+  "800",
+  "900",
+] as const;
 
 export type TailwindNumbers = (typeof tailwindNumbers)[number];
 
-export const semanticNames = ['primary', 'secondary', 'tertiary', 'success', 'warning', 'error' , 'surface'] as const;
+export const semanticNames = [
+  "primary",
+  "secondary",
+  "tertiary",
+  "success",
+  "warning",
+  "error",
+  "surface",
+] as const;
 
 export type SemanticNames = (typeof semanticNames)[number];

package/src/utils/code-block/highlight.service.test.ts

@@ -19,6 +19,6 @@ describe("useHighlight", () => {
           '<span class="hljs-keyword">const</span> <span class="hljs-keyword">name</span> = <span class="hljs-string">&#x27;John Duck&#x27;</span>'
         );
       });
-    })
+    });
   });
 });

package/src/utils/index.test.ts

@@ -8,4 +8,4 @@ describe("utils", () => {
       expect(value).toBeDefined();
     });
   });
-})
+});

package/src/utils/platform/platform.service.ts

@@ -2,9 +2,7 @@ const usePlatform = () => {
   const isBrowser = typeof window !== "undefined";
   return {
     isBrowser,
-  }
-}
+  };
+};
 
-export { 
-  usePlatform,
-}
+export { usePlatform };

package/src/utils/theme/theme.service.test.ts

@@ -154,7 +154,6 @@ describe("useTheme", () => {
 
         expect(localStorageSpy).not.toHaveBeenCalled();
       });
-    })
-  })
-
+    });
+  });
 });