@brilo/base-blocks 0.1.20 → 0.1.21

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 (7) hide show
  1. package/build/.tsbuildinfo +1 -1
  2. package/build/blocks/usp/usp-item/buildPreviewStyle.d.ts.map +1 -1
  3. package/build/blocks/usp/usp-item/buildPreviewStyle.js +2 -1
  4. package/package.json +1 -1
  5. package/src/blocks/usp/usp-group/editor.scss +0 -5
  6. package/src/blocks/usp/usp-item/buildPreviewStyle.ts +3 -1
  7. package/src/blocks/usp/usp-item/editor.scss +12 -5
package/build/blocks/usp/usp-item/buildPreviewStyle.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"buildPreviewStyle.d.ts","sourceRoot":"","sources":["../../../../src/blocks/usp/usp-item/buildPreviewStyle.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,cAAc;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE;QACL,IAAI,CAAC,EAAE,MAAM,CAAA;QACb,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,UAAU,CAAC,EAAE,MAAM,CAAA;QACnB,cAAc,CAAC,EAAE,MAAM,CAAA;QACvB,eAAe,CAAC,EAAE,MAAM,CAAA;QACxB,WAAW,CAAC,EAAE,MAAM,CAAA;QACpB,WAAW,CAAC,EAAE,MAAM,CAAA;KACrB,CAAA;CACF;AAED,MAAM,WAAW,eAAe;IAC9B,aAAa,EAAE,MAAM,CAAA;IACrB,aAAa,EAAE,MAAM,CAAA;IACrB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;CAChC;AAED,wBAAgB,oBAAoB,CAAC,MAAM,CAAC,EAAE,cAAc,EAAE,UAAU,GAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAyB,GAAG,eAAe,CAsCvI"}
1
+ {"version":3,"file":"buildPreviewStyle.d.ts","sourceRoot":"","sources":["../../../../src/blocks/usp/usp-item/buildPreviewStyle.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,cAAc;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE;QACL,IAAI,CAAC,EAAE,MAAM,CAAA;QACb,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,UAAU,CAAC,EAAE,MAAM,CAAA;QACnB,cAAc,CAAC,EAAE,MAAM,CAAA;QACvB,eAAe,CAAC,EAAE,MAAM,CAAA;QACxB,WAAW,CAAC,EAAE,MAAM,CAAA;QACpB,WAAW,CAAC,EAAE,MAAM,CAAA;KACrB,CAAA;CACF;AAED,MAAM,WAAW,eAAe;IAC9B,aAAa,EAAE,MAAM,CAAA;IACrB,aAAa,EAAE,MAAM,CAAA;IACrB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;CAChC;AAED,wBAAgB,oBAAoB,CAAC,MAAM,CAAC,EAAE,cAAc,EAAE,UAAU,GAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAyB,GAAG,eAAe,CAwCvI"}
package/build/blocks/usp/usp-item/buildPreviewStyle.js CHANGED
@@ -20,8 +20,9 @@ export function buildUspPreviewStyle(shared, resolveHex = (value) => value) {
20
20
  cssVars['--icon-color'] = resolveHex(icon.color);
21
21
  if (icon.size)
22
22
  cssVars['--icon-size'] = `${icon.size}px`;
23
- if (icon.backgroundSize)
23
+ if (icon.background && icon.background !== 'none' && icon.backgroundSize) {
24
24
  cssVars['--icon-background-size'] = `${icon.backgroundSize}px`;
25
+ }
25
26
  if (icon.borderColor) {
26
27
  cssVars['--icon-outline-color'] = resolveHex(icon.borderColor);
27
28
  cssVars['--icon-outline-width'] = `${icon.borderWidth || 1}px`;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@brilo/base-blocks",
3
- "version": "0.1.20",
3
+ "version": "0.1.21",
4
4
  "author": "Brilo",
5
5
  "main": "./build/index.js",
6
6
  "types": "./build/index.d.ts",
package/src/blocks/usp/usp-group/editor.scss CHANGED
@@ -8,11 +8,6 @@
8
8
  align-items: flex-start;
9
9
  }
10
10
 
11
- &.--card .i-usp__inner {
12
- background: #fff;
13
- border-color: #d0d5dd;
14
- }
15
-
16
11
  &.--shadow-sm .i-usp__inner {
17
12
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
18
13
  }
package/src/blocks/usp/usp-item/buildPreviewStyle.ts CHANGED
@@ -56,7 +56,9 @@ export function buildUspPreviewStyle(shared?: UspSharedStyle, resolveHex: (value
56
56
  if (icon.background && icon.background !== 'none') cssVars['--icon-background-color'] = resolveHex(icon.background)
57
57
  if (icon.color && icon.color !== 'none') cssVars['--icon-color'] = resolveHex(icon.color)
58
58
  if (icon.size) cssVars['--icon-size'] = `${icon.size}px`
59
- if (icon.backgroundSize) cssVars['--icon-background-size'] = `${icon.backgroundSize}px`
59
+ if (icon.background && icon.background !== 'none' && icon.backgroundSize) {
60
+ cssVars['--icon-background-size'] = `${icon.backgroundSize}px`
61
+ }
60
62
  if (icon.borderColor) {
61
63
  cssVars['--icon-outline-color'] = resolveHex(icon.borderColor)
62
64
  cssVars['--icon-outline-width'] = `${icon.borderWidth || 1}px`
package/src/blocks/usp/usp-item/editor.scss CHANGED
@@ -3,6 +3,13 @@
3
3
  margin-inline: 0;
4
4
  text-align: var(--text-align, left);
5
5
  border-radius: 4px;
6
+ --icon-background-size: 0px;
7
+
8
+ // Background size only reserves space when a background or outline is actually selected.
9
+ &.--icon-background,
10
+ &.--icon-bordered {
11
+ --icon-background-size: 88px;
12
+ }
6
13
 
7
14
  &.--shadow {
8
15
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
@@ -59,7 +66,7 @@
59
66
  }
60
67
 
61
68
  .i-usp__icon {
62
- --icon-box-size: max(var(--icon-background-size, 88px), var(--icon-size, 88px));
69
+ --icon-box-size: max(var(--icon-background-size, 0px), var(--icon-size, 88px));
63
70
 
64
71
  width: var(--icon-box-size);
65
72
  height: var(--icon-box-size);
@@ -73,8 +80,8 @@
73
80
  &::after {
74
81
  content: "";
75
82
  grid-area: pile;
76
- width: var(--icon-background-size, 88px);
77
- height: var(--icon-background-size, 88px);
83
+ width: var(--icon-background-size, 0px);
84
+ height: var(--icon-background-size, 0px);
78
85
  border-radius: inherit;
79
86
  clip-path: var(--icon-background-shape, none);
80
87
  }
@@ -86,8 +93,8 @@
86
93
 
87
94
  &::after {
88
95
  z-index: 1;
89
- width: calc(var(--icon-background-size, 88px) - var(--icon-outline-width, 0px) * 2);
90
- height: calc(var(--icon-background-size, 88px) - var(--icon-outline-width, 0px) * 2);
96
+ width: calc(var(--icon-background-size, 0px) - var(--icon-outline-width, 0px) * 2);
97
+ height: calc(var(--icon-background-size, 0px) - var(--icon-outline-width, 0px) * 2);
91
98
  background-color: var(--icon-background-color, transparent);
92
99
  }
93
100