@blockbite/tailwind 3.4.13 → 3.4.14

package/theme-example.json

@@ -1,329 +0,0 @@
-{
-    "$schema": "https://schemas.wp.org/wp/6.2/theme.json",
-    "settings": {
-        "appearanceTools": true,
-		 "layout": {
-            "contentSize": "960px",
-            "wideSize": "1440px"
-        },
-        "color": {
-			"palette": [
-				{
-					"slug": "primary-light",
-					"color": "#E9F4FF",
-					"name": "primary-light"
-				},
-				{
-					"slug": "primary",
-					"color": "#7152EC",
-					"name": "primary"
-				},
-                {
-					"slug": "primary-medium",
-					"color": "#559ADF",
-					"name": "primary-medium"
-				},
-				{
-					"slug": "primary-dark",
-					"color": "#1B389F",
-					"name": "primary-dark"
-				},
-				{
-					"slug": "secondary",
-					"color": "#FF0000",
-					"name": "secondary"
-				},
-                {
-					"slug": "secondary-dark",
-					"color": "#5C1E1E",
-					"name": "secondary-dark"
-				},
-                {
-					"slug": "black",
-					"color": "#1E2E36",
-					"name": "black"
-				},
-                {
-					"slug": "white",
-					"color": "#FFF",
-					"name": "white"
-				}
-			]
-		},
-        "spacing": {
-		
-            "spacingScale": {
-				"steps": 0
-			},
-			"spacingSizes": [
-				{
-					"size": "0px",
-					"slug": "0",
-					"name": "0"
-				},
-				{
-					"size": "clamp(16px, 1vw, 32px);",
-					"slug": "1",
-					"name": "1"
-				},
-				{
-					"size": "clamp(32px, 1vw, 48px);",
-					"slug": "2",
-					"name": "2"
-				},
-				{
-					"size": "clamp(40px, 1vw, 50px);",
-					"slug": "3",
-					"name": "3"
-				},
-				{
-					"size": "clamp(64px, 1vw, 80px);",
-					"slug": "4",
-					"name": "4"
-				},
-				{
-					"size": "clamp(128px, 1vw, 144px);",
-					"slug": "5",
-					"name": "5"
-				},
-				{
-					"size": "clamp(144px, 1vw, 164px);",
-					"slug": "6",
-					"name": "6"
-				}
-			],
-            "blockGap": true,
-            "margin": true,
-			"padding": true,
-            "units": [
-                "%",
-                "px",
-                "em",
-                "rem",
-                "vh",
-                "vw"
-            ]
-        },
-        "typography": {
-            "fluid": true,
-			"lineHeight": true,
-			"fontWeight": true,
-			"fontStyle": false,
-            "fontFamilies": [
-				{
-					"fontFamily": "\"TitilliumWeb\", sans",
-					"name": "TitilliumWeb",
-					"slug": "expressive",
-					"fontFace": [
-						{
-							"fontFamily": "TitilliumWeb",
-							"fontWeight": "700",
-							"fontStyle": "normal",
-							"fontStretch": "normal",
-							"src": [ "file:./resources/fonts/TitilliumWeb-Bold.woff2" ]
-						},
-                        {
-							"fontFamily": "TitilliumWeb",
-							"fontWeight": "600",
-							"fontStyle": "medium",
-							"fontStretch": "normal",
-							"src": [ "file:./resources/fonts/TitilliumWeb-SemiBold.woff2" ]
-						},
-						{
-							"fontFamily": "TitilliumWeb",
-							"fontWeight": "400",
-							"fontStyle": "normal",
-							"fontStretch": "normal",
-							"src": [ "file:./resources/fonts/TitilliumWeb-Regular.woff2" ]
-						}
-					]
-				},
-				{
-					"fontFamily": "\"Inter\", sans",
-					"name": "Inter",
-					"slug": "productive",
-					"fontFace": [
-						{
-							"fontFamily": "Inter",
-							"fontWeight": "400",
-							"fontStyle": "normal",
-							"fontStretch": "normal",
-							"src": [ "file:./resources/fonts/Inter-Regular.woff2" ]
-						},
-                        {
-							"fontFamily": "Inter",
-							"fontWeight": "600",
-							"fontStyle": "bold",
-							"fontStretch": "normal",
-							"src": [ "file:./resources/fonts/Inter-Medium.woff2" ]
-						}
-					]
-				}
-			],
-            "fontSizes": [
-                {
-                    "name": "Tiny",
-                    "slug": "tiny",
-                    "size": "0.9rem",
-					"fluid": {
-						"min": "0.8rem",
-						"max": "1rem"
-					}
-                },
-				{
-                    "name": "Small",
-                    "slug": "small",
-                    "size": "1rem",
-					"fluid": {
-						"min": "1rem",
-						"max": "1.1rem"
-					}
-                },
-                {
-                    "name": "Standard",
-                    "slug": "standard",
-                    "size": "1.2rem",
-					"fluid": {
-						"min": "1.2rem",
-						"max": "1.3rem"
-					}
-                },
-                {
-                    "name": "Standard XL",
-                    "slug": "standard-xl",
-                    "size": "1.5rem",
-					"fluid": {
-						"min": "1.5rem",
-						"max": "1.6rem"
-					}
-                },
-                {
-                    "name": "Medium",
-                    "slug": "medium",
-                    "size": "1.8rem",
-					"fluid": {
-						"min": "1.4rem",
-						"max": "2.2rem"
-					}
-                },
-                {
-                    "name": "Large",
-                    "slug": "large",
-                    "size": "2.2rem",
-					"fluid": {
-						"min": "1.6rem",
-						"max": "2.6rem"
-					}
-                },
-				{
-					"size": "2.6rem",
-					"fluid": {
-						"min": "1.8rem",
-						"max": "3.4rem"
-					},
-					"slug": "huge",
-					"name": "Huge"
-				},
-             
-                {
-                    "name": "Gigantic",
-                    "slug": "gigantic",
-                    "size": "3.8rem",
-					"fluid": {
-						"min": "2.8rem",
-						"max": "4.5rem"
-					}
-                }
-            ]
-        }
-    },
-    "templateParts": [
-        {
-            "area": "header",
-            "name": "header"
-        },
-        {
-            "area": "footer",
-            "name": "footer"
-        }
-    ],
-    "version": 2,
-    "styles": {
-		"typography": {
-			"fontFamily": "Inter",
-			"fontWeight": "300",
-			"lineHeight": "1.5",
-			"fontSize": "20px"
-		},
-		"elements": {
-			"link":{ 
-				"typography":{ 
-					"textDecoration":"false" 
-				}
-			}
-		},
-        "spacing": {
-			"blockGap": "0.5rem"
-		},
-        "blocks": {
-			"core/heading": {
-				"typography": {
-					"fontSize":"var(--wp--preset--font-size--standard-xl)",
-					"fontFamily": "var(--wp--preset--font-family--expressive)",
-					"fontWeight": "600",
-					"lineHeight": "1.25"
-				},
-				"spacing": {
-                    "margin": {
-                        "top": "var(--wp--preset--spacing--1)",
-                        "bottom": "var(--wp--preset--spacing--1)"
-                    }
-                }
-			},
-            "blockbite/section": {
-                "spacing": {
-                    "padding": {
-                        "top": "var(--wp--preset--spacing--2)",
-                        "bottom": "var(--wp--preset--spacing--2)"
-                    },
-					"margin": {
-                        "top": "var(--wp--preset--spacing--0)",
-                        "bottom": "var(--wp--preset--spacing--0)"
-                    }
-                }
-            },
-            "blockbite/advanced-button": {
-                "spacing": {
-                    "margin": {
-                        "top": "var(--wp--preset--spacing--1)",
-                        "bottom": "var(--wp--preset--spacing--1)"
-                    }
-                }
-            },
-			"core/columns": {
-                "spacing": {
-                    "margin": {
-                        "top": "var(--wp--preset--spacing--0 )",
-                        "bottom": "var(--wp--preset--spacing--0 )"
-                    }
-                }
-            },
-            "core/column": {
-                "spacing": {
-                    "padding": {
-                        "top": "var(--wp--preset--spacing--1 )",
-                        "bottom": "var(--wp--preset--spacing--1 )"
-                    }
-                }
-            },
-			"core/paragraph": {
-                "spacing": {
-                    "margin": {
-                        "top": "0.5rem",
-                        "bottom": "0.5rem"
-                    }
-                }
-            }
-        }
-    }
-}

