@magicfeedback/native 2.1.7-alpha.8 → 2.1.7-alpha.9
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.
|
@@ -845,143 +845,149 @@ textarea.error {
|
|
|
845
845
|
======================================== */
|
|
846
846
|
/* Modal backdrop */
|
|
847
847
|
.magicfeedback-modal-backdrop {
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
848
|
+
position: fixed;
|
|
849
|
+
top: 0;
|
|
850
|
+
left: 0;
|
|
851
|
+
width: 100vw;
|
|
852
|
+
height: 100vh;
|
|
853
|
+
background: rgba(0, 0, 0, 0.4);
|
|
854
|
+
display: none; /* toggled to flex when open */
|
|
855
|
+
align-items: center;
|
|
856
|
+
justify-content: center;
|
|
857
|
+
z-index: 9999;
|
|
858
858
|
}
|
|
859
859
|
|
|
860
860
|
/* Modal container */
|
|
861
861
|
.magicfeedback-modal {
|
|
862
|
-
|
|
863
|
-
|
|
864
|
-
|
|
865
|
-
|
|
866
|
-
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
|
|
862
|
+
background: #fff;
|
|
863
|
+
border-radius: 8px;
|
|
864
|
+
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
|
|
865
|
+
max-width: 520px;
|
|
866
|
+
width: 90%;
|
|
867
|
+
max-height: 80vh;
|
|
868
|
+
overflow: auto;
|
|
869
|
+
padding: 16px;
|
|
870
870
|
}
|
|
871
871
|
|
|
872
872
|
/* Modal actions */
|
|
873
873
|
.magicfeedback-modal-actions {
|
|
874
|
-
|
|
875
|
-
|
|
876
|
-
|
|
877
|
-
|
|
874
|
+
display: flex;
|
|
875
|
+
justify-content: flex-end;
|
|
876
|
+
gap: 8px;
|
|
877
|
+
margin-top: 12px;
|
|
878
878
|
}
|
|
879
879
|
|
|
880
880
|
.magicfeedback-modal-counter {
|
|
881
|
-
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
885
|
-
|
|
881
|
+
margin-right: auto;
|
|
882
|
+
display: flex;
|
|
883
|
+
align-items: center;
|
|
884
|
+
font-size: 14px;
|
|
885
|
+
color: #444;
|
|
886
886
|
}
|
|
887
887
|
|
|
888
888
|
/* Modal list */
|
|
889
889
|
.magicfeedback-modal-list {
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
890
|
+
display: flex;
|
|
891
|
+
flex-direction: column;
|
|
892
|
+
gap: 8px;
|
|
893
893
|
}
|
|
894
894
|
|
|
895
895
|
.magicfeedback-modal-row {
|
|
896
|
-
|
|
897
|
-
|
|
898
|
-
|
|
899
|
-
|
|
896
|
+
display: flex;
|
|
897
|
+
align-items: center;
|
|
898
|
+
gap: 10px;
|
|
899
|
+
cursor: pointer;
|
|
900
900
|
}
|
|
901
901
|
|
|
902
902
|
/* Priority list header */
|
|
903
903
|
.magicfeedback-priority-list-header {
|
|
904
|
-
|
|
904
|
+
display: flex;
|
|
905
905
|
flex-direction: row-reverse;
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
|
|
906
|
+
align-items: center;
|
|
907
|
+
justify-content: space-between;
|
|
908
|
+
gap: 12px;
|
|
909
|
+
margin-bottom: 8px;
|
|
910
910
|
}
|
|
911
911
|
|
|
912
912
|
.magicfeedback-priority-list-reorder {
|
|
913
|
-
|
|
913
|
+
margin-top: 8px;
|
|
914
914
|
}
|
|
915
915
|
|
|
916
916
|
.magicfeedback-priority-list-list {
|
|
917
|
-
|
|
918
|
-
|
|
917
|
+
padding: 0;
|
|
918
|
+
list-style: none;
|
|
919
919
|
}
|
|
920
920
|
|
|
921
921
|
.magicfeedback-priority-list-item {
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
922
|
+
display: flex;
|
|
923
|
+
justify-content: space-between;
|
|
924
|
+
align-items: center;
|
|
925
|
+
margin: 5px 0;
|
|
926
926
|
}
|
|
927
927
|
|
|
928
928
|
.magicfeedback-priority-list-item-label {
|
|
929
|
-
|
|
929
|
+
font-size: 15px;
|
|
930
930
|
}
|
|
931
931
|
|
|
932
932
|
.magicfeedback-priority-list-arrows {
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
|
|
933
|
+
display: flex;
|
|
934
|
+
align-items: center;
|
|
935
|
+
gap: 6px;
|
|
936
936
|
}
|
|
937
937
|
|
|
938
938
|
/* Buttons */
|
|
939
939
|
.magicfeedback-button {
|
|
940
|
-
|
|
941
|
-
|
|
942
|
-
|
|
943
|
-
|
|
944
|
-
|
|
945
|
-
|
|
946
|
-
|
|
947
|
-
|
|
940
|
+
appearance: none;
|
|
941
|
+
border: 1px solid #ccc;
|
|
942
|
+
border-radius: 6px;
|
|
943
|
+
background: #f7f7f7;
|
|
944
|
+
color: #222;
|
|
945
|
+
padding: 8px 12px;
|
|
946
|
+
font-size: 14px;
|
|
947
|
+
cursor: pointer;
|
|
948
948
|
}
|
|
949
|
+
|
|
949
950
|
.magicfeedback-button:hover {
|
|
950
|
-
|
|
951
|
+
background: #efefef;
|
|
951
952
|
}
|
|
953
|
+
|
|
952
954
|
.magicfeedback-button:active {
|
|
953
|
-
|
|
955
|
+
background: #e8e8e8;
|
|
954
956
|
}
|
|
957
|
+
|
|
955
958
|
.magicfeedback-button-primary {
|
|
956
|
-
|
|
957
|
-
|
|
958
|
-
|
|
959
|
+
border-color: #2e6bf7;
|
|
960
|
+
background: #2e6bf7;
|
|
961
|
+
color: #fff;
|
|
959
962
|
}
|
|
963
|
+
|
|
960
964
|
.magicfeedback-button-primary:hover {
|
|
961
|
-
|
|
965
|
+
background: #255bd6;
|
|
962
966
|
}
|
|
967
|
+
|
|
963
968
|
.magicfeedback-button-primary:active {
|
|
964
|
-
|
|
969
|
+
background: #1f4fb5;
|
|
965
970
|
}
|
|
966
971
|
|
|
967
972
|
/* Warning flash */
|
|
968
973
|
.magicfeedback-warning {
|
|
969
|
-
|
|
974
|
+
color: #C70039;
|
|
970
975
|
}
|
|
971
976
|
|
|
972
977
|
/* Start message button */
|
|
973
978
|
.magicfeedback-start-message-button {
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
|
|
977
|
-
|
|
978
|
-
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
979
|
+
appearance: none;
|
|
980
|
+
border: 1px solid #2e6bf7;
|
|
981
|
+
border-radius: 6px;
|
|
982
|
+
background: #2e6bf7;
|
|
983
|
+
color: #fff;
|
|
984
|
+
padding: 10px 16px;
|
|
985
|
+
font-size: 15px;
|
|
986
|
+
cursor: pointer;
|
|
982
987
|
}
|
|
988
|
+
|
|
983
989
|
.magicfeedback-start-message-button:hover {
|
|
984
|
-
|
|
990
|
+
background: #255bd6;
|
|
985
991
|
}
|
|
986
992
|
|
|
987
993
|
/* ========================================
|
|
@@ -1055,18 +1061,19 @@ textarea.error {
|
|
|
1055
1061
|
}
|
|
1056
1062
|
|
|
1057
1063
|
.magicfeedback-modal-close {
|
|
1058
|
-
|
|
1059
|
-
|
|
1060
|
-
|
|
1061
|
-
|
|
1062
|
-
|
|
1063
|
-
|
|
1064
|
-
|
|
1065
|
-
|
|
1066
|
-
|
|
1064
|
+
position: absolute;
|
|
1065
|
+
top: 8px;
|
|
1066
|
+
right: 8px;
|
|
1067
|
+
background: transparent;
|
|
1068
|
+
border: none;
|
|
1069
|
+
font-size: 20px;
|
|
1070
|
+
line-height: 1;
|
|
1071
|
+
cursor: pointer;
|
|
1072
|
+
color: #666;
|
|
1067
1073
|
}
|
|
1074
|
+
|
|
1068
1075
|
.magicfeedback-modal-close:hover,
|
|
1069
1076
|
.magicfeedback-modal-close:focus {
|
|
1070
|
-
|
|
1071
|
-
|
|
1077
|
+
color: #000;
|
|
1078
|
+
outline: none;
|
|
1072
1079
|
}
|