@itwin/itwinui-css 0.49.0 → 0.51.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.
Files changed (63) hide show
  1. package/css/alert.css +232 -174
  2. package/css/all.css +7251 -5567
  3. package/css/badge.css +2 -1
  4. package/css/blockquote.css +10 -7
  5. package/css/breadcrumbs.css +110 -87
  6. package/css/button.css +443 -315
  7. package/css/carousel.css +125 -78
  8. package/css/code.css +69 -56
  9. package/css/color-picker.css +150 -103
  10. package/css/date-picker.css +73 -55
  11. package/css/expandable-block.css +212 -160
  12. package/css/fieldset.css +22 -18
  13. package/css/file-upload.css +93 -79
  14. package/css/footer.css +64 -53
  15. package/css/global.css +100 -78
  16. package/css/header.css +471 -364
  17. package/css/icon.css +108 -78
  18. package/css/information-panel.css +174 -137
  19. package/css/inputs.css +1134 -942
  20. package/css/keyboard.css +11 -7
  21. package/css/location-marker.css +68 -58
  22. package/css/menu.css +105 -80
  23. package/css/modal.css +54 -42
  24. package/css/non-ideal-state.css +47 -40
  25. package/css/notification-marker.css +275 -200
  26. package/css/popover.css +10 -8
  27. package/css/progress-indicator.css +315 -237
  28. package/css/reset-global-styles.css +10 -5
  29. package/css/side-navigation.css +189 -140
  30. package/css/skip-to-content.css +41 -27
  31. package/css/slider.css +112 -87
  32. package/css/table.css +563 -419
  33. package/css/tabs.css +324 -238
  34. package/css/tag.css +111 -84
  35. package/css/text.css +46 -27
  36. package/css/tile.css +387 -311
  37. package/css/time-picker.css +113 -86
  38. package/css/toast-notification.css +232 -173
  39. package/css/toggle-switch.css +176 -111
  40. package/css/tooltip.css +21 -16
  41. package/css/tree.css +123 -93
  42. package/css/user-icon.css +204 -162
  43. package/css/wizard.css +156 -131
  44. package/package.json +5 -6
  45. package/scss/alert/alert.scss +1 -5
  46. package/scss/button/button-group.scss +38 -8
  47. package/scss/button/classes.scss +4 -0
  48. package/scss/carousel/carousel.scss +17 -6
  49. package/scss/code/codeblock.scss +1 -1
  50. package/scss/inputs/checkbox.scss +1 -0
  51. package/scss/inputs/labeled-inputs.scss +8 -8
  52. package/scss/inputs/radio.scss +0 -4
  53. package/scss/location-marker/data-rich.scss +1 -1
  54. package/scss/location-marker/me.scss +4 -4
  55. package/scss/modal/modal.scss +1 -0
  56. package/scss/popover/popover.scss +1 -2
  57. package/scss/progress-indicator/linear.scss +2 -10
  58. package/scss/style/global.scss +1 -5
  59. package/scss/style/mixins.scss +9 -0
  60. package/scss/table/table.scss +23 -14
  61. package/scss/toast-notification/categories.scss +1 -5
  62. package/scss/toggle-switch/classes.scss +4 -0
  63. package/scss/toggle-switch/toggle-switch.scss +141 -162
package/css/icon.css CHANGED
@@ -7,111 +7,141 @@
7
7
  fill:var(--iui-icons-color);
8
8
  display:inline-flex;
9
9
  width:16px;
10
- height:16px; }
11
- .iui-icons-default.iui-informational{
12
- fill:#008BE1;
13
- fill:var(--iui-icons-color-primary); }
14
- .iui-icons-default.iui-positive{
15
- fill:#53A21A;
16
- fill:var(--iui-icons-color-positive); }
17
- .iui-icons-default.iui-warning{
18
- fill:#F18B12;
19
- fill:var(--iui-icons-color-warning); }
20
- .iui-icons-default.iui-negative{
21
- fill:#D30A0A;
22
- fill:var(--iui-icons-color-negative); }
10
+ height:16px;
11
+ }
12
+ .iui-icons-default.iui-informational{
13
+ fill:#008BE1;
14
+ fill:var(--iui-icons-color-primary);
15
+ }
16
+ .iui-icons-default.iui-positive{
17
+ fill:#53A21A;
18
+ fill:var(--iui-icons-color-positive);
19
+ }
20
+ .iui-icons-default.iui-warning{
21
+ fill:#F18B12;
22
+ fill:var(--iui-icons-color-warning);
23
+ }
24
+ .iui-icons-default.iui-negative{
25
+ fill:#D30A0A;
26
+ fill:var(--iui-icons-color-negative);
27
+ }
23
28
 
