@startinblox/components-ds4go 3.1.3 → 3.1.5

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.
@@ -153,6 +153,9 @@ export class SolidFactBundle extends OrbitComponent {
153
153
  this.spliceLength =
154
154
  Math.floor((window.innerWidth - 800) / 354) *
155
155
  Math.floor((window.innerHeight - 255) / 500);
156
+ if (this.spliceLength < 5) {
157
+ this._showAllResults();
158
+ }
156
159
  }
157
160
 
158
161
  if (factsWithoutSelected.length > 0) {
@@ -254,7 +257,10 @@ export class SolidFactBundle extends OrbitComponent {
254
257
  offeredAccess: "40",
255
258
  pricingTier: "premium",
256
259
  "dcat:endpointUrl": newFactBundleId,
257
- previewLinks: this.selectedFacts.slice(0, 3).map(fact => fact["@id"]).join(", "),
260
+ previewLinks: this.selectedFacts
261
+ .slice(0, 3)
262
+ .map((fact) => fact["@id"])
263
+ .join(", "),
258
264
  "dsif:pricing": {
259
265
  "dsif:costPerAPICall": 0.15,
260
266
  "dsif:setupFee": 50,
@@ -424,7 +430,7 @@ export class SolidFactBundle extends OrbitComponent {
424
430
  ? html`<tems-button
425
431
  type="primary"
426
432
  disabled=${this.selectedFacts.length === 0 || nothing}
427
- label=${msg("Set bundle informations")}
433
+ label=${msg("Next")}
428
434
  @click=${this._nextStep}
429
435
  ></tems-button>`
430
436
  : html`<div class="flex">
@@ -0,0 +1,105 @@
1
+ .contract-section {
2
+ background-color: var(--color-surface-secondary);
3
+ border: var(--border-width-sm) solid var(--color-border-secondary);
4
+ border-radius: var(--border-radius-md);
5
+ padding: var(--scale-500);
6
+ margin-bottom: var(--scale-400);
7
+ display: flex;
8
+ flex-direction: column;
9
+ gap: var(--scale-400);
10
+
11
+ .contract-header {
12
+ display: flex;
13
+ flex-direction: column;
14
+ gap: var(--scale-200);
15
+ padding-bottom: var(--scale-300);
16
+ }
17
+
18
+ .contract-subsection {
19
+ display: flex;
20
+ flex-direction: column;
21
+ gap: var(--scale-300);
22
+
23
+ .collapsible-header {
24
+ display: flex;
25
+ align-items: center;
26
+ justify-content: space-between;
27
+ cursor: pointer;
28
+ user-select: none;
29
+ padding: var(--scale-300) var(--scale-400);
30
+ border-radius: var(--border-radius-sm);
31
+ background-color: var(--color-surface-primary);
32
+ border: var(--border-width-sm) solid var(--color-border-secondary);
33
+ transition: all 0.2s ease;
34
+
35
+ &:hover {
36
+ background-color: var(--color-surface-tertiary);
37
+ border-color: var(--color-border-primary);
38
+ }
39
+
40
+ .chevron {
41
+ transition: transform 0.3s ease;
42
+ font-size: 1.5rem;
43
+ color: var(--color-text-secondary);
44
+
45
+ &.expanded {
46
+ transform: rotate(180deg);
47
+ }
48
+ }
49
+ }
50
+
51
+ .collapsible-content {
52
+ max-height: 0;
53
+ overflow: hidden;
54
+ transition: max-height 0.3s ease, opacity 0.3s ease;
55
+ opacity: 0;
56
+ padding: 0 var(--scale-400);
57
+
58
+ &.expanded {
59
+ max-height: 2000px;
60
+ opacity: 1;
61
+ padding-top: var(--scale-300);
62
+ padding-bottom: var(--scale-300);
63
+ }
64
+
65
+ .assets-list {
66
+ display: flex;
67
+ flex-direction: column;
68
+ gap: var(--scale-200);
69
+
70
+ .asset-item {
71
+ background-color: var(--color-surface-primary);
72
+ border: var(--border-width-sm) solid var(--color-border-primary);
73
+ border-radius: var(--border-radius-sm);
74
+ padding: var(--scale-300);
75
+ display: flex;
76
+ flex-direction: column;
77
+ gap: var(--scale-100);
78
+ }
79
+ }
80
+
81
+ .bundle-info {
82
+ background-color: var(--color-surface-primary);
83
+ border: var(--border-width-sm) solid var(--color-border-primary);
84
+ border-radius: var(--border-radius-sm);
85
+ padding: var(--scale-300);
86
+ margin-bottom: var(--scale-300);
87
+ display: flex;
88
+ flex-direction: column;
89
+ gap: var(--scale-200);
90
+ }
91
+
92
+ .facts-list {
93
+ display: flex;
94
+ flex-direction: row;
95
+ flex-wrap: wrap;
96
+ gap: 20px;
97
+ }
98
+
99
+ .facts-list ds4go-card-catalog {
100
+ width: 354px;
101
+ height: auto;
102
+ }
103
+ }
104
+ }
105
+ }
@@ -87,5 +87,7 @@
87
87
  max-width: 80vw;
88
88
  height: fit-content;
89
89
  max-height: 80vh;
90
+ min-width: 50vw;
91
+ min-height: 50vh;
90
92
  }
91
93
  }
@@ -87,5 +87,7 @@
87
87
  max-width: 80vw;
88
88
  height: fit-content;
89
89
  max-height: 80vh;
90
+ min-width: 50vw;
91
+ min-height: 50vh;
90
92
  }
91
93
  }