@ulu/frontend 0.1.0-beta.26 → 0.1.0-beta.28

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 (15) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/dist/ulu-frontend.min.css +1 -1
  3. package/dist/ulu-frontend.min.js +2 -1
  4. package/docs-dev/changelog/index.html +52 -1
  5. package/docs-dev/demos/card/index.html +86 -48
  6. package/docs-dev/demos/data-table/index.html +25 -25
  7. package/docs-dev/demos/popovers/index.html +102 -4
  8. package/docs-dev/sass/components/card/index.html +1 -1
  9. package/docs-dev/sass/components/popover/index.html +22 -23
  10. package/docs-dev/sass/core/utils/index.html +210 -85
  11. package/js/ui/popover.js +1 -0
  12. package/package.json +1 -1
  13. package/scss/_utils.scss +34 -9
  14. package/scss/components/_popover.scss +76 -38
  15. package/types/ui/popover.d.ts.map +1 -1
package/docs-dev/sass/components/popover/index.html CHANGED
@@ -5069,6 +5069,7 @@
5069
5069
  <p>Module Settings</p>
5070
5070
  <pre class="language-scss"><code class="language-scss"><span class="pjs-token pjs-property"><span class="pjs-token pjs-variable">$config</span></span><span class="pjs-token pjs-punctuation">:</span> <span class="pjs-token pjs-punctuation">(</span>
5071
5071
  <span class="pjs-token pjs-string">"arrow-size"</span> <span class="pjs-token pjs-punctuation">:</span> 16px<span class="pjs-token pjs-punctuation">,</span>
5072
+ <span class="pjs-token pjs-string">"arrow-mask-overlap"</span> <span class="pjs-token pjs-punctuation">:</span> 4px<span class="pjs-token pjs-punctuation">,</span>
5072
5073
  <span class="pjs-token pjs-string">"background-color"</span> <span class="pjs-token pjs-punctuation">:</span> white<span class="pjs-token pjs-punctuation">,</span>
5073
5074
  <span class="pjs-token pjs-string">"border-radius"</span> <span class="pjs-token pjs-punctuation">:</span> 6px<span class="pjs-token pjs-punctuation">,</span>
5074
5075
  <span class="pjs-token pjs-string">"color"</span> <span class="pjs-token pjs-punctuation">:</span> inherit<span class="pjs-token pjs-punctuation">,</span>
@@ -5078,14 +5079,12 @@
5078
5079
  <span class="pjs-token pjs-string">"padding-large"</span> <span class="pjs-token pjs-punctuation">:</span> 2rem<span class="pjs-token pjs-punctuation">,</span>
5079
5080
  <span class="pjs-token pjs-string">"type-size"</span> <span class="pjs-token pjs-punctuation">:</span> <span class="pjs-token pjs-null pjs-keyword">null</span><span class="pjs-token pjs-punctuation">,</span>
5080
5081
  <span class="pjs-token pjs-string">"z-index"</span> <span class="pjs-token pjs-punctuation">:</span> <span class="pjs-token pjs-boolean">true</span><span class="pjs-token pjs-punctuation">,</span>
5081
-
5082
5082
  <span class="pjs-token pjs-string">"box-shadow"</span> <span class="pjs-token pjs-punctuation">:</span> <span class="pjs-token pjs-boolean">true</span><span class="pjs-token pjs-punctuation">,</span>
5083
- <span class="pjs-token pjs-string">"box-shadow-footer"</span> <span class="pjs-token pjs-punctuation">:</span> 0 0 4px<span class="pjs-token pjs-punctuation">,</span>
5084
- <span class="pjs-token pjs-string">"box-shadow-footer-color"</span> <span class="pjs-token pjs-punctuation">:</span> <span class="pjs-token pjs-string">"box-shadow"</span><span class="pjs-token pjs-punctuation">,</span>
5085
5083
  <span class="pjs-token pjs-string">"header-background-color"</span> <span class="pjs-token pjs-punctuation">:</span> #ccc<span class="pjs-token pjs-punctuation">,</span>
5086
5084
  <span class="pjs-token pjs-string">"header-color"</span> <span class="pjs-token pjs-punctuation">:</span> <span class="pjs-token pjs-null pjs-keyword">null</span><span class="pjs-token pjs-punctuation">,</span>
5087
5085
  <span class="pjs-token pjs-string">"header-media-background-color"</span><span class="pjs-token pjs-punctuation">:</span> black<span class="pjs-token pjs-punctuation">,</span>
5088
5086
  <span class="pjs-token pjs-string">"header-padding-y"</span> <span class="pjs-token pjs-punctuation">:</span> 0.25rem<span class="pjs-token pjs-punctuation">,</span>
5087
+ <span class="pjs-token pjs-string">"footer-border-top"</span> <span class="pjs-token pjs-punctuation">:</span> 1px solid #dfdfdf<span class="pjs-token pjs-punctuation">,</span>
5089
5088
  <span class="pjs-token pjs-string">"footer-background-color"</span> <span class="pjs-token pjs-punctuation">:</span> #ccc<span class="pjs-token pjs-punctuation">,</span>
5090
5089
  <span class="pjs-token pjs-string">"footer-color"</span> <span class="pjs-token pjs-punctuation">:</span> <span class="pjs-token pjs-null pjs-keyword">null</span><span class="pjs-token pjs-punctuation">,</span>
5091
5090
  <span class="pjs-token pjs-string">"footer-padding-y"</span> <span class="pjs-token pjs-punctuation">:</span> 0.25rem<span class="pjs-token pjs-punctuation">,</span>
@@ -5106,7 +5105,7 @@
5106
5105
  <li><strong>Group:</strong> popover</li>
5107
5106
  <li><strong>Type:</strong> variable</li>
5108
5107
  <li><strong>Lines (comments):</strong> 30-60</li>
5109
- <li><strong>Lines (code):</strong> 62-93</li>
5108
+ <li><strong>Lines (code):</strong> 62-92</li>
5110
5109
  </ul>
5111
5110
  </details>
5112
5111
  <h4 id="map-properties" tabindex="-1">Map Properties</h4>
@@ -5124,7 +5123,13 @@
5124
5123
  <td style="text-align:left">arrow-size</td>
5125
5124
  <td style="text-align:left">Dimension</td>
5126
5125
  <td style="text-align:left">16px</td>
5127
- <td style="text-align:left">size of the dropdown arrow.</td>
5126
+ <td style="text-align:left">Size of the dropdown arrow.</td>
5127
+ </tr>
5128
+ <tr>
5129
+ <td style="text-align:left">arrow-mask-overlap</td>
5130
+ <td style="text-align:left">Dimension</td>
5131
+ <td style="text-align:left">4px</td>
5132
+ <td style="text-align:left">Size that the mask extends beyond the arrow size (which covers up the arrow box shadow inside the popover content). This should be adjusted based on the size of the box-shadow being used)</td>
5128
5133
  </tr>