24
29
  .iui-icons-small{
25
30
  fill:rgba(0, 0, 0, 0.4);
26
31
  fill:var(--iui-icons-color);
27
32
  display:inline-flex;
28
33
  width:12px;
29
- height:12px; }
30
- .iui-icons-small.iui-informational{
31
- fill:#008BE1;
32
- fill:var(--iui-icons-color-primary); }
33
- .iui-icons-small.iui-positive{
34
- fill:#53A21A;
35
- fill:var(--iui-icons-color-positive); }
36
- .iui-icons-small.iui-warning{
37
- fill:#F18B12;
38
- fill:var(--iui-icons-color-warning); }
39
- .iui-icons-small.iui-negative{
40
- fill:#D30A0A;
41
- fill:var(--iui-icons-color-negative); }
34
+ height:12px;
35
+ }
36
+ .iui-icons-small.iui-informational{
37
+ fill:#008BE1;
38
+ fill:var(--iui-icons-color-primary);
39
+ }
40
+ .iui-icons-small.iui-positive{
41
+ fill:#53A21A;
42
+ fill:var(--iui-icons-color-positive);
43
+ }
44
+ .iui-icons-small.iui-warning{
45
+ fill:#F18B12;
46
+ fill:var(--iui-icons-color-warning);
47
+ }
48
+ .iui-icons-small.iui-negative{
49
+ fill:#D30A0A;
50
+ fill:var(--iui-icons-color-negative);
51
+ }
42
52
 
43
53
  .iui-icons-large{
44
54
  fill:rgba(0, 0, 0, 0.4);
45
55
  fill:var(--iui-icons-color);
46
56
  display:inline-flex;
47
57
  width:24px;
48
- height:24px; }
49
- .iui-icons-large.iui-informational{
50
- fill:#008BE1;
51
- fill:var(--iui-icons-color-primary); }
52
- .iui-icons-large.iui-positive{
53
- fill:#53A21A;
54
- fill:var(--iui-icons-color-positive); }
55
- .iui-icons-large.iui-warning{
56
- fill:#F18B12;
57
- fill:var(--iui-icons-color-warning); }
58
- .iui-icons-large.iui-negative{
59
- fill:#D30A0A;
60
- fill:var(--iui-icons-color-negative); }
58
+ height:24px;
59
+ }
60
+ .iui-icons-large.iui-informational{
61
+ fill:#008BE1;
62
+ fill:var(--iui-icons-color-primary);
63
+ }
64
+ .iui-icons-large.iui-positive{
65
+ fill:#53A21A;
66
+ fill:var(--iui-icons-color-positive);
67
+ }
68
+ .iui-icons-large.iui-warning{
69
+ fill:#F18B12;
70
+ fill:var(--iui-icons-color-warning);
71
+ }
72
+ .iui-icons-large.iui-negative{
73
+ fill:#D30A0A;
74
+ fill:var(--iui-icons-color-negative);
75
+ }
61
76
 
62
77
  .iui-icons-xl{
63
78
  fill:rgba(0, 0, 0, 0.4);
64
79
  fill:var(--iui-icons-color);
65
80
  display:inline-flex;
66
81
  width:32px;
67
- height:32px; }
68
- .iui-icons-xl.iui-informational{
69
- fill:#008BE1;
70
- fill:var(--iui-icons-color-primary); }
71
- .iui-icons-xl.iui-positive{
72
- fill:#53A21A;
73
- fill:var(--iui-icons-color-positive); }
74
- .iui-icons-xl.iui-warning{
75
- fill:#F18B12;
76
- fill:var(--iui-icons-color-warning); }
77
- .iui-icons-xl.iui-negative{
78
- fill:#D30A0A;
79
- fill:var(--iui-icons-color-negative); }
82
+ height:32px;
83
+ }
84
+ .iui-icons-xl.iui-informational{
85
+ fill:#008BE1;
86
+ fill:var(--iui-icons-color-primary);
87
+ }
88
+ .iui-icons-xl.iui-positive{
89
+ fill:#53A21A;
90
+ fill:var(--iui-icons-color-positive);
91
+ }
92
+ .iui-icons-xl.iui-warning{
93
+ fill:#F18B12;
94
+ fill:var(--iui-icons-color-warning);
95
+ }
96
+ .iui-icons-xl.iui-negative{
97
+ fill:#D30A0A;
98
+ fill:var(--iui-icons-color-negative);
99
+ }
80
100
 
