@linzjs/lui 17.36.3 → 17.36.4

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/CHANGELOG.md CHANGED
@@ -1,3 +1,10 @@
1
+ ## [17.36.4](https://github.com/linz/lui/compare/v17.36.3...v17.36.4) (2023-02-22)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * Reference to pre-defined lui colors and shadows where applicable ([#862](https://github.com/linz/lui/issues/862)) ([38c7d3d](https://github.com/linz/lui/commit/38c7d3d2a1bcdb86f789b41358f6a6e81c3c299d))
7
+
1
8
  ## [17.36.3](https://github.com/linz/lui/compare/v17.36.2...v17.36.3) (2023-02-20)
2
9
 
3
10
 
package/dist/index.js CHANGED
@@ -12879,7 +12879,7 @@ function styleInject(css, ref) {
12879
12879
  }
12880
12880
  }
12881
12881
 
12882
- var css_248z$a = ".LuiFloatingWindow-buttons {\n display: flex;\n align-items: center;\n}\n\n.LuiFloatingWindow-extra-buttons-divider {\n margin-right: 4px;\n margin-left: 8px;\n margin-top: -6px;\n font-size: x-large;\n opacity: 0.7;\n}\n\n.FloatingWindow-window {\n box-shadow: 0 0 10px #0071981a;\n position: absolute;\n background-color: #fff;\n top: 10%;\n left: 5%;\n display: flex;\n flex-direction: column;\n border-radius: 9px;\n}\n\n.FloatingWindow-container {\n display: flex;\n height: calc(100% - 50px);\n width: 100%;\n overflow: auto;\n}\n\n.FloatingWindow-header-element {\n flex: 0;\n}\n\n.FloatingWindow-header {\n height: 48px;\n line-height: 48px;\n color: #6b6966;\n padding: 0 8px;\n display: flex;\n overflow: hidden;\n justify-content: space-between;\n border-bottom: 2px #eaeaea solid;\n font-size: 1em;\n font-weight: 600;\n}\n\n.FloatingWindow-header-title-text {\n font-size: 1em;\n font-weight: 600;\n overflow: hidden;\n}\n\n.FloatingWindow-buttons {\n display: flex;\n align-items: center;\n}\n\n.FloatingWindow-extra-buttons-divider {\n margin-right: 4px;\n margin-left: 8px;\n margin-top: -6px;\n font-size: x-large;\n opacity: 0.7;\n}\n\n.FloatingWindowHeaderButton-button {\n padding: 0 0 0 8px;\n border: none;\n outline: none;\n border-radius: 50%;\n background-color: transparent;\n color: #000;\n display: flex;\n}\n\n.FloatingWindowHeaderButton-icon {\n fill: #6b6966;\n}\n\n.floating-window-icon {\n display: inline-block;\n height: 24px;\n max-height: 24px;\n max-width: 24px;\n width: 24px;\n fill: #6b6966;\n}";
12882
+ var css_248z$a = ".LuiFloatingWindow-buttons {\n display: flex;\n align-items: center;\n}\n\n.LuiFloatingWindow-extra-buttons-divider {\n margin-right: 4px;\n margin-left: 8px;\n margin-top: -6px;\n font-size: x-large;\n opacity: 0.7;\n}\n\n.FloatingWindow-window {\n box-shadow: 0px 1px 6px 0px #00000026, 0px 6px 10px 0px #00000040;\n position: absolute;\n background-color: #ffffff;\n top: 10%;\n left: 5%;\n display: flex;\n flex-direction: column;\n border-radius: 9px;\n}\n\n.FloatingWindow-container {\n display: flex;\n height: calc(100% - 50px);\n width: 100%;\n overflow: auto;\n}\n\n.FloatingWindow-header-element {\n flex: 0;\n}\n\n.FloatingWindow-header {\n height: 48px;\n line-height: 48px;\n color: #6b6966;\n padding: 0 8px;\n display: flex;\n overflow: hidden;\n justify-content: space-between;\n border-bottom: 2px #eaeaea solid;\n font-size: 1em;\n font-weight: 600;\n}\n\n.FloatingWindow-header-title-text {\n font-size: 1em;\n font-weight: 600;\n overflow: hidden;\n}\n\n.FloatingWindow-buttons {\n display: flex;\n align-items: center;\n}\n\n.FloatingWindow-extra-buttons-divider {\n margin-right: 4px;\n margin-left: 8px;\n margin-top: -6px;\n font-size: x-large;\n opacity: 0.7;\n}\n\n.FloatingWindowHeaderButton-button {\n padding: 0 0 0 8px;\n border: none;\n outline: none;\n border-radius: 50%;\n background-color: transparent;\n color: #6b6966;\n display: flex;\n}\n\n.FloatingWindowHeaderButton-icon {\n fill: #6b6966;\n}\n\n.floating-window-icon {\n display: inline-block;\n height: 24px;\n max-height: 24px;\n max-width: 24px;\n width: 24px;\n fill: #6b6966;\n}";
12883
12883
  styleInject(css_248z$a);