5129
5134
  <tr>
5130
5135
  <td style="text-align:left">background-color</td>
@@ -5187,18 +5192,6 @@
5187
5192
  <td style="text-align:left">Box shadow of the popover.</td>
5188
5193
  </tr>
5189
5194
  <tr>
5190
- <td style="text-align:left">box-shadow-footer</td>
5191
- <td style="text-align:left">CssValue</td>
5192
- <td style="text-align:left">0 0 4px</td>
5193
- <td style="text-align:left">Box shadow of the popover footer.</td>
5194
- </tr>
5195
- <tr>
5196
- <td style="text-align:left">box-shadow-footer-color</td>
5197
- <td style="text-align:left">String</td>
5198
- <td style="text-align:left">&quot;box-shadow&quot;</td>
5199
- <td style="text-align:left">Color of the footer's box shadow.</td>
5200
- </tr>
5201
- <tr>
5202
5195
  <td style="text-align:left">header-background-color</td>
5203
5196
  <td style="text-align:left">Color</td>
5204
5197
  <td style="text-align:left">#ccc</td>
@@ -5229,6 +5222,12 @@
5229
5222
  <td style="text-align:left">Background color of the footer.</td>
5230
5223
  </tr>
5231
5224
  <tr>
5225
+ <td style="text-align:left">footer-border-top</td>
5226
+ <td style="text-align:left">Color</td>
5227
+ <td style="text-align:left">1px solid #dfdfdf</td>
5228
+ <td style="text-align:left">Optional border used to separate the content from footer</td>
5229
+ </tr>
5230
+ <tr>
5232
5231
  <td style="text-align:left">footer-color</td>
5233
5232
  <td style="text-align:left">Color</td>
5234
5233
  <td style="text-align:left">null</td>
@@ -5310,8 +5309,8 @@
5310
5309
  <li><strong>File:</strong> _popover.scss</li>
5311
5310
  <li><strong>Group:</strong> popover</li>
5312
5311
  <li><strong>Type:</strong> mixin</li>
5313
- <li><strong>Lines (comments):</strong> 95-98</li>
5314
- <li><strong>Lines (code):</strong> 100-102</li>
5312
+ <li><strong>Lines (comments):</strong> 94-97</li>
5313
+ <li><strong>Lines (code):</strong> 99-101</li>
5315
5314
  </ul>
5316
5315
  </details>
5317
5316
  <h4 id="examples" tabindex="-1">Examples</h4>
@@ -5350,8 +5349,8 @@
5350
5349
  <li><strong>File:</strong> _popover.scss</li>
5351
5350
  <li><strong>Group:</strong> popover</li>
5352
5351
  <li><strong>Type:</strong> mixin</li>
5353
- <li><strong>Lines (comments):</strong> 114-116</li>
5354
- <li><strong>Lines (code):</strong> 118-263</li>
5352
+ <li><strong>Lines (comments):</strong> 113-115</li>
5353
+ <li><strong>Lines (code):</strong> 117-232</li>
5355
5354
  </ul>
5356
5355
  </details>
5357
5356
  <h4 id="examples-1" tabindex="-1">Examples</h4>
@@ -5374,8 +5373,8 @@
5374
5373
  <li><strong>File:</strong> _popover.scss</li>
5375
5374
  <li><strong>Group:</strong> popover</li>
5376
5375
  <li><strong>Type:</strong> function</li>
5377
- <li><strong>Lines (comments):</strong> 104-107</li>
5378
- <li><strong>Lines (code):</strong> 109-112</li>
5376
+ <li><strong>Lines (comments):</strong> 103-106</li>
5377
+ <li><strong>Lines (code):</strong> 108-111</li>
5379
5378
  </ul>
5380
5379
  </details>
5381
5380
  <h4 id="examples-2" tabindex="-1">Examples</h4>