@dataloop-ai/components 0.19.222 → 0.19.224

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 (3) hide show
  1. package/package.json +2 -2
  2. package/src/assets/globals.scss +22 -6
  3. package/src/demos/DlTableDemo.vue +7 -15
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dataloop-ai/components",
3
- "version": "0.19.222",
3
+ "version": "0.19.224",
4
4
  "exports": {
5
5
  ".": "./index.ts",
6
6
  "./models": "./models.ts",
@@ -22,7 +22,7 @@
22
22
  "check-only": "if grep -E -H -r --exclude-dir=.git --exclude-dir=node_modules --exclude=*.json --exclude=*.yml '^(describe|it).only' .; then echo 'Found only in test files' && exit 1; fi"
23
23
  },
24
24
  "dependencies": {
25
- "@dataloop-ai/icons": "^3.0.44",
25
+ "@dataloop-ai/icons": "^3.0.46",
26
26
  "@types/flat": "^5.0.2",
27
27
  "@types/lodash": "^4.14.184",
28
28
  "@types/sortablejs": "^1.15.7",
package/src/assets/globals.scss CHANGED
@@ -73,19 +73,35 @@ body {
73
73
 
74
74
  .scroll {
75
75
  overflow: auto;
76
- scrollbar-color: transparent transparent; /* For Firefox */
77
76
  }
78
77
 
79
78
  .scroll::-webkit-scrollbar-thumb {
80
- background-color: transparent;
79
+ background-color: var(--dl-color-lighter);
81
80
  }
82
81
 
83
- .scroll:hover {
84
- scrollbar-color: var(--dl-color-lighter);
82
+ @supports (-moz-appearance: none) {
83
+ .scroll {
84
+ scrollbar-color: var(--dl-color-lighter) transparent;
85
+ }
85
86
  }
86
87
 
87
- .scroll:hover::-webkit-scrollbar-thumb {
88
- background-color: var(--dl-color-lighter);
88
+ .reactive-scroll {
89
+ .scroll {
90
+ overflow: auto;
91
+ scrollbar-color: transparent transparent; /* For Firefox */
92
+ }
93
+
94
+ .scroll::-webkit-scrollbar-thumb {
95
+ background-color: transparent;
96
+ }
97
+
98
+ .scroll:hover {
99
+ scrollbar-color: var(--dl-color-lighter);
100
+ }
101
+
102
+ .scroll:hover::-webkit-scrollbar-thumb {
103
+ background-color: var(--dl-color-lighter);
104
+ }
89
105
  }
90
106
 
91
107
  .scroll,
package/src/demos/DlTableDemo.vue CHANGED
@@ -57,10 +57,7 @@
57
57
  </div>
58
58
 
59
59
  <div class="right-panel">
60
- <button
61
- class="btn"
62
- @click="addRowPerPage"
63
- >
60
+ <button class="btn" @click="addRowPerPage">
64
61
  Add Rows/Page
65
62
  </button>
66
63
 
@@ -253,7 +250,7 @@
253
250
  <img
254
251
  src="https://popcat.click/twitter-card.jpg"
255
252
  style="width: 150px; height: 150px"
256
- >
253
+ />
257
254
  </div>
258
255
  </template>
259
256
  </DlTable>
@@ -429,6 +426,7 @@
429
426
  :selection="selection"
430
427
  :dense="dense"
431
428
  title="Treats"
429
+ class="reactive-scroll"
432
430
  color="dl-color-secondary"
433
431
  :loading="infiniteLoading"
434
432
  :rows="computedRows"
@@ -513,10 +511,7 @@
513
511
  <div>
514
512
  <p>Test reactive cells</p>
515
513
  first row:
516
- <div
517
- class="row"
518
- style="width: 100%; margin-bottom: 60px"
519
- >
514
+ <div class="row" style="width: 100%; margin-bottom: 60px">
520
515
  <dl-input
521
516
  v-for="(value, key) in tableRows[0]"
522
517
  :key="key"
@@ -635,14 +630,11 @@
635
630
  <template #body-cell-carbs="{ row }">
636
631
  <div class="row">
637
632
  {{ row.carbs }}
638
- <dl-avatar
639
- tooltip="popcat@gmail.com"
640
- size="15px"
641
- >
633
+ <dl-avatar tooltip="popcat@gmail.com" size="15px">
642
634
  <img
643
635
  src="https://popcat.click/twitter-card.jpg"
644
636
  style="width: 15px; height: 15px"
645
- >
637
+ />
646
638
  </dl-avatar>
647
639
  </div>
648
640
  </template>
@@ -672,7 +664,7 @@
672
664
  <img
673
665
  src="https://popcat.click/twitter-card.jpg"
674
666
  style="width: 150px; height: 150px"
675
- >
667
+ />
676
668
  </div>
677
669
  </template>
678
670
  </DlTable>