@bpmn-io/form-js-carbon-styles 1.11.0-alpha.0 → 1.11.0

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bpmn-io/form-js-carbon-styles",
3
- "version": "1.11.0-alpha.0",
3
+ "version": "1.11.0",
4
4
  "description": "Custom carbon styles for form-js",
5
5
  "scripts": {
6
6
  "all": "run-s test",
@@ -18,12 +18,12 @@
18
18
  "url": "https://github.com/bpmn-io"
19
19
  },
20
20
  "devDependencies": {
21
- "@bpmn-io/form-js-viewer": "^1.11.0-alpha.0",
22
- "@carbon/elements": "^11.44.0",
23
- "styled-components": "^6.1.8"
21
+ "@bpmn-io/form-js-viewer": "^1.11.0",
22
+ "@carbon/elements": "^11.53.0",
23
+ "styled-components": "^6.1.13"
24
24
  },
25
25
  "files": [
26
26
  "src"
27
27
  ],
28
- "gitHead": "05c03607877ce52cf7ea96e71b5819ea17c1a8b4"
28
+ "gitHead": "d1731fe95e832b1408564d14dc6d4a139a6a90ab"
29
29
  }
@@ -301,8 +301,7 @@ const READONLY_STYLES = css`
301
301
  }
302
302
  }
303
303
 
304
- &.fjs-checked .fjs-input[type='checkbox'],
305
- .fjs-form-field-label.fjs-checked .fjs-input[type='checkbox'] {
304
+ &.fjs-checked .fjs-input[type='checkbox'] {
306
305
  &:before {
307
306
  border: 1px solid var(--cds-icon-disabled);
308
307
  background: transparent;
@@ -418,8 +417,8 @@ const LABEL_DESCRIPTION_ERROR_STYLES = css`
418
417
  margin-bottom: var(--cds-spacing-03);
419
418
  }
420
419
 
421
- .fjs-form-field.fjs-form-field-radio .fjs-form-field-label:not(:first-of-type),
422
- .fjs-form-field.fjs-form-field-checklist .fjs-form-field-label:not(:first-of-type) {
420
+ .fjs-form-field.fjs-form-field-radio .fjs-inline-label,
421
+ .fjs-form-field.fjs-form-field-checklist .fjs-inline-label {
423
422
  margin: 0;
424
423
  margin-bottom: 0.1875rem;
425
424
  }
@@ -515,7 +514,7 @@ const CHECKBOX_STYLES = css`
515
514
  }
516
515
 
517
516
  .fjs-form-field.fjs-checked .fjs-input[type='checkbox'],
518
- .fjs-form-field .fjs-form-field-label.fjs-checked .fjs-input[type='checkbox'] {
517
+ .fjs-form-field .fjs-inline-label.fjs-checked .fjs-input[type='checkbox'] {
519
518
  &:before {
520
519
  border: none;
521
520
  border-width: 1px;
@@ -677,8 +676,7 @@ const RADIO_STYLES = css`
677
676
 
678
677
  const BUTTON_STYLES = css`
679
678
  .fjs-container {
680
- .fjs-form-field.fjs-form-field-button .fjs-button,
681
- .fjs-form-field.fjs-form-field-filepicker .fjs-button {
679
+ .fjs-form-field.fjs-form-field-button .fjs-button {
682
680
  font-size: var(--cds-body-short-01-font-size);
683
681
  font-weight: var(--cds-body-short-01-font-weight);
684
682
  line-height: var(--cds-body-short-01-line-height);
@@ -66,7 +66,7 @@
66
66
 
67
67
  // Themed icons /////////////
68
68
 
69
- .cds--g10 {
69
+ [data-carbon-theme='g10'] {
70
70
  .fjs-container {
71
71
  .fjs-form-field-number .fjs-input-group {
72
72
  .fjs-number-arrow-container {
@@ -114,7 +114,7 @@
114
114
  }
115
115
  }
116
116
 
117
- .cds--g100 {
117
+ [data-carbon-theme='g100'] {
118
118
  .fjs-container {
119
119
  .fjs-form-field-number .fjs-input-group {
120
120
  .fjs-number-arrow-container {
@@ -408,8 +408,7 @@
408
408
  }
409
409
  }
410
410
 
411
- &.fjs-checked .fjs-input[type='checkbox'],
412
- .fjs-form-field-label.fjs-checked .fjs-input[type='checkbox'] {
411
+ &.fjs-checked .fjs-input[type='checkbox'] {
413
412
  &:before {
414
413
  border: 1px solid var(--cds-icon-disabled);
415
414
  background: transparent;
@@ -535,13 +534,13 @@
535
534
  margin-bottom: var(--cds-spacing-03);
536
535
  }
537
536
 
538
- .fjs-form-field.fjs-form-field-radio .fjs-form-field-label:not(:first-of-type),
539
- .fjs-form-field.fjs-form-field-checklist .fjs-form-field-label:not(:first-of-type) {
537
+ .fjs-form-field.fjs-form-field-radio .fjs-inline-label,
538
+ .fjs-form-field.fjs-form-field-checklist .fjs-inline-label {
540
539
  margin: 0;
541
540
  margin-bottom: 0.1875rem;
542
541
  }
543
542
 
544
- .fjs-form-field.fjs-form-field-radio .fjs-form-field-label:not(:first-of-type) {
543
+ .fjs-form-field.fjs-form-field-radio .fjs-inline-label {
545
544
  min-height: #{rem(27)};
546
545
  }
547
546
 
@@ -632,7 +631,7 @@
632
631
  }
633
632
 
634
633
  .fjs-form-field.fjs-checked .fjs-input[type='checkbox'],
635
- .fjs-form-field .fjs-form-field-label.fjs-checked .fjs-input[type='checkbox'] {
634
+ .fjs-form-field .fjs-inline-label.fjs-checked .fjs-input[type='checkbox'] {
636
635
  &:before {
637
636
  border: none;
638
637
  border-width: 1px;
@@ -796,8 +795,7 @@
796
795
  // Button styles /////////////
797
796
 
798
797
  .fjs-container {
799
- .fjs-form-field.fjs-form-field-button .fjs-button,
800
- .fjs-form-field.fjs-form-field-filepicker .fjs-button {
798
+ .fjs-form-field.fjs-form-field-button .fjs-button {
801
799
  font-size: var(--cds-body-short-01-font-size);
802
800
  font-weight: var(--cds-body-short-01-font-weight);
803
801
  line-height: var(--cds-body-short-01-line-height);
@@ -1270,7 +1268,7 @@
1270
1268
  }
1271
1269
 
1272
1270
  .fjs-table-th {
1273
- color: var(--cds-color-primary);
1271
+ color: var(--cds-text-primary);
1274
1272
  font-size: var(--cds-heading-compact-01-font-size);
1275
1273
  font-weight: var(--cds-heading-compact-01-font-weight);
1276
1274
  line-height: var(--cds-heading-compact-01-line-height);