81
101
  .iui-icons-xxl{
82
102
  fill:rgba(0, 0, 0, 0.4);
83
103
  fill:var(--iui-icons-color);
84
104
  display:inline-flex;
85
105
  width:48px;
86
- height:48px; }
87
- .iui-icons-xxl.iui-informational{
88
- fill:#008BE1;
89
- fill:var(--iui-icons-color-primary); }
90
- .iui-icons-xxl.iui-positive{
91
- fill:#53A21A;
92
- fill:var(--iui-icons-color-positive); }
93
- .iui-icons-xxl.iui-warning{
94
- fill:#F18B12;
95
- fill:var(--iui-icons-color-warning); }
96
- .iui-icons-xxl.iui-negative{
97
- fill:#D30A0A;
98
- fill:var(--iui-icons-color-negative); }
106
+ height:48px;
107
+ }
108
+ .iui-icons-xxl.iui-informational{
109
+ fill:#008BE1;
110
+ fill:var(--iui-icons-color-primary);
111
+ }
112
+ .iui-icons-xxl.iui-positive{
113
+ fill:#53A21A;
114
+ fill:var(--iui-icons-color-positive);
115
+ }
116
+ .iui-icons-xxl.iui-warning{
117
+ fill:#F18B12;
118
+ fill:var(--iui-icons-color-warning);
119
+ }
120
+ .iui-icons-xxl.iui-negative{
121
+ fill:#D30A0A;
122
+ fill:var(--iui-icons-color-negative);
123
+ }
99
124
 
100
125
  .iui-icons-3xl{
101
126
  fill:rgba(0, 0, 0, 0.4);
102
127
  fill:var(--iui-icons-color);
103
128
  display:inline-flex;
104
129
  width:64px;
105
- height:64px; }
106
- .iui-icons-3xl.iui-informational{
107
- fill:#008BE1;
108
- fill:var(--iui-icons-color-primary); }
109
- .iui-icons-3xl.iui-positive{
110
- fill:#53A21A;
111
- fill:var(--iui-icons-color-positive); }
112
- .iui-icons-3xl.iui-warning{
113
- fill:#F18B12;
114
- fill:var(--iui-icons-color-warning); }
115
- .iui-icons-3xl.iui-negative{
116
- fill:#D30A0A;
117
- fill:var(--iui-icons-color-negative); }
130
+ height:64px;
131
+ }
132
+ .iui-icons-3xl.iui-informational{
133
+ fill:#008BE1;
134
+ fill:var(--iui-icons-color-primary);
135
+ }
136
+ .iui-icons-3xl.iui-positive{
137
+ fill:#53A21A;
138
+ fill:var(--iui-icons-color-positive);
139
+ }
140
+ .iui-icons-3xl.iui-warning{
141
+ fill:#F18B12;
142
+ fill:var(--iui-icons-color-warning);
143
+ }
144
+ .iui-icons-3xl.iui-negative{
145
+ fill:#D30A0A;
146
+ fill:var(--iui-icons-color-negative);
147
+ }
package/css/information-panel.css CHANGED
@@ -4,7 +4,8 @@
4
4
  *--------------------------------------------------------------------------------------------*/
5
5
  .iui-information-panel-wrapper{
6
6
  position:relative;
7
- overflow:hidden; }
7
+ overflow:hidden;
8
+ }
8
9
 