package/themecolors/index.js

@@ -1,65 +0,0 @@
-const plugin = require('tailwindcss/plugin');
-
-function flattenColorPalette(colors, prefix = '') {
-  return Object.entries(colors).flatMap(([key, value]) => {
-    const name = prefix ? `${prefix}-${key}` : key;
-    if (typeof value === 'string') {
-      return [[name, value]];
-    }
-    return flattenColorPalette(value, name);
-  });
-}
-
-module.exports = plugin(({ addUtilities, theme, e }) => {
-  const colors = theme('colors');
-
-  const flatColors = flattenColorPalette(colors);
-
-  const themedVarMap = {
-    bg: '--theme-bg',
-    text: '--theme-text',
-    border: '--theme-border',
-    fill: '--theme-fill',
-    stroke: '--theme-stroke',
-    ring: '--theme-ring',
-  };
-
-  const themedUtilities = flatColors.flatMap(([name, value]) => {
-    return Object.entries(themedVarMap).map(([type, cssVar]) => {
-      return {
-        [`.b_theme-${type}-${e(name)}`]: {
-          [cssVar]: value,
-        },
-      };
-    });
-  });
-
-  const applyThemeClasses = {
-    '.bg-b_theme': {
-      'background-color': 'var(--theme-bg)',
-    },
-    '.text-b_theme': {
-      color: 'var(--theme-text)',
-    },
-    '.border-b_theme': {
-      'border-color': 'var(--theme-border)',
-    },
-    '.fill-b_theme': {
-      fill: 'var(--theme-fill)',
-    },
-    '.stroke-b_theme': {
-      stroke: 'var(--theme-stroke)',
-    },
-    '.ring-b_theme': {
-      '--tw-ring-color': 'var(--theme-ring)',
-    },
-  };
-
-  addUtilities(themedUtilities, {
-    variants: ['responsive', 'hover', 'focus'],
-  });
-
-  addUtilities(applyThemeClasses, {
-    variants: ['responsive', 'hover', 'focus'],
-  });
-});

