npm - @bagelink/vue - Versions diffs - 1.9.83 → 1.9.86 - Mend

@bagelink/vue 1.9.83 → 1.9.86

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (37) hide show

package/dist/components/Avatar.vue.d.ts +1 -0
package/dist/components/Avatar.vue.d.ts.map +1 -1
package/dist/components/Badge.vue.d.ts +0 -1
package/dist/components/Badge.vue.d.ts.map +1 -1
package/dist/components/Btn.vue.d.ts.map +1 -1
package/dist/components/Dropdown.vue.d.ts.map +1 -1
package/dist/components/Loading.vue.d.ts +2 -1
package/dist/components/Loading.vue.d.ts.map +1 -1
package/dist/components/form/inputs/RichText/index.vue.d.ts.map +1 -1
package/dist/form-flow/FormFlow.vue.d.ts.map +1 -1
package/dist/form-flow/form-flow.d.ts +9 -9
package/dist/form-flow/form-flow.d.ts.map +1 -1
package/dist/index.cjs +163 -85
package/dist/index.d.ts +1 -0
package/dist/index.d.ts.map +1 -1
package/dist/index.mjs +25737 -25545
package/dist/plugins/useToast.d.ts.map +1 -1
package/dist/style.css +1 -1
package/dist/utils/filterRef.d.ts +15 -0
package/dist/utils/filterRef.d.ts.map +1 -0
package/package.json +1 -1
package/src/components/Avatar.vue +6 -2
package/src/components/Badge.vue +14 -1084
package/src/components/Btn.vue +37 -37
package/src/components/Dropdown.vue +1 -1
package/src/components/Loading.vue +15 -6
package/src/components/form/inputs/RichText/index.vue +325 -221
package/src/form-flow/FormFlow.vue +9 -0
package/src/form-flow/form-flow.ts +13 -3
package/src/index.ts +1 -1
package/src/plugins/useToast.ts +14 -0
package/src/styles/bagel.css +1 -0
package/src/styles/base-colors.css +1429 -46
package/src/styles/text.css +1755 -1755
package/src/styles/toast-overrides.css +10 -0
package/src/utils/filterRef.ts +133 -0
package/src/styles/btnColors.css +0 -847

package/src/styles/btnColors.css DELETED Viewed

