@pocketping/widget 1.5.0 → 1.5.2
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/dist/index.cjs +26 -5
- package/dist/index.js +26 -5
- package/dist/pocketping.min.global.js +26 -5
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -151,6 +151,7 @@ function styles(primaryColor, theme) {
|
|
|
151
151
|
flex-direction: column;
|
|
152
152
|
overflow: hidden;
|
|
153
153
|
z-index: 9998;
|
|
154
|
+
transition: max-height 0.2s ease, bottom 0.2s ease;
|
|
154
155
|
}
|
|
155
156
|
|
|
156
157
|
.pp-window.pp-bottom-right {
|
|
@@ -167,13 +168,21 @@ function styles(primaryColor, theme) {
|
|
|
167
168
|
.pp-window {
|
|
168
169
|
width: calc(100vw - 20px);
|
|
169
170
|
height: auto;
|
|
171
|
+
min-height: 300px;
|
|
170
172
|
max-height: calc(100vh - 100px);
|
|
171
|
-
max-height: calc(
|
|
173
|
+
max-height: calc(100svh - 100px); /* svh = small viewport, excludes keyboard */
|
|
172
174
|
bottom: 80px;
|
|
173
175
|
right: 10px;
|
|
174
176
|
left: 10px;
|
|
175
177
|
border-radius: 12px;
|
|
176
178
|
}
|
|
179
|
+
|
|
180
|
+
/* When keyboard is likely open (input focused), reduce height */
|
|
181
|
+
.pp-window:has(.pp-input:focus) {
|
|
182
|
+
max-height: calc(50vh - 20px);
|
|
183
|
+
max-height: calc(50svh - 20px);
|
|
184
|
+
bottom: 10px;
|
|
185
|
+
}
|
|
177
186
|
}
|
|
178
187
|
|
|
179
188
|
.pp-header {
|
|
@@ -924,17 +933,29 @@ function styles(primaryColor, theme) {
|
|
|
924
933
|
}
|
|
925
934
|
|
|
926
935
|
.pp-reply-cancel {
|
|
927
|
-
background:
|
|
936
|
+
background: ${isDark ? "rgba(255,255,255,0.1)" : "rgba(0,0,0,0.05)"};
|
|
928
937
|
border: none;
|
|
938
|
+
border-radius: 50%;
|
|
929
939
|
color: ${colors.textSecondary};
|
|
930
940
|
cursor: pointer;
|
|
931
|
-
padding:
|
|
941
|
+
padding: 0;
|
|
942
|
+
width: 24px;
|
|
943
|
+
height: 24px;
|
|
944
|
+
min-width: 24px;
|
|
945
|
+
display: flex;
|
|
946
|
+
align-items: center;
|
|
947
|
+
justify-content: center;
|
|
932
948
|
flex-shrink: 0;
|
|
949
|
+
transition: background 0.15s;
|
|
950
|
+
}
|
|
951
|
+
|
|
952
|
+
.pp-reply-cancel:hover {
|
|
953
|
+
background: ${isDark ? "rgba(255,255,255,0.2)" : "rgba(0,0,0,0.1)"};
|
|
933
954
|
}
|
|
934
955
|
|
|
935
956
|
.pp-reply-cancel svg {
|
|
936
|
-
width:
|
|
937
|
-
height:
|
|
957
|
+
width: 14px;
|
|
958
|
+
height: 14px;
|
|
938
959
|
}
|
|
939
960
|
|
|
940
961
|
/* Reply Quote in Message */
|
package/dist/index.js
CHANGED
|
@@ -110,6 +110,7 @@ function styles(primaryColor, theme) {
|
|
|
110
110
|
flex-direction: column;
|
|
111
111
|
overflow: hidden;
|
|
112
112
|
z-index: 9998;
|
|
113
|
+
transition: max-height 0.2s ease, bottom 0.2s ease;
|
|
113
114
|
}
|
|
114
115
|
|
|
115
116
|
.pp-window.pp-bottom-right {
|
|
@@ -126,13 +127,21 @@ function styles(primaryColor, theme) {
|
|
|
126
127
|
.pp-window {
|
|
127
128
|
width: calc(100vw - 20px);
|
|
128
129
|
height: auto;
|
|
130
|
+
min-height: 300px;
|
|
129
131
|
max-height: calc(100vh - 100px);
|
|
130
|
-
max-height: calc(
|
|
132
|
+
max-height: calc(100svh - 100px); /* svh = small viewport, excludes keyboard */
|
|
131
133
|
bottom: 80px;
|
|
132
134
|
right: 10px;
|
|
133
135
|
left: 10px;
|
|
134
136
|
border-radius: 12px;
|
|
135
137
|
}
|
|
138
|
+
|
|
139
|
+
/* When keyboard is likely open (input focused), reduce height */
|
|
140
|
+
.pp-window:has(.pp-input:focus) {
|
|
141
|
+
max-height: calc(50vh - 20px);
|
|
142
|
+
max-height: calc(50svh - 20px);
|
|
143
|
+
bottom: 10px;
|
|
144
|
+
}
|
|
136
145
|
}
|
|
137
146
|
|
|
138
147
|
.pp-header {
|
|
@@ -883,17 +892,29 @@ function styles(primaryColor, theme) {
|
|
|
883
892
|
}
|
|
884
893
|
|
|
885
894
|
.pp-reply-cancel {
|
|
886
|
-
background:
|
|
895
|
+
background: ${isDark ? "rgba(255,255,255,0.1)" : "rgba(0,0,0,0.05)"};
|
|
887
896
|
border: none;
|
|
897
|
+
border-radius: 50%;
|
|
888
898
|
color: ${colors.textSecondary};
|
|
889
899
|
cursor: pointer;
|
|
890
|
-
padding:
|
|
900
|
+
padding: 0;
|
|
901
|
+
width: 24px;
|
|
902
|
+
height: 24px;
|
|
903
|
+
min-width: 24px;
|
|
904
|
+
display: flex;
|
|
905
|
+
align-items: center;
|
|
906
|
+
justify-content: center;
|
|
891
907
|
flex-shrink: 0;
|
|
908
|
+
transition: background 0.15s;
|
|
909
|
+
}
|
|
910
|
+
|
|
911
|
+
.pp-reply-cancel:hover {
|
|
912
|
+
background: ${isDark ? "rgba(255,255,255,0.2)" : "rgba(0,0,0,0.1)"};
|
|
892
913
|
}
|
|
893
914
|
|
|
894
915
|
.pp-reply-cancel svg {
|
|
895
|
-
width:
|
|
896
|
-
height:
|
|
916
|
+
width: 14px;
|
|
917
|
+
height: 14px;
|
|
897
918
|
}
|
|
898
919
|
|
|
899
920
|
/* Reply Quote in Message */
|
|
@@ -92,6 +92,7 @@
|
|
|
92
92
|
flex-direction: column;
|
|
93
93
|
overflow: hidden;
|
|
94
94
|
z-index: 9998;
|
|
95
|
+
transition: max-height 0.2s ease, bottom 0.2s ease;
|
|
95
96
|
}
|
|
96
97
|
|
|
97
98
|
.pp-window.pp-bottom-right {
|
|
@@ -108,13 +109,21 @@
|
|
|
108
109
|
.pp-window {
|
|
109
110
|
width: calc(100vw - 20px);
|
|
110
111
|
height: auto;
|
|
112
|
+
min-height: 300px;
|
|
111
113
|
max-height: calc(100vh - 100px);
|
|
112
|
-
max-height: calc(
|
|
114
|
+
max-height: calc(100svh - 100px); /* svh = small viewport, excludes keyboard */
|
|
113
115
|
bottom: 80px;
|
|
114
116
|
right: 10px;
|
|
115
117
|
left: 10px;
|
|
116
118
|
border-radius: 12px;
|
|
117
119
|
}
|
|
120
|
+
|
|
121
|
+
/* When keyboard is likely open (input focused), reduce height */
|
|
122
|
+
.pp-window:has(.pp-input:focus) {
|
|
123
|
+
max-height: calc(50vh - 20px);
|
|
124
|
+
max-height: calc(50svh - 20px);
|
|
125
|
+
bottom: 10px;
|
|
126
|
+
}
|
|
118
127
|
}
|
|
119
128
|
|
|
120
129
|
.pp-header {
|
|
@@ -865,17 +874,29 @@
|
|
|
865
874
|
}
|
|
866
875
|
|
|
867
876
|
.pp-reply-cancel {
|
|
868
|
-
background:
|
|
877
|
+
background: ${n?"rgba(255,255,255,0.1)":"rgba(0,0,0,0.05)"};
|
|
869
878
|
border: none;
|
|
879
|
+
border-radius: 50%;
|
|
870
880
|
color: ${s.textSecondary};
|
|
871
881
|
cursor: pointer;
|
|
872
|
-
padding:
|
|
882
|
+
padding: 0;
|
|
883
|
+
width: 24px;
|
|
884
|
+
height: 24px;
|
|
885
|
+
min-width: 24px;
|
|
886
|
+
display: flex;
|
|
887
|
+
align-items: center;
|
|
888
|
+
justify-content: center;
|
|
873
889
|
flex-shrink: 0;
|
|
890
|
+
transition: background 0.15s;
|
|
891
|
+
}
|
|
892
|
+
|
|
893
|
+
.pp-reply-cancel:hover {
|
|
894
|
+
background: ${n?"rgba(255,255,255,0.2)":"rgba(0,0,0,0.1)"};
|
|
874
895
|
}
|
|
875
896
|
|
|
876
897
|
.pp-reply-cancel svg {
|
|
877
|
-
width:
|
|
878
|
-
height:
|
|
898
|
+
width: 14px;
|
|
899
|
+
height: 14px;
|
|
879
900
|
}
|
|
880
901
|
|
|
881
902
|
/* Reply Quote in Message */
|