@blockbite/tailwind 3.4.12 → 3.4.13

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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @blockbite/tailwind
2
2
 
3
+ ## 3.4.13
4
+
5
+ ### Patch Changes
6
+
7
+ - dfd9376: Address deprecation warnings for Toggle Controls, Range Sliders, Text Controls, and Toggle Group Controls
8
+
3
9
  ## 3.4.12
4
10
 
5
11
  ### Patch Changes
@@ -1,6 +1,6 @@
1
- module.exports = function ({ addComponents, theme }) {
1
+ module.exports = function ({ addComponents }) {
2
2
  const anchorTopCenter = {
3
- '.b_anchor-top-center': {
3
+ '.anchor-top-center': {
4
4
  position: 'absolute',
5
5
  top: '0',
6
6
  left: '50%',
@@ -9,7 +9,7 @@ module.exports = function ({ addComponents, theme }) {
9
9
  };
10
10
 
11
11
  const anchorTopLeft = {
12
- '.b_anchor-top-left': {
12
+ '.anchor-top-left': {
13
13
  position: 'absolute',
14
14
  top: '0',
15
15
  left: '0',
@@ -17,7 +17,7 @@ module.exports = function ({ addComponents, theme }) {
17
17
  };
18
18
 
19
19
  const anchorTopRight = {
20
- '.b_anchor-top-right': {
20
+ '.anchor-top-right': {
21
21
  position: 'absolute',
22
22
  top: '0',
23
23
  right: '0',
@@ -25,7 +25,7 @@ module.exports = function ({ addComponents, theme }) {
25
25
  };
26
26
 
27
27
  const anchorBottomCenter = {
28
- '.b_anchor-bottom-center': {
28
+ '.anchor-bottom-center': {
29
29
  position: 'absolute',
30
30
  bottom: '0',
31
31
  left: '50%',
@@ -34,7 +34,7 @@ module.exports = function ({ addComponents, theme }) {
34
34
  };
35
35
 
36
36
  const anchorBottomLeft = {
37
- '.b_anchor-bottom-left': {
37
+ '.anchor-bottom-left': {
38
38
  position: 'absolute',
39
39
  bottom: '0',
40
40
  left: '0',
@@ -42,7 +42,7 @@ module.exports = function ({ addComponents, theme }) {
42
42
  };
43
43
 
44
44
  const anchorBottomRight = {
45
- '.b_anchor-bottom-right': {
45
+ '.anchor-bottom-right': {
46
46
  position: 'absolute',
47
47
  bottom: '0',
48
48
  right: '0',
@@ -50,7 +50,7 @@ module.exports = function ({ addComponents, theme }) {
50
50
  };
51
51
 
52
52
  const anchorCenterLeft = {
53
- '.b_anchor-center-left': {
53
+ '.anchor-center-left': {
54
54
  position: 'absolute',
55
55
  top: '50%',
56
56
  left: '0',
@@ -59,7 +59,7 @@ module.exports = function ({ addComponents, theme }) {
59
59
  };
60
60
 
61
61
  const anchorCenterRight = {
62
- '.b_anchor-center-right': {
62
+ '.anchor-center-right': {
63
63
  position: 'absolute',
64
64
  top: '50%',
65
65
  right: '0',
@@ -68,7 +68,7 @@ module.exports = function ({ addComponents, theme }) {
68
68
  };
69
69
 
70
70
  const anchorCenterCenter = {
71
- '.b_anchor-center-center': {
71
+ '.anchor-center-center': {
72
72
  position: 'absolute',
73
73
  top: '50%',
74
74
  left: '50%',
@@ -77,7 +77,7 @@ module.exports = function ({ addComponents, theme }) {
77
77
  };
78
78
 
79
79
  const anchorCenterTop = {
80
- '.b_anchor-center-top': {
80
+ '.anchor-center-top': {
81
81
  position: 'absolute',
82
82
  top: '0',
83
83
  left: '50%',
@@ -86,7 +86,7 @@ module.exports = function ({ addComponents, theme }) {
86
86
  };
87
87
 
88
88
  const anchorCenterBottom = {
89
- '.b_anchor-center-bottom': {
89
+ '.anchor-center-bottom': {
90
90
  position: 'absolute',
91
91
  bottom: '0',
92
92
  left: '50%',
@@ -8,7 +8,7 @@ module.exports = function ({ addComponents, theme, config }) {
8
8
  const prefix = typeof important === 'string' ? important : '';
9
9
 
10
10
  const container = {
11
- [`${prefix} .b_container-fluid`]: {
11
+ [`${prefix} .container-fluid`]: {
12
12
  marginLeft: 'auto',
13
13
  marginRight: 'auto',
14
14
  paddingLeft: 'var(--b_padding, 4vw)',
@@ -20,7 +20,7 @@ module.exports = function ({ addComponents, theme, config }) {
20
20
  // Add a media query for screens at '2xl' size
21
21
  if (maxWidth2xl) {
22
22
  container[`@media (min-width: ${maxWidth2xl})`] = {
23
- [`${prefix} .b_container-fluid`]: {
23
+ [`${prefix} .container-fluid`]: {
24
24
  maxWidth: maxWidth2xl,
25
25
  marginLeft: 'auto',
26
26
  marginRight: 'auto',
@@ -3,11 +3,11 @@ module.exports = function ({ addComponents, theme, config }) {
3
3
  const maxWidth2xl = theme('screens.2xl');
4
4
 
5
5
  const important = config('important');
6
- const cssVars = config('cssVars') | false;
6
+ const cssVars = config('cssVars') || false;
7
7
  const prefix = typeof important === 'string' ? important : '';
8
8
 
9
9
  const container = {
10
- [`${prefix} .b_grid-container`]: {
10
+ [`${prefix} .grid-container`]: {
11
11
  display: 'grid',
12
12
  gridTemplateColumns: '1fr repeat(12, var(--b_col-width)) 1fr!important',
13
13
  },
@@ -1,6 +1,6 @@
1
1
  module.exports = function ({ addComponents }) {
2
2
  const b_tileslide_in = {
3
- '.b_tile-in-left': {
3
+ '.tile-in-left': {
4
4
  position: 'absolute!important',
5
5
  top: 0,
6
6
  left: 0,
@@ -11,13 +11,13 @@ module.exports = function ({ addComponents }) {
11
11
  transition: 'transform 0.5s',
12
12
  transform: 'translateX(-100%)',
13
13
  },
14
- '.b_active .b_tile-in-left': {
14
+ '.active .tile-in-left': {
15
15
  transform: 'translateX(0%)',
16
16
  },
17
17
  };
18
18
 
19
19
  const b_tilefade_in = {
20
- '.b_tile-in-fade': {
20
+ '.tile-in-fade': {
21
21
  opacity: 0,
22
22
  transition: 'opacity 0.5s',
23
23
  position: 'absolute!important',
@@ -28,7 +28,7 @@ module.exports = function ({ addComponents }) {
28
28
  zIndex: 10,
29
29
  overflow: 'hidden',
30
30
  },
31
- '.b_active .b_tile-in-fade': {
31
+ '.active .tile-in-fade': {
32
32
  opacity: 1,
33
33
  },
34
34
  };
@@ -1,7 +1,7 @@
1
1
  module.exports = function ({ addComponents }) {
2
2
  // allows infinite loop for swiper continues
3
3
  const b_newsticker = {
4
- '.b_newsticker': {
4
+ '.newsticker': {
5
5
  '& > .swiper-free-mode > .swiper-wrapper': {
6
6
  '-webkit-transition-timing-function': 'linear !important',
7
7
  '-o-transition-timing-function': 'linear !important',
@@ -0,0 +1 @@
1
+ *,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.container{width:100%;margin-right:auto;margin-left:auto;padding-right:var(--b_padding, 1rem);padding-left:var(--b_padding, 1rem)}@media (min-width: 640px){.container{max-width:640px;padding-right:var(--b_padding, 1rem);padding-left:var(--b_padding, 1rem)}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px;padding-right:var(--b_padding, 1rem);padding-left:var(--b_padding, 1rem)}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}.area{grid-area:var(--b_area-y) / var(--b_area-x) / calc(var(--b_area-y) + var(--b_area-h)) / calc(var(--b_area-x) + var(--b_area-w))}.b_grid-area-64{display:grid;grid-template-columns:repeat(64,1fr);grid-template-rows:repeat(64,1fr);--init-area: 1 / 1 / 16 / 16}.col-span-12{grid-column:span 12 / span 12}.col-span-6{grid-column:span 6 / span 6}.col-span-7{grid-column:span 7 / span 7}.col-start-1{grid-column-start:1}.col-start-2{grid-column-start:2}.col-start-8{grid-column-start:8}.row-start-1{grid-row-start:1}.mx-auto{margin-left:auto;margin-right:auto}.my-4{margin-top:1rem;margin-bottom:1rem}.grid{display:grid}.h-\[300px\]{height:300px}.h-\[500px\]{height:500px}.w-full{width:100%}.border{border-width:1px}.border-blue-200{--tw-border-opacity: 1;border-color:rgb(191 219 254 / var(--tw-border-opacity, 1))}.border-red-200{--tw-border-opacity: 1;border-color:rgb(254 202 202 / var(--tw-border-opacity, 1))}.bg-blue-200{--tw-bg-opacity: 1;background-color:rgb(191 219 254 / var(--tw-bg-opacity, 1))}.bg-red-200{--tw-bg-opacity: 1;background-color:rgb(254 202 202 / var(--tw-bg-opacity, 1))}.bg-yellow-200{--tw-bg-opacity: 1;background-color:rgb(254 240 138 / var(--tw-bg-opacity, 1))}.bg-yellow-300{--tw-bg-opacity: 1;background-color:rgb(253 224 71 / var(--tw-bg-opacity, 1))}.bg-opacity-40{--tw-bg-opacity: .4}.p-40{padding:10rem}.text-right{text-align:right}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.b_theme-bg-red-500{--theme-bg: #ef4444}.bg-b_theme{background-color:var(--theme-bg)}h1{font-size:2.25rem;line-height:2.5rem}
package/dist/index.html CHANGED
@@ -7,8 +7,8 @@
7
7
  <title>Vite App</title>
8
8
 
9
9
 
10
- <script type="module" crossorigin src="/assets/index-BUymJr41.js"></script>
11
- <link rel="stylesheet" crossorigin href="/assets/index-iiB8K1As.css">
10
+ <script type="module" crossorigin src="/assets/index-BeSH1wKF.js"></script>
11
+ <link rel="stylesheet" crossorigin href="/assets/index-CFh4XZ-f.css">
12
12
  </head>
13
13
 
14
14
 
@@ -1,12 +1,12 @@
1
- module.exports = function ({ addUtilities, theme, e }) {
1
+ module.exports = function ({ addUtilities, e }) {
2
2
  const newUtilities = {};
3
3
 
4
4
  // 96 is max resolution
5
5
  for (let i = 0; i <= 97; i++) {
6
- newUtilities[`.${e(`b_area-x-${i}`)}`] = { '--b_area-x': `${i}` };
7
- newUtilities[`.${e(`b_area-y-${i}`)}`] = { '--b_area-y': `${i}` };
8
- newUtilities[`.${e(`b_area-w-${i}`)}`] = { '--b_area-w': `${i}` };
9
- newUtilities[`.${e(`b_area-h-${i}`)}`] = { '--b_area-h': `${i}` };
6
+ newUtilities[`.${e(`area-x-${i}`)}`] = { '--b_area-x': `${i}` };
7
+ newUtilities[`.${e(`area-y-${i}`)}`] = { '--b_area-y': `${i}` };
8
+ newUtilities[`.${e(`area-w-${i}`)}`] = { '--b_area-w': `${i}` };
9
+ newUtilities[`.${e(`area-h-${i}`)}`] = { '--b_area-h': `${i}` };
10
10
  }
11
11
 
12
12
  addUtilities(newUtilities, ['responsive']);
@@ -1,11 +1,9 @@
1
- const plugin = require('tailwindcss/plugin');
2
-
3
- module.exports = function ({ addComponents, matchUtilities, theme, config }) {
1
+ module.exports = function ({ addComponents, matchUtilities, config }) {
4
2
  const important = config('important');
5
3
  const prefix = typeof important === 'string' ? important : '';
6
4
  // Predefined grid-area utilities
7
5
  addComponents({
8
- [`${prefix} .b_area`]: {
6
+ [`${prefix} .area`]: {
9
7
  gridArea:
10
8
  'var(--b_area-y) / var(--b_area-x) / calc(var(--b_area-y) + var(--b_area-h)) / calc(var(--b_area-x) + var(--b_area-w))',
11
9
  },
@@ -36,7 +34,7 @@ module.exports = function ({ addComponents, matchUtilities, theme, config }) {
36
34
  });
37
35
  matchUtilities(
38
36
  {
39
- b_area: (value) => {
37
+ area: (value) => {
40
38
  // Remove the square brackets and split the value by "/"
41
39
  const parts = value.split('-'); // slice to remove the square brackets
42
40
  if (parts.length === 4) {
@@ -1,8 +1,8 @@
1
- module.exports = function ({ addUtilities, theme, e }, gridSpacing) {
1
+ module.exports = function ({ addUtilities, theme, e }) {
2
2
  const spacing = theme('spacing');
3
3
  const newUtilities = {};
4
4
 
5
- Object.entries(spacing).map(([key, value]) => {
5
+ Object.entries(spacing).forEach(([key, value]) => {
6
6
  newUtilities[`.${e(`b_ani-x-${key}`)}`] = { '--an-ani-x': `${value}` };
7
7
  newUtilities[`.${e(`b_ani-y-${key}`)}`] = { '--an-ani-y': `${value}` };
8
8
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@blockbite/tailwind",
3
- "version": "3.4.12",
3
+ "version": "3.4.13",
4
4
  "description": "helper for blockbite plugin and blockbite theme",
5
5
  "main": "index.js",
6
6
  "author": "block-bite.com",
@@ -1 +0,0 @@
1
- *,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.container{width:100%;margin-right:auto;margin-left:auto;padding-right:var(--b_padding, 1rem);padding-left:var(--b_padding, 1rem)}@media (min-width: 640px){.container{max-width:640px;padding-right:var(--b_padding, 1rem);padding-left:var(--b_padding, 1rem)}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px;padding-right:var(--b_padding, 1rem);padding-left:var(--b_padding, 1rem)}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}.b_area{grid-area:var(--b_area-y) / var(--b_area-x) / calc(var(--b_area-y) + var(--b_area-h)) / calc(var(--b_area-x) + var(--b_area-w))}.b_grid-area-64{display:grid;grid-template-columns:repeat(64,1fr);grid-template-rows:repeat(64,1fr);--init-area: 1 / 1 / 16 / 16}.b_container-fluid{margin-left:auto;margin-right:auto;padding-left:var(--b_padding, 4vw);padding-right:var(--b_padding, 4vw)}@media (min-width: 1536px){.b_container-fluid{max-width:1536px;margin-left:auto;margin-right:auto;padding-left:var(--b_padding, 1rem);padding-right:var(--b_padding, 1rem)}}.b_grid-container{display:grid;grid-template-columns:1fr repeat(12,var(--b_col-width)) 1fr!important}.col-span-12{grid-column:span 12 / span 12}.col-span-6{grid-column:span 6 / span 6}.col-span-7{grid-column:span 7 / span 7}.col-start-1{grid-column-start:1}.col-start-2{grid-column-start:2}.col-start-8{grid-column-start:8}.row-start-1{grid-row-start:1}.mx-auto{margin-left:auto;margin-right:auto}.my-4{margin-top:1rem;margin-bottom:1rem}.grid{display:grid}.h-\[300px\]{height:300px}.h-\[500px\]{height:500px}.w-full{width:100%}.border{border-width:1px}.border-blue-200{--tw-border-opacity: 1;border-color:rgb(191 219 254 / var(--tw-border-opacity))}.border-red-200{--tw-border-opacity: 1;border-color:rgb(254 202 202 / var(--tw-border-opacity))}.bg-blue-200{--tw-bg-opacity: 1;background-color:rgb(191 219 254 / var(--tw-bg-opacity))}.bg-red-200{--tw-bg-opacity: 1;background-color:rgb(254 202 202 / var(--tw-bg-opacity))}.bg-yellow-200{--tw-bg-opacity: 1;background-color:rgb(254 240 138 / var(--tw-bg-opacity))}.bg-yellow-300{--tw-bg-opacity: 1;background-color:rgb(253 224 71 / var(--tw-bg-opacity))}.bg-opacity-40{--tw-bg-opacity: .4}.p-40{padding:10rem}.text-right{text-align:right}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.b_area-\[1-1-20-40\]{grid-area:1 / 1 / 20 / 40}.b_theme-bg-red-500{--theme-bg: #ef4444}.bg-b_theme{background-color:var(--theme-bg)}h1{font-size:2.25rem;line-height:2.5rem}@media (min-width: 768px){.md\:b_area-y-4{--b_area-y: 4}.md\:b_area-x-6{--b_area-x: 6}.md\:b_area-w-14{--b_area-w: 14}.md\:b_area-h-14{--b_area-h: 14}}