12884
12884
 
12885
12885
  /**
package/dist/lui.esm.js CHANGED
@@ -12850,7 +12850,7 @@ function styleInject(css, ref) {
12850
12850
  }
12851
12851
  }
12852
12852
 
12853
- var css_248z$a = ".LuiFloatingWindow-buttons {\n display: flex;\n align-items: center;\n}\n\n.LuiFloatingWindow-extra-buttons-divider {\n margin-right: 4px;\n margin-left: 8px;\n margin-top: -6px;\n font-size: x-large;\n opacity: 0.7;\n}\n\n.FloatingWindow-window {\n box-shadow: 0 0 10px #0071981a;\n position: absolute;\n background-color: #fff;\n top: 10%;\n left: 5%;\n display: flex;\n flex-direction: column;\n border-radius: 9px;\n}\n\n.FloatingWindow-container {\n display: flex;\n height: calc(100% - 50px);\n width: 100%;\n overflow: auto;\n}\n\n.FloatingWindow-header-element {\n flex: 0;\n}\n\n.FloatingWindow-header {\n height: 48px;\n line-height: 48px;\n color: #6b6966;\n padding: 0 8px;\n display: flex;\n overflow: hidden;\n justify-content: space-between;\n border-bottom: 2px #eaeaea solid;\n font-size: 1em;\n font-weight: 600;\n}\n\n.FloatingWindow-header-title-text {\n font-size: 1em;\n font-weight: 600;\n overflow: hidden;\n}\n\n.FloatingWindow-buttons {\n display: flex;\n align-items: center;\n}\n\n.FloatingWindow-extra-buttons-divider {\n margin-right: 4px;\n margin-left: 8px;\n margin-top: -6px;\n font-size: x-large;\n opacity: 0.7;\n}\n\n.FloatingWindowHeaderButton-button {\n padding: 0 0 0 8px;\n border: none;\n outline: none;\n border-radius: 50%;\n background-color: transparent;\n color: #000;\n display: flex;\n}\n\n.FloatingWindowHeaderButton-icon {\n fill: #6b6966;\n}\n\n.floating-window-icon {\n display: inline-block;\n height: 24px;\n max-height: 24px;\n max-width: 24px;\n width: 24px;\n fill: #6b6966;\n}";
12853
+ var css_248z$a = ".LuiFloatingWindow-buttons {\n display: flex;\n align-items: center;\n}\n\n.LuiFloatingWindow-extra-buttons-divider {\n margin-right: 4px;\n margin-left: 8px;\n margin-top: -6px;\n font-size: x-large;\n opacity: 0.7;\n}\n\n.FloatingWindow-window {\n box-shadow: 0px 1px 6px 0px #00000026, 0px 6px 10px 0px #00000040;\n position: absolute;\n background-color: #ffffff;\n top: 10%;\n left: 5%;\n display: flex;\n flex-direction: column;\n border-radius: 9px;\n}\n\n.FloatingWindow-container {\n display: flex;\n height: calc(100% - 50px);\n width: 100%;\n overflow: auto;\n}\n\n.FloatingWindow-header-element {\n flex: 0;\n}\n\n.FloatingWindow-header {\n height: 48px;\n line-height: 48px;\n color: #6b6966;\n padding: 0 8px;\n display: flex;\n overflow: hidden;\n justify-content: space-between;\n border-bottom: 2px #eaeaea solid;\n font-size: 1em;\n font-weight: 600;\n}\n\n.FloatingWindow-header-title-text {\n font-size: 1em;\n font-weight: 600;\n overflow: hidden;\n}\n\n.FloatingWindow-buttons {\n display: flex;\n align-items: center;\n}\n\n.FloatingWindow-extra-buttons-divider {\n margin-right: 4px;\n margin-left: 8px;\n margin-top: -6px;\n font-size: x-large;\n opacity: 0.7;\n}\n\n.FloatingWindowHeaderButton-button {\n padding: 0 0 0 8px;\n border: none;\n outline: none;\n border-radius: 50%;\n background-color: transparent;\n color: #6b6966;\n display: flex;\n}\n\n.FloatingWindowHeaderButton-icon {\n fill: #6b6966;\n}\n\n.floating-window-icon {\n display: inline-block;\n height: 24px;\n max-height: 24px;\n max-width: 24px;\n width: 24px;\n fill: #6b6966;\n}";
12854
12854
  styleInject(css_248z$a);
12855
12855
 
12856
12856
  /**
@@ -1,3 +1,6 @@
1
+ @use '../../Foundation/Utilities/BoxShadow' as shadow;
2
+ @use '../../Foundation/Variables/ColorVars' as colors;
3
+
1
4
  .LuiFloatingWindow-buttons {
2
5
  display: flex;
3
6
  align-items: center;
@@ -11,4 +14,79 @@
11
14
  opacity: 0.7;
12
15
  }
13
16
 
14
- .FloatingWindow-window{box-shadow:0 0 10px #0071981a;position:absolute;background-color:#fff;top:10%;left:5%;display:flex;flex-direction:column;border-radius:9px}.FloatingWindow-container{display:flex;height:calc(100% - 50px);width:100%;overflow:auto}.FloatingWindow-header-element{flex:0}.FloatingWindow-header{height:48px;line-height:48px;color:#6b6966;padding:0 8px;display:flex;overflow:hidden;justify-content:space-between;border-bottom:2px #eaeaea solid;font-size:1em;font-weight:600}.FloatingWindow-header-title-text{font-size:1em;font-weight:600;overflow:hidden}.FloatingWindow-buttons{display:flex;align-items:center}.FloatingWindow-extra-buttons-divider{margin-right:4px;margin-left:8px;margin-top:-6px;font-size:x-large;opacity:.7}.FloatingWindowHeaderButton-button{padding:0 0 0 8px;border:none;outline:none;border-radius:50%;background-color:transparent;color:#000;display:flex}.FloatingWindowHeaderButton-icon{fill:#6b6966}.floating-window-icon{display:inline-block;height:24px;max-height:24px;max-width:24px;width:24px;fill:#6b6966}
17
+ .FloatingWindow-window {
18
+ @include shadow.drop-shadow($size: 'md');
19
+ position: absolute;
20
+ background-color: colors.$white;
21
+ top: 10%;
22
+ left: 5%;
23
+ display: flex;
24
+ flex-direction: column;
25
+ border-radius: 9px;
26
+ }
27
+
28
+ .FloatingWindow-container {
29
+ display: flex;
30
+ height: calc(100% - 50px);
31
+ width: 100%;
32
+ overflow: auto;
33
+ }
34
+
35
+ .FloatingWindow-header-element {
36
+ flex: 0;
37
+ }
38
+
39
+ .FloatingWindow-header {
40
+ height: 48px;
41
+ line-height: 48px;
42
+ color: colors.$fuscous;
43
+ padding: 0 8px;
44
+ display: flex;
45
+ overflow: hidden;
46
+ justify-content: space-between;
47
+ border-bottom: 2px colors.$lily solid;
48
+ font-size: 1em;
49
+ font-weight: 600;
50
+ }
51
+
52
+ .FloatingWindow-header-title-text {
53
+ font-size: 1em;
54
+ font-weight: 600;
55
+ overflow: hidden;
56
+ }
57
+
58
+ .FloatingWindow-buttons {
59
+ display: flex;
60
+ align-items: center;
61
+ }
62
+
63
+ .FloatingWindow-extra-buttons-divider {
64
+ margin-right: 4px;
65
+ margin-left: 8px;
66
+ margin-top: -6px;
67
+ font-size: x-large;
68
+ opacity: 0.7;
69
+ }
70
+
71
+ .FloatingWindowHeaderButton-button {
72
+ padding: 0 0 0 8px;
73
+ border: none;
74
+ outline: none;
75
+ border-radius: 50%;
76
+ background-color: transparent;
77
+ color: colors.$fuscous;
78
+ display: flex;
79
+ }
80
+
81
+ .FloatingWindowHeaderButton-icon {
82
+ fill: colors.$fuscous;
83
+ }
84
+
85
+ .floating-window-icon {
86
+ display: inline-block;
87
+ height: 24px;
88
+ max-height: 24px;
89
+ max-width: 24px;
90
+ width: 24px;
91
+ fill: colors.$fuscous;
92
+ }
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "17.36.3",
2
+ "version": "17.36.4",
3
3
  "license": "MIT",
4
4
  "repository": {
5
5
  "type": "git",