package/vite.css

@@ -1,8 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-h1{
-  @apply text-4xl;
-}
-

package/vite.js

@@ -1,64 +0,0 @@
-import './vite.css';
-document.querySelector('#app').innerHTML = `
-<div style="--b_full:100%;">
-  <div class="w-full h-[500px] grid b_grid-area-64 bg-red-200">
-    <h1 class="bg-yellow-200 b_area md:b_area-x-6 md:b_area-y-4 md:b_area-w-14 md:b_area-h-14">Grid area </h1>
-  </div>
-
-
-   <div class="w-full h-[500px] grid b_grid-area-64 bg-red-200">
-    <h1 class="bg-yellow-200 b_area-[1-1-20-40]">Grid area !</h1>
-  </div>
-
-  <div class="container bg-red-yellow-200 my-4 mx-auto">
-    <h4 class="border-red-200 text-4xl border border-red-200  h-[300px]">container tailwind</h4>
-  </div>
-
-
-  <div class="b_container-fluid bg-red-yellow-200 my-4">
-    <h4 class="border-red-200 text-4xl border border-red-200  h-[300px]">container fluid</h4>
-  </div>
-
-  <div class="b_grid-container bg-red-yellow-200 my-4 h-[300px]">
-    <h4 class="border border-red-200 text-4xl col-span-12 col-start-2">container grid</h4>
-  </div>
-
- <div class="b_grid-container bg-red-yellow-200 my-4 h-[300px]">
-    <h4 class="border border-red-200 text-4xl col-span-7 col-start-1">left</h4>
-    <p class="border border-red-200 text-4xl col-span-6">right</p>
-  </div>
-
-   <div class="b_grid-container bg-red-yellow-200 my-4 h-[300px]">
-    <h4 class="border border-red-200 text-4xl col-span-6 col-start-2">left</h4>
-    <p class="border border-red-200 text-4xl col-span-7 col-start-8">right</p>
-  </div>
-
-   <div class="b_grid-container bg-yellow-200 my-4 h-[300px]">
-      <h4 class="border bg-red-200 text-4xl col-span-7 col-start-1 row-start-1">left image</h4>
-      <h4 class="border border-blue-200 bg-blue-200 bg-opacity-40 text-4xl col-span-6 col-start-2 row-start-1">left text with extra layer</h4>
-       <p class="border border-red-200 text-4xl col-span-6">right</p>
-   </div>
-
-
-    <div class="b_grid-container bg-yellow-200 my-4 h-[300px]">
-      <h4 class="border bg-red-200 text-4xl col-span-7 col-start-8 row-start-1 text-right">right image</h4>
-      <h4 class="border border-blue-200 bg-blue-200 bg-opacity-40 text-4xl col-span-6 col-start-8 row-start-1">left text</h4>
-       <p class="border border-red-200 text-4xl col-span-6">left</p>
-   </div>
-
-
-    <div class="b_grid-container bg-yellow-200 my-4 h-[300px] w-full">
-      <div class="border bg-red-200 text-4xl col-span-7 col-start-1 row-start-1">
-        <h4 class="border border-blue-200 bg-blue-200 bg-opacity-40 text-4xl" style="padding-left:var(--b_fr-size);">left text with --b_fr-size</h4>
-      </div>
-      
-       <p class="border border-red-200 text-4xl col-span-6">right</p>
-   </div>
-
-<div class="b_theme-bg-red-500 bg-yellow-300 text-white p-40 text-3xl">
-  Works beautifully 🎨
-  <div class="bg-b_theme">This should be red from the parent</div>
-</div>
-  
-</div>
-`;