9
10
  .iui-information-panel{
10
11
  position:absolute;
@@ -16,142 +17,178 @@
16
17
  max-height:100%;
17
18
  z-index:2;
18
19
  background-color:#FFF;
19
- background-color:var(--iui-color-background-1); }
20
- @media (prefers-reduced-motion: no-preference){
21
- .iui-information-panel{
22
- transition:transform 0.2s ease-out, opacity 0.2s ease; } }
23
- .iui-information-panel > .iui-resizer{
24
- display:none;
25
- position:absolute;
26
- touch-action:none; }
27
- .iui-information-panel > .iui-resizer > .iui-resizer-bar{
28
- background-color:#C7CCD1;
29
- background-color:var(--iui-color-background-5); }
30
- .iui-information-panel > .iui-resizer:hover > .iui-resizer-bar{
31
- background-color:#008BE1;
32
- background-color:var(--iui-color-foreground-primary); }
33
- .iui-information-panel .iui-information-header,
34
- .iui-information-panel .iui-information-body{
35
- padding-left:12px;
36
- padding-right:12px;
37
- box-sizing:border-box; }
38
- .iui-information-panel .iui-information-header{
39
- height:55px;
40
- flex-shrink:0;
41
- display:flex;
42
- align-items:center;
43
- justify-content:space-between;
44
- background-color:#EEF0F3;
45
- background-color:var(--iui-color-background-3); }
46
- .iui-information-panel .iui-information-header .iui-information-header-label{
47
- display:flex;
48
- align-items:center;
49
- overflow:hidden; }
50
- .iui-information-panel .iui-information-header .iui-information-header-label > *{
51
- white-space:nowrap;
52
- overflow:hidden;
53
- text-overflow:ellipsis;
54
- -webkit-user-select:all;
55
- -moz-user-select:all;
56
- user-select:all; }
57
- .iui-information-panel .iui-information-header .iui-information-header-label svg{
58
- display:flex;
59
- width:24px;
60
- height:24px;
61
- margin-right:8px;
62
- flex-shrink:0;
63
- fill:rgba(0, 0, 0, 0.4);
64
- fill:var(--iui-icons-color); }
65
- .iui-information-panel .iui-information-header .iui-information-header-actions{
66
- flex-shrink:0;
67
- margin-left:8px; }
68
- .iui-information-panel .iui-information-body{
69
- padding-top:11px;
70
- padding-bottom:11px;
71
- height:100%;
72
- overflow-x:hidden;
73
- overflow-y:auto;
74
- overflow-y:overlay; }
75
- .iui-information-panel .iui-information-body > hr{
76
- border-color:#DCE0E3;
77
- border-color:var(--iui-color-background-4); }
78
- .iui-information-panel.iui-right{
79
- top:0;
80
- right:0;
81
- width:384px;
82
- min-width:192px;
83
- height:100%;
84
- transform:translateX(100%);
85
- box-shadow:-1px 0 14px rgba(0, 0, 0, 0.25);
86
- -webkit-clip-path:inset(0 0 0 -15px);
87
- clip-path:inset(0 0 0 -15px); }
88
- .iui-information-panel.iui-right > .iui-resizer{
89
- height:100%;
90
- width:16px;
91
- top:0;
92
- cursor:ew-resize;
93
- justify-content:center; }
94
- .iui-information-panel.iui-right > .iui-resizer > .iui-resizer-bar{
95
- height:100%;
96
- width:1px; }
97
- @media (prefers-reduced-motion: no-preference){
98
- .iui-information-panel.iui-right > .iui-resizer > .iui-resizer-bar{
99
- transition:background-color 0.2s ease-out, width 0.2s ease-out; } }
100
- .iui-information-panel.iui-right > .iui-resizer:hover > .iui-resizer-bar{
101
- width:4px; }
102
- .iui-information-panel.iui-right > .iui-resizer{
103
- left:-8px; }
104
- .iui-information-panel.iui-bottom{
105
- left:0;
106
- bottom:0;
107
- height:384px;
108
- min-height:192px;
109
- width:100%;
110
- transform:translateY(100%);
111
- box-shadow:0 -1px 14px rgba(0, 0, 0, 0.25);
112
- -webkit-clip-path:inset(-15px 0 0 0);
113
- clip-path:inset(-15px 0 0 0); }
114
- .iui-information-panel.iui-bottom > .iui-resizer{
115
- width:100%;
116
- height:16px;
117
- left:0;
118
- cursor:ns-resize;
119
- align-items:center; }
120
- .iui-information-panel.iui-bottom > .iui-resizer > .iui-resizer-bar{
121
- width:100%;
122
- height:1px; }
123
- @media (prefers-reduced-motion: no-preference){
124
- .iui-information-panel.iui-bottom > .iui-resizer > .iui-resizer-bar{
125
- transition:background-color 0.2s ease-out, height 0.2s ease-out; } }
126
- .iui-information-panel.iui-bottom > .iui-resizer:hover > .iui-resizer-bar{
127
- height:4px; }
128
- .iui-information-panel.iui-bottom > .iui-resizer{
129
- top:-8px; }
130
- .iui-information-panel.iui-visible{
131
- opacity:1;
132
- transform:translate(0); }
133
- .iui-information-panel.iui-visible > .iui-resizer{
134
- display:flex; }
20
+ background-color:var(--iui-color-background-1);
21
+ }
22
+ @media (prefers-reduced-motion: no-preference){
23
+ .iui-information-panel{
24
+ transition:transform 0.2s ease-out, opacity 0.2s ease;
25
+ }
26
+ }
27
+ .iui-information-panel > .iui-resizer{
28
+ display:none;
29
+ position:absolute;
30
+ touch-action:none;
31
+ }
32
+ .iui-information-panel > .iui-resizer > .iui-resizer-bar{
33
+ background-color:#C7CCD1;
34
+ background-color:var(--iui-color-background-5);
35
+ }
36
+ .iui-information-panel > .iui-resizer:hover > .iui-resizer-bar{
37
+ background-color:#008BE1;
38
+ background-color:var(--iui-color-foreground-primary);
39
+ }
40
+ .iui-information-panel .iui-information-header,
41
+ .iui-information-panel .iui-information-body{
42
+ padding-left:12px;
43
+ padding-right:12px;
44
+ box-sizing:border-box;
45
+ }
46
+ .iui-information-panel .iui-information-header{
47
+ height:55px;
48
+ flex-shrink:0;
49
+ display:flex;
50
+ align-items:center;
51
+ justify-content:space-between;
52
+ background-color:#EEF0F3;
53
+ background-color:var(--iui-color-background-3);
54
+ }
55
+ .iui-information-panel .iui-information-header .iui-information-header-label{
56
+ display:flex;
57
+ align-items:center;
58
+ overflow:hidden;
59
+ }
60
+ .iui-information-panel .iui-information-header .iui-information-header-label > *{
61
+ white-space:nowrap;
62
+ overflow:hidden;
63
+ text-overflow:ellipsis;
64
+ -webkit-user-select:all;
65
+ -moz-user-select:all;
66
+ user-select:all;
67
+ }
68
+ .iui-information-panel .iui-information-header .iui-information-header-label svg{
69
+ display:flex;
70
+ width:24px;
71
+ height:24px;
72
+ margin-right:8px;
73
+ flex-shrink:0;
74
+ fill:rgba(0, 0, 0, 0.4);
75
+ fill:var(--iui-icons-color);
76
+ }
77
+ .iui-information-panel .iui-information-header .iui-information-header-actions{
78
+ flex-shrink:0;
79
+ margin-left:8px;
80
+ }
81
+ .iui-information-panel .iui-information-body{
82
+ padding-top:11px;
83
+ padding-bottom:11px;
84
+ height:100%;
85
+ overflow-x:hidden;
86
+ overflow-y:auto;
87
+ overflow-y:overlay;
88
+ }
89
+ .iui-information-panel .iui-information-body > hr{
90
+ border-color:#DCE0E3;
91
+ border-color:var(--iui-color-background-4);
92
+ }
93
+ .iui-information-panel.iui-right{
94
+ top:0;
95
+ right:0;
96
+ width:384px;
97
+ min-width:192px;
98
+ height:100%;
99
+ transform:translateX(100%);
100
+ box-shadow:-1px 0 14px rgba(0, 0, 0, 0.25);
101
+ -webkit-clip-path:inset(0 0 0 -15px);
102
+ clip-path:inset(0 0 0 -15px);
103
+ }
104
+ .iui-information-panel.iui-right > .iui-resizer{
105
+ height:100%;
106
+ width:16px;
107
+ top:0;
108
+ cursor:ew-resize;
109
+ justify-content:center;
110
+ }
111
+ .iui-information-panel.iui-right > .iui-resizer > .iui-resizer-bar{
112
+ height:100%;
113
+ width:1px;
114
+ }
115
+ @media (prefers-reduced-motion: no-preference){
116
+ .iui-information-panel.iui-right > .iui-resizer > .iui-resizer-bar{
117
+ transition:background-color 0.2s ease-out, width 0.2s ease-out;
118
+ }
119
+ }
120
+ .iui-information-panel.iui-right > .iui-resizer:hover > .iui-resizer-bar{
121
+ width:4px;
122
+ }
123
+ .iui-information-panel.iui-right > .iui-resizer{
124
+ left:-8px;
125
+ }
126
+ .iui-information-panel.iui-bottom{
127
+ left:0;
128
+ bottom:0;
129
+ height:384px;
130
+ min-height:192px;
131
+ width:100%;
132
+ transform:translateY(100%);
133
+ box-shadow:0 -1px 14px rgba(0, 0, 0, 0.25);
134
+ -webkit-clip-path:inset(-15px 0 0 0);
135
+ clip-path:inset(-15px 0 0 0);
136
+ }
137
+ .iui-information-panel.iui-bottom > .iui-resizer{
138
+ width:100%;
139
+ height:16px;
140
+ left:0;
141
+ cursor:ns-resize;
142
+ align-items:center;
143
+ }
144
+ .iui-information-panel.iui-bottom > .iui-resizer > .iui-resizer-bar{
145
+ width:100%;
146
+ height:1px;
147
+ }
148
+ @media (prefers-reduced-motion: no-preference){
149
+ .iui-information-panel.iui-bottom > .iui-resizer > .iui-resizer-bar{
150
+ transition:background-color 0.2s ease-out, height 0.2s ease-out;
151
+ }
152
+ }
153
+ .iui-information-panel.iui-bottom > .iui-resizer:hover > .iui-resizer-bar{
154
+ height:4px;
155
+ }
156
+ .iui-information-panel.iui-bottom > .iui-resizer{
157
+ top:-8px;
158
+ }
159
+ .iui-information-panel.iui-visible{
160
+ opacity:1;
161
+ transform:translate(0);
162
+ }
163
+ .iui-information-panel.iui-visible > .iui-resizer{
164
+ display:flex;
165
+ }
135
166
 