@@ -1,847 +0,0 @@
-/* Centralized button colors CSS */
-/* Base button styles - preserving existing functionality */
-.bgl_btn {
-	--btn-bg: var(--bgl-primary);
-	--btn-color: var(--bgl-light-text);
-	--btn-flat-color: var(--bgl-text-color);
-}
-/* Base Colors */
-.bgl_btn-blue {
-	--btn-bg: var(--bgl-blue);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-blue);
-}
-.bgl_btn-green {
-	--btn-bg: var(--bgl-green);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-green);
-}
-.bgl_btn-red {
-	--btn-bg: var(--bgl-red);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-red);
-}
-.bgl_btn-yellow {
-	--btn-bg: var(--bgl-yellow);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-yellow);
-}
-.bgl_btn-purple {
-	--btn-bg: var(--bgl-purple);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-purple);
-}
-.bgl_btn-brown {
-	--btn-bg: var(--bgl-brown);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-brown);
-}
-.bgl_btn-orange {
-	--btn-bg: var(--bgl-orange);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-orange);
-}
-.bgl_btn-turquoise {
-	--btn-bg: var(--bgl-turquoise);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-turquoise);
-}
-.bgl_btn-gray {
-	--btn-bg: var(--bgl-gray-light);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-gray);
-}
-.bgl_btn-black {
-	--btn-bg: var(--bgl-black);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-black);
-}
-.bgl_btn-pink {
-	--btn-bg: var(--bgl-pink);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-pink);
-}
-.bgl_btn-primary {
-	--btn-bg: var(--bgl-primary);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-primary);
-}
-.bgl_btn-white {
-	--btn-bg: var(--bgl-white);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-white);
-}
-/* Light variants */
-.bgl_btn-blue-light {
-	--btn-bg: var(--bgl-blue-light);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-blue);
-}
-.bgl_btn-green-light {
-	--btn-bg: var(--bgl-green-light);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-green);
-}
-.bgl_btn-red-light {
-	--btn-bg: var(--bgl-red-light);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-red);
-}
-.bgl_btn-yellow-light {
-	--btn-bg: var(--bgl-yellow-light);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-yellow);
-}
-.bgl_btn-purple-light {
-	--btn-bg: var(--bgl-purple-light);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-purple);
-}
-.bgl_btn-brown-light {
-	--btn-bg: var(--bgl-brown-light);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-brown);
-}
-.bgl_btn-orange-light {
-	--btn-bg: var(--bgl-orange-light);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-orange);
-}
-.bgl_btn-turquoise-light {
-	--btn-bg: var(--bgl-turquoise-light);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-turquoise);
-}
-.bgl_btn-pink-light {
-	--btn-bg: var(--bgl-pink-light);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-pink);
-}
-.bgl_btn-gray-light {
-	--btn-bg: var(--bgl-gray-light);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-gray);
-}
-.bgl_btn-primary-light {
-	--btn-bg: var(--bgl-primary-light);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-primary);
-}
-.bgl_btn-light {
-	--btn-bg: var(--bgl-primary-light);
-	--btn-color: var(--bgl-primary);
-	--btn-flat-color: var(--bgl-primary-light);
-}
-/* Tint variants */
-.bgl_btn-blue-tint {
-	--btn-bg: var(--bgl-blue-tint);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-blue);
-}
-.bgl_btn-red-tint {
-	--btn-bg: var(--bgl-red-tint);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-red);
-}
-.bgl_btn-primary-tint {
-	--btn-bg: var(--bgl-primary-tint);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-primary);
-}
-.bgl_btn-black-tint {
-	--btn-bg: var(--bgl-black-tint);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-black);
-}
-.bgl_btn-blue-dark {
-	--btn-bg: var(--bgl-blue-dark);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-blue-dark);
-}
-/* 10% variants (lightest) */
-.bgl_btn-blue-10 {
-	--btn-bg: var(--bgl-blue-10);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-blue);
-}
-.bgl_btn-green-10 {
-	--btn-bg: var(--bgl-green-10);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-green);
-}
-.bgl_btn-red-10 {
-	--btn-bg: var(--bgl-red-10);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-red);
-}
-.bgl_btn-yellow-10 {
-	--btn-bg: var(--bgl-yellow-10);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-yellow);
-}
-.bgl_btn-purple-10 {
-	--btn-bg: var(--bgl-purple-10);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-purple);
-}
-.bgl_btn-brown-10 {
-	--btn-bg: var(--bgl-brown-10);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-brown);
-}
-.bgl_btn-orange-10 {
-	--btn-bg: var(--bgl-orange-10);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-orange);
-}
-.bgl_btn-turquoise-10 {
-	--btn-bg: var(--bgl-turquoise-10);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-turquoise);
-}
-.bgl_btn-gray-10 {
-	--btn-bg: var(--bgl-gray-10);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-gray);
-}
-.bgl_btn-black-10 {
-	--btn-bg: var(--bgl-black-10);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-black);
-}
-.bgl_btn-pink-10 {
-	--btn-bg: var(--bgl-pink-10);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-pink);
-}
-/* 20% variants */
-.bgl_btn-blue-20 {
-	--btn-bg: var(--bgl-blue-20);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-blue);
-}
-.bgl_btn-green-20 {
-	--btn-bg: var(--bgl-green-20);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-green);
-}
-.bgl_btn-red-20 {
-	--btn-bg: var(--bgl-red-20);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-red);
-}
-.bgl_btn-yellow-20 {
-	--btn-bg: var(--bgl-yellow-20);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-yellow);
-}
-.bgl_btn-purple-20 {
-	--btn-bg: var(--bgl-purple-20);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-purple);
-}
-.bgl_btn-brown-20 {
-	--btn-bg: var(--bgl-brown-20);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-brown);
-}
-.bgl_btn-orange-20 {
-	--btn-bg: var(--bgl-orange-20);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-orange);
-}
-.bgl_btn-turquoise-20 {
-	--btn-bg: var(--bgl-turquoise-20);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-turquoise);
-}
-.bgl_btn-gray-20 {
-	--btn-bg: var(--bgl-gray-20);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-gray);
-}
-.bgl_btn-black-20 {
-	--btn-bg: var(--bgl-black-20);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-black);
-}
-.bgl_btn-pink-20 {
-	--btn-bg: var(--bgl-pink-20);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-pink);
-}
-/* 30% variants */
-.bgl_btn-blue-30 {
-	--btn-bg: var(--bgl-blue-30);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-blue);
-}
-.bgl_btn-green-30 {
-	--btn-bg: var(--bgl-green-30);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-green);
-}
-.bgl_btn-red-30 {
-	--btn-bg: var(--bgl-red-30);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-red);
-}
-.bgl_btn-yellow-30 {
-	--btn-bg: var(--bgl-yellow-30);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-yellow);
-}
-.bgl_btn-purple-30 {
-	--btn-bg: var(--bgl-purple-30);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-purple);
-}
-.bgl_btn-brown-30 {
-	--btn-bg: var(--bgl-brown-30);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-brown);
-}
-.bgl_btn-orange-30 {
-	--btn-bg: var(--bgl-orange-30);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-orange);
-}
-.bgl_btn-turquoise-30 {
-	--btn-bg: var(--bgl-turquoise-30);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-turquoise);
-}
-.bgl_btn-gray-30 {
-	--btn-bg: var(--bgl-gray-30);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-gray);
-}
-.bgl_btn-black-30 {
-	--btn-bg: var(--bgl-black-30);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-black);
-}
-.bgl_btn-pink-30 {
-	--btn-bg: var(--bgl-pink-30);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-pink);
-}
-/* 40% variants */
-.bgl_btn-blue-40 {
-	--btn-bg: var(--bgl-blue-40);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-blue);
-}
-.bgl_btn-green-40 {
-	--btn-bg: var(--bgl-green-40);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-green);
-}
-.bgl_btn-red-40 {
-	--btn-bg: var(--bgl-red-40);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-red);
-}
-.bgl_btn-yellow-40 {
-	--btn-bg: var(--bgl-yellow-40);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-yellow);
-}
-.bgl_btn-purple-40 {
-	--btn-bg: var(--bgl-purple-40);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-purple);
-}
-.bgl_btn-brown-40 {
-	--btn-bg: var(--bgl-brown-40);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-brown);
-}
-.bgl_btn-orange-40 {
-	--btn-bg: var(--bgl-orange-40);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-orange);
-}
-.bgl_btn-turquoise-40 {
-	--btn-bg: var(--bgl-turquoise-40);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-turquoise);
-}
-.bgl_btn-gray-40 {
-	--btn-bg: var(--bgl-gray-40);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-gray);
-}
-.bgl_btn-black-40 {
-	--btn-bg: var(--bgl-black-40);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-black);
-}
-.bgl_btn-pink-40 {
-	--btn-bg: var(--bgl-pink-40);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-pink);
-}
-/* 50% variants */
-.bgl_btn-blue-50 {
-	--btn-bg: var(--bgl-blue-50);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-blue);
-}
-.bgl_btn-green-50 {
-	--btn-bg: var(--bgl-green-50);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-green);
-}
-.bgl_btn-red-50 {
-	--btn-bg: var(--bgl-red-50);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-red);
-}
-.bgl_btn-yellow-50 {
-	--btn-bg: var(--bgl-yellow-50);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-yellow);
-}
-.bgl_btn-purple-50 {
-	--btn-bg: var(--bgl-purple-50);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-purple);
-}
-.bgl_btn-brown-50 {
-	--btn-bg: var(--bgl-brown-50);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-brown);
-}
-.bgl_btn-orange-50 {
-	--btn-bg: var(--bgl-orange-50);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-orange);
-}
-.bgl_btn-turquoise-50 {
-	--btn-bg: var(--bgl-turquoise-50);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-turquoise);
-}
-.bgl_btn-gray-50 {
-	--btn-bg: var(--bgl-gray-50);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-gray);
-}
-.bgl_btn-black-50 {
-	--btn-bg: var(--bgl-black-50);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-black);
-}
-.bgl_btn-pink-50 {
-	--btn-bg: var(--bgl-pink-50);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-pink);
-}
-/* 60% variants */
-.bgl_btn-blue-60 {
-	--btn-bg: var(--bgl-blue-60);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-blue);
-}
-.bgl_btn-green-60 {
-	--btn-bg: var(--bgl-green-60);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-green);
-}
-.bgl_btn-red-60 {
-	--btn-bg: var(--bgl-red-60);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-red);
-}
-.bgl_btn-yellow-60 {
-	--btn-bg: var(--bgl-yellow-60);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-yellow);
-}
-.bgl_btn-purple-60 {
-	--btn-bg: var(--bgl-purple-60);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-purple);
-}
-.bgl_btn-brown-60 {
-	--btn-bg: var(--bgl-brown-60);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-brown);
-}
-.bgl_btn-orange-60 {
-	--btn-bg: var(--bgl-orange-60);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-orange);
-}
-.bgl_btn-turquoise-60 {
-	--btn-bg: var(--bgl-turquoise-60);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-turquoise);
-}
-.bgl_btn-gray-60 {
-	--btn-bg: var(--bgl-gray-60);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-gray);
-}
-.bgl_btn-black-60 {
-	--btn-bg: var(--bgl-black-60);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-black);
-}
-.bgl_btn-pink-60 {
-	--btn-bg: var(--bgl-pink-60);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-pink);
-}
-/* Continue with 70%, 80%, 90%, 100%, 110%, 120%, 130% variants following same pattern */
-/* For brevity, I'll add the darker variants that typically use white text */
-/* 70% variants */
-.bgl_btn-blue-70 {
-	--btn-bg: var(--bgl-blue-70);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-blue);
-}
-.bgl_btn-green-70 {
-	--btn-bg: var(--bgl-green-70);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-green);
-}
-.bgl_btn-red-70 {
-	--btn-bg: var(--bgl-red-70);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-red);
-}
-.bgl_btn-yellow-70 {
-	--btn-bg: var(--bgl-yellow-70);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-yellow);
-}
-.bgl_btn-purple-70 {
-	--btn-bg: var(--bgl-purple-70);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-purple);
-}
-.bgl_btn-brown-70 {
-	--btn-bg: var(--bgl-brown-70);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-brown);
-}
-.bgl_btn-orange-70 {
-	--btn-bg: var(--bgl-orange-70);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-orange);
-}
-.bgl_btn-turquoise-70 {
-	--btn-bg: var(--bgl-turquoise-70);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-turquoise);
-}
-.bgl_btn-gray-70 {
-	--btn-bg: var(--bgl-gray-70);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-gray);
-}
-.bgl_btn-black-70 {
-	--btn-bg: var(--bgl-black-70);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-black);
-}
-.bgl_btn-pink-70 {
-	--btn-bg: var(--bgl-pink-70);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-pink);
-}
-/* 80% variants */
-.bgl_btn-blue-80 {
-	--btn-bg: var(--bgl-blue-80);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-blue);
-}
-.bgl_btn-green-80 {
-	--btn-bg: var(--bgl-green-80);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-green);
-}
-.bgl_btn-red-80 {
-	--btn-bg: var(--bgl-red-80);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-red);
-}
-.bgl_btn-yellow-80 {
-	--btn-bg: var(--bgl-yellow-80);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-yellow);
-}
-.bgl_btn-purple-80 {
-	--btn-bg: var(--bgl-purple-80);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-purple);
-}
-.bgl_btn-brown-80 {
-	--btn-bg: var(--bgl-brown-80);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-brown);
-}
-.bgl_btn-orange-80 {
-	--btn-bg: var(--bgl-orange-80);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-orange);
-}
-.bgl_btn-turquoise-80 {
-	--btn-bg: var(--bgl-turquoise-80);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-turquoise);
-}
-.bgl_btn-gray-80 {
-	--btn-bg: var(--bgl-gray-80);
-	--btn-color: var(--bgl-black);
-	--btn-flat-color: var(--bgl-gray);
-}
-.bgl_btn-black-80 {
-	--btn-bg: var(--bgl-black-80);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-black);
-}
-.bgl_btn-pink-80 {
-	--btn-bg: var(--bgl-pink-80);
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-pink);
-}
-/* 90%-130% variants all use white text for better contrast on darker backgrounds */
-.bgl_btn-blue-90, .bgl_btn-blue-100, .bgl_btn-blue-110, .bgl_btn-blue-120, .bgl_btn-blue-130 {
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-blue);
-}
-.bgl_btn-green-90, .bgl_btn-green-100, .bgl_btn-green-110, .bgl_btn-green-120, .bgl_btn-green-130 {
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-green);
-}
-.bgl_btn-red-90, .bgl_btn-red-100, .bgl_btn-red-110, .bgl_btn-red-120, .bgl_btn-red-130 {
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-red);
-}
-.bgl_btn-yellow-90, .bgl_btn-yellow-100, .bgl_btn-yellow-110, .bgl_btn-yellow-120, .bgl_btn-yellow-130 {
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-yellow);
-}
-.bgl_btn-purple-90, .bgl_btn-purple-100, .bgl_btn-purple-110, .bgl_btn-purple-120, .bgl_btn-purple-130 {
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-purple);
-}
-.bgl_btn-brown-90, .bgl_btn-brown-100, .bgl_btn-brown-110, .bgl_btn-brown-120, .bgl_btn-brown-130 {
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-brown);
-}
-.bgl_btn-orange-90, .bgl_btn-orange-100, .bgl_btn-orange-110, .bgl_btn-orange-120, .bgl_btn-orange-130 {
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-orange);
-}
-.bgl_btn-turquoise-90, .bgl_btn-turquoise-100, .bgl_btn-turquoise-110, .bgl_btn-turquoise-120, .bgl_btn-turquoise-130 {
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-turquoise);
-}
-.bgl_btn-gray-90, .bgl_btn-gray-100, .bgl_btn-gray-110, .bgl_btn-gray-120, .bgl_btn-gray-130 {
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-gray);
-}
-.bgl_btn-black-90, .bgl_btn-black-100, .bgl_btn-black-110, .bgl_btn-black-120, .bgl_btn-black-130 {
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-black);
-}
-.bgl_btn-pink-90, .bgl_btn-pink-100, .bgl_btn-pink-110, .bgl_btn-pink-120, .bgl_btn-pink-130 {
-	--btn-color: var(--bgl-white);
-	--btn-flat-color: var(--bgl-pink);
-}
-/* Individual background definitions for 90%-130% */
-.bgl_btn-blue-90 { --btn-bg: var(--bgl-blue-90); }
-.bgl_btn-green-90 { --btn-bg: var(--bgl-green-90); }
-.bgl_btn-red-90 { --btn-bg: var(--bgl-red-90); }
-.bgl_btn-yellow-90 { --btn-bg: var(--bgl-yellow-90); }
-.bgl_btn-purple-90 { --btn-bg: var(--bgl-purple-90); }
-.bgl_btn-brown-90 { --btn-bg: var(--bgl-brown-90); }
-.bgl_btn-orange-90 { --btn-bg: var(--bgl-orange-90); }
-.bgl_btn-turquoise-90 { --btn-bg: var(--bgl-turquoise-90); }
-.bgl_btn-gray-90 { --btn-bg: var(--bgl-gray-90); }
-.bgl_btn-black-90 { --btn-bg: var(--bgl-black-90); }
-.bgl_btn-pink-90 { --btn-bg: var(--bgl-pink-90); }
-.bgl_btn-blue-100 { --btn-bg: var(--bgl-blue-100); }
-.bgl_btn-green-100 { --btn-bg: var(--bgl-green-100); }
-.bgl_btn-red-100 { --btn-bg: var(--bgl-red-100); }
-.bgl_btn-yellow-100 { --btn-bg: var(--bgl-yellow-100); }
-.bgl_btn-purple-100 { --btn-bg: var(--bgl-purple-100); }
-.bgl_btn-brown-100 { --btn-bg: var(--bgl-brown-100); }
-.bgl_btn-orange-100 { --btn-bg: var(--bgl-orange-100); }
-.bgl_btn-turquoise-100 { --btn-bg: var(--bgl-turquoise-100); }
-.bgl_btn-gray-100 { --btn-bg: var(--bgl-gray-100); }
-.bgl_btn-black-100 { --btn-bg: var(--bgl-black-100); }
-.bgl_btn-pink-100 { --btn-bg: var(--bgl-pink-100); }
-.bgl_btn-blue-110 { --btn-bg: var(--bgl-blue-110); }
-.bgl_btn-green-110 { --btn-bg: var(--bgl-green-110); }
-.bgl_btn-red-110 { --btn-bg: var(--bgl-red-110); }
-.bgl_btn-yellow-110 { --btn-bg: var(--bgl-yellow-110); }
-.bgl_btn-purple-110 { --btn-bg: var(--bgl-purple-110); }
-.bgl_btn-brown-110 { --btn-bg: var(--bgl-brown-110); }
-.bgl_btn-orange-110 { --btn-bg: var(--bgl-orange-110); }
-.bgl_btn-turquoise-110 { --btn-bg: var(--bgl-turquoise-110); }
-.bgl_btn-gray-110 { --btn-bg: var(--bgl-gray-110); }
-.bgl_btn-black-110 { --btn-bg: var(--bgl-black-110); }
-.bgl_btn-pink-110 { --btn-bg: var(--bgl-pink-110); }
-.bgl_btn-blue-120 { --btn-bg: var(--bgl-blue-120); }
-.bgl_btn-green-120 { --btn-bg: var(--bgl-green-120); }
-.bgl_btn-red-120 { --btn-bg: var(--bgl-red-120); }
-.bgl_btn-yellow-120 { --btn-bg: var(--bgl-yellow-120); }
-.bgl_btn-purple-120 { --btn-bg: var(--bgl-purple-120); }
-.bgl_btn-brown-120 { --btn-bg: var(--bgl-brown-120); }
-.bgl_btn-orange-120 { --btn-bg: var(--bgl-orange-120); }
-.bgl_btn-turquoise-120 { --btn-bg: var(--bgl-turquoise-120); }
-.bgl_btn-gray-120 { --btn-bg: var(--bgl-gray-120); }
-.bgl_btn-black-120 { --btn-bg: var(--bgl-black-120); }
-.bgl_btn-pink-120 { --btn-bg: var(--bgl-pink-120); }
-.bgl_btn-blue-130 { --btn-bg: var(--bgl-blue-130); }
-.bgl_btn-green-130 { --btn-bg: var(--bgl-green-130); }
-.bgl_btn-red-130 { --btn-bg: var(--bgl-red-130); }
-.bgl_btn-yellow-130 { --btn-bg: var(--bgl-yellow-130); }
-.bgl_btn-purple-130 { --btn-bg: var(--bgl-purple-130); }
-.bgl_btn-brown-130 { --btn-bg: var(--bgl-brown-130); }
-.bgl_btn-orange-130 { --btn-bg: var(--bgl-orange-130); }
-.bgl_btn-turquoise-130 { --btn-bg: var(--bgl-turquoise-130); }
-.bgl_btn-gray-130 { --btn-bg: var(--bgl-gray-130); }
-.bgl_btn-black-130 { --btn-bg: var(--bgl-black-130); }
-.bgl_btn-pink-130 { --btn-bg: var(--bgl-pink-130); }