@fullsession.io/fs-feedback-widget 1.1.5 → 1.1.7

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fullsession.io/fs-feedback-widget",
3
- "version": "1.1.5",
3
+ "version": "1.1.7",
4
4
  "scripts": {
5
5
  "build": "rollup -c",
6
6
  "dev": "rollup -c -w",
package/dist/App.css DELETED
@@ -1,273 +0,0 @@
1
- body{
2
- width: 100%;
3
- display: flex;
4
- flex-direction: var(--wgPositionVertical);
5
- position: absolute;
6
- top: 0; right: 0; bottom: 0; left: 0;
7
- background-color: #ebeef9;
8
- height: 100%;
9
- align-items: var(--wgPositionHorizintal);
10
- padding: 0;
11
- }
12
- .widget {
13
- background-color: var(--widgetColor);
14
- width: 34px;
15
- height: 112px;
16
- border-top-left-radius:var(--widgetLeftSideBorder) ;
17
- border-bottom-left-radius: var(--widgetLeftSideBorder);
18
- border-top-right-radius: var(--widgetRightSideBorder) ;
19
- border-bottom-right-radius: var(--widgetRightSideBorder);
20
- box-shadow: 0.2px 0.2px 0.2px rgb(133, 130, 130);
21
- display: flex;
22
- flex-direction: column;
23
- align-items: center;
24
- justify-content: space-evenly;
25
- cursor: pointer;
26
- margin-top: 5px;
27
- }
28
- #mainIcon {
29
- width: 60%;
30
- margin-left: 4%;
31
- cursor: pointer;
32
- }
33
- #feedbackTxt {
34
- color: var(--widgetTextColor);
35
- font-size: 13px;
36
- writing-mode: vertical-lr;
37
- transform: rotate(180deg);
38
- cursor: pointer;
39
- }
40
- .widget:hover {
41
- width: 35px;
42
- -webkit-box-shadow: 0px 0px 35px 2px rgba(0, 0, 0, 0.24);
43
- box-shadow: 0px 0px 35px 2px rgba(0, 0, 0, 0.24);
44
- }
45
- .cont {
46
- width: 320px;
47
- height: fit-content;
48
- background-color: rgb(255, 255, 255);
49
- margin-right: var(--widgetMarginRight);
50
- margin-left: var(--widgetMarginLeft);
51
- -webkit-box-shadow: rgba(0, 0, 0, 0.35) 0px 6px 100px 0px;
52
- box-shadow: rgba(0, 0, 0, 0.35) 0px 6px 100px 0px;
53
- }
54
- .thanksMessageCont{
55
- width: 320px;
56
- height: 104px;
57
- background-color: rgb(255, 255, 255);
58
- margin-right: var(--widgetMarginRight);
59
- margin-left: var(--widgetMarginLeft);
60
- -webkit-box-shadow: rgba(0, 0, 0, 0.35) 0px 6px 100px 0px;
61
- box-shadow: rgba(0, 0, 0, 0.35) 0px 6px 100px 0px;
62
- }
63
- #closeIcon{
64
- font-size: 16px;
65
- color: #ffff;
66
- font-weight: 600;
67
- font-family: system-ui;
68
- cursor: pointer;
69
-
70
- }
71
- .closeCont{
72
- background-color: #4d5167;
73
- width: 27px;
74
- height: 27px;
75
- border-radius: 50%;
76
- display: flex;
77
- justify-content: center;
78
- align-items: center;
79
- margin-top: -15px;
80
- margin-left: 85%;
81
- cursor: pointer;
82
- }
83
-
84
-
85
-
86
-
87
-
88
- @media (min-width: 640px) {
89
- body {
90
- max-width: none;
91
- }
92
- }.container {
93
- display: flex;
94
- flex-direction: column;
95
- height: 190px;
96
- }
97
- .icons {
98
- display: flex;
99
- flex-direction: row;
100
- justify-content: space-evenly;
101
- margin-top: 11%;
102
- }
103
- #txt {
104
- font-size: 17px;
105
- display: flex;
106
- text-align: center;
107
- margin-top: 5%;
108
- width: 61%;
109
- margin-left: 19%;
110
- }
111
-
112
- .iconTextCont {
113
- display: flex;
114
- flex-direction: column;
115
- align-items: center;
116
- height: 22px;
117
- }
118
-
119
- .reactionText {
120
- font-size: 9px;
121
- display: none;
122
- }
123
- .iconTextCont:hover{
124
- cursor: pointer;
125
- }
126
- .reactionIcon:hover + .reactionText {
127
- display: block;
128
- opacity: 0.8;
129
- }
130
-
131
- .commentContainer{
132
- display: flex;
133
- flex-direction: column;
134
- height: 291px;
135
- }
136
- .textAreaCont{
137
- width: 100%;
138
- height: 140px;
139
- background-color: #eaeaeb;
140
- margin-top: 17%;
141
- }
142
- .textArea{
143
- border: 0px;
144
- width: 85%;
145
- height: 120px;
146
- background-color: #eaeaeb;
147
- margin-left: 6%;
148
- outline: none;
149
- margin-top: 4%;
150
- resize: none;
151
-
152
- }
153
- .SendButtonCommentComponent{
154
- color: #ffff;
155
- font-size: 12px;
156
- text-align: center;
157
- margin-top: 1px;
158
-
159
- }
160
- .sendButtonContCommentComp{
161
- background-color: var(--buttonColor);
162
- width: 50px;
163
- height: 29px;
164
- box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 3px 0px;
165
- border-radius: 3px;
166
- margin-top: 13px;
167
- margin-right: 11px;
168
- cursor: pointer;
169
- border: 0px;
170
-
171
- }
172
-
173
- .CommentButtonContDisable{
174
- background-color: #cccccc;
175
- width: 50px;
176
- height: 29px;
177
- box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 3px 0px;
178
- border-radius: 3px;
179
- margin-top: 13px;
180
- margin-right: 11px;
181
- cursor:not-allowed;
182
- border: 0px;
183
- }
184
- .CommentButtonTxtDisable{
185
- color: black;
186
- font-size: 12px;
187
- text-align: center;
188
- margin-top: 2px;
189
- }
190
- .footer{
191
- display: flex;
192
- justify-content: flex-end;
193
- }
194
-
195
- .icons-second{
196
- display: flex;
197
- flex-direction: row;
198
- justify-content: space-evenly;
199
- margin-top: 6%;
200
- }
201
- .pointerDiv{
202
- width: 0;
203
- height: 0;
204
- border-left: 3px solid transparent;
205
- margin-top: -8px;
206
- border-right: 5px solid transparent;
207
- border-bottom: 8px solid #eaeaeb;
208
- margin-left: var(--pointerMargin);
209
-
210
-
211
- }
212
- #hateDiv{
213
- display: var(--hateDisplay);
214
- }
215
- #dislikeDiv{
216
- display: var(--dislikeDisplay);
217
- }
218
- #neutralDiv{
219
- display: var(--neutralDisplay);
220
- }
221
- #likeDiv{
222
- display: var(--likeDisplay);
223
- }
224
- #loveDiv{
225
- display: var(--loveDisplay);
226
- }
227
- .emailContainer{
228
- display: flex;
229
- flex-direction: column;
230
- height: 220px;
231
- }
232
- #emailInputCont{
233
- width: 100%;
234
- height: 46px;
235
- background-color: #eaeaeb;
236
- display: flex;
237
- /* align-items: center; */
238
- justify-content: center;
239
- margin-top: 10%;
240
-
241
- }
242
- #EmailTextArea{
243
- text-align: center;
244
- border: 0px;
245
- background-color: #eaeaeb;
246
- margin-top:3%;
247
- outline: none;
248
- }
249
- #emailText{
250
- width: 80%;
251
- text-align: center;
252
- margin-left: 11%;
253
- margin-top: 8%;
254
- line-height: 1.29;
255
- font-size: 17px;
256
- }
257
- .emailFooter{
258
- display: flex;
259
- justify-content: flex-end;
260
- flex-direction: row;
261
- }
262
- #skipText{
263
- color: #908f8f;
264
- cursor: pointer;
265
- font-size: 13px;
266
- margin-top: 6%;
267
- margin-right: 4%;
268
- letter-spacing: normal;
269
-
270
- }
271
- #skipText:hover{
272
- color: #666666;
273
- }
@@ -1,273 +0,0 @@
1
- body{
2
- width: 100%;
3
- display: flex;
4
- flex-direction: var(--wgPositionVertical);
5
- position: absolute;
6
- top: 0; right: 0; bottom: 0; left: 0;
7
- background-color: #ebeef9;
8
- height: 100%;
9
- align-items: var(--wgPositionHorizintal);
10
- padding: 0;
11
- }
12
- .widget {
13
- background-color: var(--widgetColor);
14
- width: 34px;
15
- height: 112px;
16
- border-top-left-radius:var(--widgetLeftSideBorder) ;
17
- border-bottom-left-radius: var(--widgetLeftSideBorder);
18
- border-top-right-radius: var(--widgetRightSideBorder) ;
19
- border-bottom-right-radius: var(--widgetRightSideBorder);
20
- box-shadow: 0.2px 0.2px 0.2px rgb(133, 130, 130);
21
- display: flex;
22
- flex-direction: column;
23
- align-items: center;
24
- justify-content: space-evenly;
25
- cursor: pointer;
26
- margin-top: 5px;
27
- }
28
- #mainIcon {
29
- width: 60%;
30
- margin-left: 4%;
31
- cursor: pointer;
32
- }
33
- #feedbackTxt {
34
- color: var(--widgetTextColor);
35
- font-size: 13px;
36
- writing-mode: vertical-lr;
37
- transform: rotate(180deg);
38
- cursor: pointer;
39
- }
40
- .widget:hover {
41
- width: 35px;
42
- -webkit-box-shadow: 0px 0px 35px 2px rgba(0, 0, 0, 0.24);
43
- box-shadow: 0px 0px 35px 2px rgba(0, 0, 0, 0.24);
44
- }
45
- .cont {
46
- width: 320px;
47
- height: fit-content;
48
- background-color: rgb(255, 255, 255);
49
- margin-right: var(--widgetMarginRight);
50
- margin-left: var(--widgetMarginLeft);
51
- -webkit-box-shadow: rgba(0, 0, 0, 0.35) 0px 6px 100px 0px;
52
- box-shadow: rgba(0, 0, 0, 0.35) 0px 6px 100px 0px;
53
- }
54
- .thanksMessageCont{
55
- width: 320px;
56
- height: 104px;
57
- background-color: rgb(255, 255, 255);
58
- margin-right: var(--widgetMarginRight);
59
- margin-left: var(--widgetMarginLeft);
60
- -webkit-box-shadow: rgba(0, 0, 0, 0.35) 0px 6px 100px 0px;
61
- box-shadow: rgba(0, 0, 0, 0.35) 0px 6px 100px 0px;
62
- }
63
- #closeIcon{
64
- font-size: 16px;
65
- color: #ffff;
66
- font-weight: 600;
67
- font-family: system-ui;
68
- cursor: pointer;
69
-
70
- }
71
- .closeCont{
72
- background-color: #4d5167;
73
- width: 27px;
74
- height: 27px;
75
- border-radius: 50%;
76
- display: flex;
77
- justify-content: center;
78
- align-items: center;
79
- margin-top: -15px;
80
- margin-left: 85%;
81
- cursor: pointer;
82
- }
83
-
84
-
85
-
86
-
87
-
88
- @media (min-width: 640px) {
89
- body {
90
- max-width: none;
91
- }
92
- }.container {
93
- display: flex;
94
- flex-direction: column;
95
- height: 190px;
96
- }
97
- .icons {
98
- display: flex;
99
- flex-direction: row;
100
- justify-content: space-evenly;
101
- margin-top: 11%;
102
- }
103
- #txt {
104
- font-size: 17px;
105
- display: flex;
106
- text-align: center;
107
- margin-top: 5%;
108
- width: 61%;
109
- margin-left: 19%;
110
- }
111
-
112
- .iconTextCont {
113
- display: flex;
114
- flex-direction: column;
115
- align-items: center;
116
- height: 22px;
117
- }
118
-
119
- .reactionText {
120
- font-size: 9px;
121
- display: none;
122
- }
123
- .iconTextCont:hover{
124
- cursor: pointer;
125
- }
126
- .reactionIcon:hover + .reactionText {
127
- display: block;
128
- opacity: 0.8;
129
- }
130
-
131
- .commentContainer{
132
- display: flex;
133
- flex-direction: column;
134
- height: 291px;
135
- }
136
- .textAreaCont{
137
- width: 100%;
138
- height: 140px;
139
- background-color: #eaeaeb;
140
- margin-top: 17%;
141
- }
142
- .textArea{
143
- border: 0px;
144
- width: 85%;
145
- height: 120px;
146
- background-color: #eaeaeb;
147
- margin-left: 6%;
148
- outline: none;
149
- margin-top: 4%;
150
- resize: none;
151
-
152
- }
153
- .SendButtonCommentComponent{
154
- color: #ffff;
155
- font-size: 12px;
156
- text-align: center;
157
- margin-top: 1px;
158
-
159
- }
160
- .sendButtonContCommentComp{
161
- background-color: var(--buttonColor);
162
- width: 50px;
163
- height: 29px;
164
- box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 3px 0px;
165
- border-radius: 3px;
166
- margin-top: 13px;
167
- margin-right: 11px;
168
- cursor: pointer;
169
- border: 0px;
170
-
171
- }
172
-
173
- .CommentButtonContDisable{
174
- background-color: #cccccc;
175
- width: 50px;
176
- height: 29px;
177
- box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 3px 0px;
178
- border-radius: 3px;
179
- margin-top: 13px;
180
- margin-right: 11px;
181
- cursor:not-allowed;
182
- border: 0px;
183
- }
184
- .CommentButtonTxtDisable{
185
- color: black;
186
- font-size: 12px;
187
- text-align: center;
188
- margin-top: 2px;
189
- }
190
- .footer{
191
- display: flex;
192
- justify-content: flex-end;
193
- }
194
-
195
- .icons-second{
196
- display: flex;
197
- flex-direction: row;
198
- justify-content: space-evenly;
199
- margin-top: 6%;
200
- }
201
- .pointerDiv{
202
- width: 0;
203
- height: 0;
204
- border-left: 3px solid transparent;
205
- margin-top: -8px;
206
- border-right: 5px solid transparent;
207
- border-bottom: 8px solid #eaeaeb;
208
- margin-left: var(--pointerMargin);
209
-
210
-
211
- }
212
- #hateDiv{
213
- display: var(--hateDisplay);
214
- }
215
- #dislikeDiv{
216
- display: var(--dislikeDisplay);
217
- }
218
- #neutralDiv{
219
- display: var(--neutralDisplay);
220
- }
221
- #likeDiv{
222
- display: var(--likeDisplay);
223
- }
224
- #loveDiv{
225
- display: var(--loveDisplay);
226
- }
227
- .emailContainer{
228
- display: flex;
229
- flex-direction: column;
230
- height: 220px;
231
- }
232
- #emailInputCont{
233
- width: 100%;
234
- height: 46px;
235
- background-color: #eaeaeb;
236
- display: flex;
237
- /* align-items: center; */
238
- justify-content: center;
239
- margin-top: 10%;
240
-
241
- }
242
- #EmailTextArea{
243
- text-align: center;
244
- border: 0px;
245
- background-color: #eaeaeb;
246
- margin-top:3%;
247
- outline: none;
248
- }
249
- #emailText{
250
- width: 80%;
251
- text-align: center;
252
- margin-left: 11%;
253
- margin-top: 8%;
254
- line-height: 1.29;
255
- font-size: 17px;
256
- }
257
- .emailFooter{
258
- display: flex;
259
- justify-content: flex-end;
260
- flex-direction: row;
261
- }
262
- #skipText{
263
- color: #908f8f;
264
- cursor: pointer;
265
- font-size: 13px;
266
- margin-top: 6%;
267
- margin-right: 4%;
268
- letter-spacing: normal;
269
-
270
- }
271
- #skipText:hover{
272
- color: #666666;
273
- }