136
167
  .iui-information-body-content{
137
168
  display:-ms-grid;
138
- display:grid; }
139
- .iui-information-body-content .iui-input-label{
140
- font-weight:400;
141
- color:rgba(0, 0, 0, 0.4);
142
- color:var(--iui-text-color-muted); }
143
- .iui-information-body-content:not(.iui-inline) > *:nth-child(even):not(:last-child){
144
- margin-bottom:11px; }
145
- .iui-information-body-content.iui-inline{
146
- row-gap:11px;
147
- -ms-grid-columns:auto 1fr;
148
- grid-template-columns:auto 1fr;
149
- align-items:center; }
150
- .iui-information-body-content.iui-inline .iui-input-label{
151
- margin:0 16px 0 0;
152
- -ms-grid-column-span:1;
153
- -ms-grid-column-align:end;
154
- justify-self:end;
155
- text-align:end; }
156
- .iui-information-body-content.iui-inline .iui-input-label.iui-required{
157
- margin-right:6px; }
169
+ display:grid;
170
+ }
171
+ .iui-information-body-content .iui-input-label{
172
+ font-weight:400;
173
+ color:rgba(0, 0, 0, 0.4);
174
+ color:var(--iui-text-color-muted);
175
+ }
176
+ .iui-information-body-content:not(.iui-inline) > *:nth-child(even):not(:last-child){
177
+ margin-bottom:11px;
178
+ }
179
+ .iui-information-body-content.iui-inline{
180
+ row-gap:11px;
181
+ -ms-grid-columns:auto 1fr;
182
+ grid-template-columns:auto 1fr;
183
+ align-items:center;
184
+ }
185
+ .iui-information-body-content.iui-inline .iui-input-label{
186
+ margin:0 16px 0 0;
187
+ -ms-grid-column-span:1;
188
+ -ms-grid-column-align:end;
189
+ justify-self:end;
190
+ text-align:end;
191
+ }
192
+ .iui-information-body-content.iui-inline .iui-input-label.iui-required{
193
+ margin-right:6px;
194
+ }