@tencentcloud/roomkit-electron-vue3 2.4.1 → 2.4.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.
Files changed (3) hide show
  1. package/es/index.mjs +1739 -1739
  2. package/lib/index.js +1739 -1739
  3. package/package.json +2 -2
package/lib/index.js CHANGED
@@ -910,75 +910,84 @@
910
910
  width: 8px;
911
911
  padding: 0;
912
912
  border-radius: 50%;
913
- }.tui-theme-white .button-primary[data-v-c838afcb] {
914
- --shadow-color: rgba(213, 224, 242, 0.60);
913
+ }.tui-theme-black .icon-button-container[data-v-b8cf3064] {
914
+ --icon-button-hover: rgba(46, 50, 61, 0.70);
915
915
  }
916
- .tui-theme-black .button-primary[data-v-c838afcb] {
917
- --shadow-color: rgba(28, 102, 229, 0.20);
916
+ .tui-theme-white .icon-button-container[data-v-b8cf3064] {
917
+ --icon-button-hover: rgba(79, 88, 107, 0.05);
918
918
  }
919
- .tui-button[data-v-c838afcb] {
920
- display: inline-flex;
921
- justify-content: center;
919
+ .icon-button-container[data-v-b8cf3064] {
920
+ position: relative;
921
+ display: flex;
922
922
  align-items: center;
923
- text-align: center;
923
+ color: var(--font-color-1);
924
924
  cursor: pointer;
925
- transition: background-color 0.2s ease-in-out;
926
- border: 1px solid var(--active-color-1);
927
- font-weight: 400;
928
- line-height: 22px;
929
- white-space: nowrap;
930
- background-color: var(--active-color-1);
931
- outline: none;
932
- color: var(--font-color-7);
933
925
  }
934
- .tui-button[data-v-c838afcb]:hover {
935
- background: #144FB6;
936
- border: 1px solid #144FB6;
937
- outline: none;
926
+ .icon-button-container .icon-content.disabled[data-v-b8cf3064] {
927
+ opacity: 0.4;
928
+ cursor: not-allowed;
938
929
  }
939
- .tui-button-primary[data-v-c838afcb] {
940
- background-color: transparent;
941
- border: 1px solid var(--active-color-2);
942
- color: var(--active-color-2);
930
+ .icon-button-container .icon-content[data-v-b8cf3064]:hover {
931
+ background: var(--icon-button-hover);
932
+ }
933
+ .icon-button-container .icon-content-horizontal[data-v-b8cf3064] {
934
+ display: flex;
935
+ justify-content: space-between;
936
+ align-items: center;
937
+ border-radius: 6px;
938
+ height: 32px;
939
+ flex-direction: row;
940
+ padding: 0 5px;
941
+ }
942
+ .icon-button-container .icon-content-horizontal .title[data-v-b8cf3064] {
943
943
  font-size: 14px;
944
+ line-height: 26px;
944
945
  font-weight: 500;
945
- line-height: 22px;
946
+ margin-left: 4px;
946
947
  }
947
- .tui-button-primary[data-v-c838afcb]:hover {
948
- background-color: var(--shadow-color);
948
+ .icon-button-container .icon-content-vertical[data-v-b8cf3064] {
949
+ display: flex;
950
+ flex-direction: column;
951
+ justify-content: center;
952
+ align-items: center;
953
+ border-radius: 6px;
954
+ height: 56px;
955
+ min-width: 56px;
956
+ padding: 5px;
949
957
  }
950
- .tui-button-large[data-v-c838afcb] {
951
- padding: 19px 48px;
952
- font-size: 20px;
958
+ .icon-button-container .icon-content-vertical .title[data-v-b8cf3064] {
959
+ font-size: 12px;
960
+ line-height: 20px;
961
+ font-weight: 400;
962
+ margin-top: 4px;
953
963
  }
954
- .tui-button-default[data-v-c838afcb] {
955
- padding: 5px 30px;
956
- font-size: 14px;
964
+ .icon-button-container .icon-arrow[data-v-b8cf3064] {
965
+ position: relative;
966
+ width: 12px;
967
+ height: 56px;
968
+ display: flex;
969
+ justify-content: center;
970
+ align-items: center;
971
+ border-radius: 6px;
957
972
  }
958
- .tui-button-round[data-v-c838afcb] {
959
- border-radius: 999999px;
973
+ .icon-button-container .icon-arrow[data-v-b8cf3064]:hover {
974
+ background: var(--icon-button-hover);
960
975
  }
961
- .tui-button-disabled[data-v-c838afcb] {
962
- cursor: not-allowed;
963
- pointer-events: none;
964
- opacity: 0.4;
976
+ .unsupport-icon[data-v-b8cf3064] {
977
+ position: absolute;
978
+ top: 13px;
979
+ left: 26px;
965
980
  }
966
- .tui-button-icon[data-v-c838afcb] {
967
- margin-right: 5px;
968
- display: flex;
981
+ @media screen and (max-width: 600px) {
982
+ .icon-box[data-v-b8cf3064] {
983
+ width: 72px;
969
984
  }
970
- .tui-button-text[data-v-c838afcb] {
971
- border: 0 solid transparent;
972
- background-color: transparent;
973
- color: var(--font-color-4);
985
+ .icon-box.hover-effect[data-v-b8cf3064]:hover:before {
986
+ width: 72px;
974
987
  }
975
- .tui-button-text[data-v-c838afcb]:hover {
976
- border: 0 solid transparent;
977
- background-color: transparent;
978
- color: var(--font-color-4);
988
+ .icon-box.hover-effect[data-v-b8cf3064]:hover:after {
989
+ width: 72px;
979
990
  }
980
- .tui-button-text[data-v-c838afcb]::after {
981
- border: none;
982
991
  }.overlay-container[data-v-b215a63c] {
983
992
  position: absolute;
984
993
  top: 0;
@@ -1041,84 +1050,6 @@
1041
1050
  .drawer-container .drawer-content[data-v-b215a63c] {
1042
1051
  flex: 1;
1043
1052
  overflow: auto;
1044
- }.tui-theme-black .icon-button-container[data-v-b8cf3064] {
1045
- --icon-button-hover: rgba(46, 50, 61, 0.70);
1046
- }
1047
- .tui-theme-white .icon-button-container[data-v-b8cf3064] {
1048
- --icon-button-hover: rgba(79, 88, 107, 0.05);
1049
- }
1050
- .icon-button-container[data-v-b8cf3064] {
1051
- position: relative;
1052
- display: flex;
1053
- align-items: center;
1054
- color: var(--font-color-1);
1055
- cursor: pointer;
1056
- }
1057
- .icon-button-container .icon-content.disabled[data-v-b8cf3064] {
1058
- opacity: 0.4;
1059
- cursor: not-allowed;
1060
- }
1061
- .icon-button-container .icon-content[data-v-b8cf3064]:hover {
1062
- background: var(--icon-button-hover);
1063
- }
1064
- .icon-button-container .icon-content-horizontal[data-v-b8cf3064] {
1065
- display: flex;
1066
- justify-content: space-between;
1067
- align-items: center;
1068
- border-radius: 6px;
1069
- height: 32px;
1070
- flex-direction: row;
1071
- padding: 0 5px;
1072
- }
1073
- .icon-button-container .icon-content-horizontal .title[data-v-b8cf3064] {
1074
- font-size: 14px;
1075
- line-height: 26px;
1076
- font-weight: 500;
1077
- margin-left: 4px;
1078
- }
1079
- .icon-button-container .icon-content-vertical[data-v-b8cf3064] {
1080
- display: flex;
1081
- flex-direction: column;
1082
- justify-content: center;
1083
- align-items: center;
1084
- border-radius: 6px;
1085
- height: 56px;
1086
- min-width: 56px;
1087
- padding: 5px;
1088
- }
1089
- .icon-button-container .icon-content-vertical .title[data-v-b8cf3064] {
1090
- font-size: 12px;
1091
- line-height: 20px;
1092
- font-weight: 400;
1093
- margin-top: 4px;
1094
- }
1095
- .icon-button-container .icon-arrow[data-v-b8cf3064] {
1096
- position: relative;
1097
- width: 12px;
1098
- height: 56px;
1099
- display: flex;
1100
- justify-content: center;
1101
- align-items: center;
1102
- border-radius: 6px;
1103
- }
1104
- .icon-button-container .icon-arrow[data-v-b8cf3064]:hover {
1105
- background: var(--icon-button-hover);
1106
- }
1107
- .unsupport-icon[data-v-b8cf3064] {
1108
- position: absolute;
1109
- top: 13px;
1110
- left: 26px;
1111
- }
1112
- @media screen and (max-width: 600px) {
1113
- .icon-box[data-v-b8cf3064] {
1114
- width: 72px;
1115
- }
1116
- .icon-box.hover-effect[data-v-b8cf3064]:hover:before {
1117
- width: 72px;
1118
- }
1119
- .icon-box.hover-effect[data-v-b8cf3064]:hover:after {
1120
- width: 72px;
1121
- }
1122
1053
  }.tui-input[data-v-627d0ea3] {
1123
1054
  position: relative;
1124
1055
  display: inline-block;
@@ -1138,52 +1069,121 @@ input[data-v-627d0ea3]:focus {
1138
1069
  }
1139
1070
  input[data-v-627d0ea3]:disabled {
1140
1071
  background-color: var(--background-color-9);
1141
- }.tui-theme-white .option-container[data-v-0c4a98c3] {
1142
- --hover-background-color: rgba(213, 224, 242, 0.5);
1072
+ }.tui-theme-white .button-primary[data-v-c838afcb] {
1073
+ --shadow-color: rgba(213, 224, 242, 0.60);
1143
1074
  }
1144
- .tui-theme-black .option-container[data-v-0c4a98c3] {
1145
- --hover-background-color: rgba(213, 224, 242, 0.5);
1075
+ .tui-theme-black .button-primary[data-v-c838afcb] {
1076
+ --shadow-color: rgba(28, 102, 229, 0.20);
1146
1077
  }
1147
- .option-container[data-v-0c4a98c3] {
1148
- padding: 6px 15px;
1078
+ .tui-button[data-v-c838afcb] {
1079
+ display: inline-flex;
1080
+ justify-content: center;
1081
+ align-items: center;
1082
+ text-align: center;
1149
1083
  cursor: pointer;
1084
+ transition: background-color 0.2s ease-in-out;
1085
+ border: 1px solid var(--active-color-1);
1086
+ font-weight: 400;
1087
+ line-height: 22px;
1150
1088
  white-space: nowrap;
1151
- overflow: hidden;
1152
- color: #000;
1153
- }
1154
- .option-container.active[data-v-0c4a98c3] {
1155
- color: var(--active-color-2);
1089
+ background-color: var(--active-color-1);
1090
+ outline: none;
1091
+ color: var(--font-color-7);
1156
1092
  }
1157
- .option-container[data-v-0c4a98c3]:hover {
1158
- background-color: var(--hover-background-color);
1093
+ .tui-button[data-v-c838afcb]:hover {
1094
+ background: #144FB6;
1095
+ border: 1px solid #144FB6;
1096
+ outline: none;
1159
1097
  }
1160
- .option-container .option-content[data-v-0c4a98c3] {
1098
+ .tui-button-primary[data-v-c838afcb] {
1099
+ background-color: transparent;
1100
+ border: 1px solid var(--active-color-2);
1101
+ color: var(--active-color-2);
1161
1102
  font-size: 14px;
1162
- line-height: 22px;
1163
1103
  font-weight: 500;
1164
- }.select-container[data-v-a83a612c] {
1165
- position: relative;
1104
+ line-height: 22px;
1166
1105
  }
1167
- .select-container .select-content[data-v-a83a612c] {
1168
- box-sizing: border-box;
1169
- position: relative;
1170
- border: 1px solid var(--border-color);
1171
- background-color: var(--background-color-7);
1172
- color: var(--font-color-3);
1173
- border-radius: 8px;
1174
- height: 42px;
1175
- padding: 10px 16px;
1176
- cursor: pointer;
1177
- display: flex;
1106
+ .tui-button-primary[data-v-c838afcb]:hover {
1107
+ background-color: var(--shadow-color);
1178
1108
  }
1179
- .select-container .select-content.disabled[data-v-a83a612c] {
1180
- background-color: rgba(255, 255, 255, 0.5);
1181
- color: #8F9AB2;
1182
- cursor: not-allowed;
1109
+ .tui-button-large[data-v-c838afcb] {
1110
+ padding: 19px 48px;
1111
+ font-size: 20px;
1183
1112
  }
1184
- .select-container .select-content .select-text[data-v-a83a612c] {
1185
- width: 0;
1186
- font-size: 14px;
1113
+ .tui-button-default[data-v-c838afcb] {
1114
+ padding: 5px 30px;
1115
+ font-size: 14px;
1116
+ }
1117
+ .tui-button-round[data-v-c838afcb] {
1118
+ border-radius: 999999px;
1119
+ }
1120
+ .tui-button-disabled[data-v-c838afcb] {
1121
+ cursor: not-allowed;
1122
+ pointer-events: none;
1123
+ opacity: 0.4;
1124
+ }
1125
+ .tui-button-icon[data-v-c838afcb] {
1126
+ margin-right: 5px;
1127
+ display: flex;
1128
+ }
1129
+ .tui-button-text[data-v-c838afcb] {
1130
+ border: 0 solid transparent;
1131
+ background-color: transparent;
1132
+ color: var(--font-color-4);
1133
+ }
1134
+ .tui-button-text[data-v-c838afcb]:hover {
1135
+ border: 0 solid transparent;
1136
+ background-color: transparent;
1137
+ color: var(--font-color-4);
1138
+ }
1139
+ .tui-button-text[data-v-c838afcb]::after {
1140
+ border: none;
1141
+ }.tui-theme-white .option-container[data-v-0c4a98c3] {
1142
+ --hover-background-color: rgba(213, 224, 242, 0.5);
1143
+ }
1144
+ .tui-theme-black .option-container[data-v-0c4a98c3] {
1145
+ --hover-background-color: rgba(213, 224, 242, 0.5);
1146
+ }
1147
+ .option-container[data-v-0c4a98c3] {
1148
+ padding: 6px 15px;
1149
+ cursor: pointer;
1150
+ white-space: nowrap;
1151
+ overflow: hidden;
1152
+ color: #000;
1153
+ }
1154
+ .option-container.active[data-v-0c4a98c3] {
1155
+ color: var(--active-color-2);
1156
+ }
1157
+ .option-container[data-v-0c4a98c3]:hover {
1158
+ background-color: var(--hover-background-color);
1159
+ }
1160
+ .option-container .option-content[data-v-0c4a98c3] {
1161
+ font-size: 14px;
1162
+ line-height: 22px;
1163
+ font-weight: 500;
1164
+ }.select-container[data-v-a83a612c] {
1165
+ position: relative;
1166
+ }
1167
+ .select-container .select-content[data-v-a83a612c] {
1168
+ box-sizing: border-box;
1169
+ position: relative;
1170
+ border: 1px solid var(--border-color);
1171
+ background-color: var(--background-color-7);
1172
+ color: var(--font-color-3);
1173
+ border-radius: 8px;
1174
+ height: 42px;
1175
+ padding: 10px 16px;
1176
+ cursor: pointer;
1177
+ display: flex;
1178
+ }
1179
+ .select-container .select-content.disabled[data-v-a83a612c] {
1180
+ background-color: rgba(255, 255, 255, 0.5);
1181
+ color: #8F9AB2;
1182
+ cursor: not-allowed;
1183
+ }
1184
+ .select-container .select-content .select-text[data-v-a83a612c] {
1185
+ width: 0;
1186
+ font-size: 14px;
1187
1187
  font-style: normal;
1188
1188
  font-weight: 500;
1189
1189
  line-height: 22px;
@@ -1345,146 +1345,165 @@ input[data-v-afc0a29e]:focus {
1345
1345
  }
1346
1346
  input[data-v-afc0a29e]:disabled {
1347
1347
  background-color: var(--background-color-9);
1348
- }.message-box-overlay[data-v-a24162df] {
1349
- position: fixed;
1350
- top: 0;
1351
- bottom: 0;
1352
- left: 0;
1348
+ }.header-container[data-v-28759190] {
1353
1349
  width: 100%;
1354
1350
  height: 100%;
1355
- right: 0;
1356
- }
1357
- .message-box-overlay.overlay[data-v-a24162df] {
1358
- background-color: rgba(15, 16, 20, 0.6);
1359
- }
1360
- .tui-message-box[data-v-a24162df] {
1361
- width: 480px;
1362
- background-color: var(--white-color);
1363
- position: absolute;
1364
- top: 50%;
1365
- left: 50%;
1366
- transform: translate(-50%, -50%);
1351
+ padding-left: 9px;
1352
+ padding-right: 24px;
1353
+ position: relative;
1367
1354
  display: flex;
1368
- flex-direction: column;
1369
- border-radius: 20px;
1355
+ justify-content: space-between;
1370
1356
  }
1371
- .tui-message-box .tui-message-box-header[data-v-a24162df] {
1372
- height: 64px;
1373
- position: relative;
1357
+ .header-container .left-container[data-v-28759190] {
1358
+ height: 100%;
1359
+ position: absolute;
1360
+ top: 0;
1361
+ left: 0;
1374
1362
  display: flex;
1375
- padding: 0 24px;
1376
- color: var(--title-color);
1377
1363
  align-items: center;
1378
- box-shadow: 0px 7px 10px -5px rgba(230, 236, 245, 0.8);
1364
+ padding-left: 24px;
1379
1365
  }
1380
- .tui-message-box .tui-message-box-header .tui-dialog-header-title[data-v-a24162df] {
1381
- font-size: 16px;
1382
- font-style: normal;
1383
- font-weight: 600;
1384
- line-height: 24px;
1385
- color: #0f1014;
1366
+ .header-container .left-container .header-item[data-v-28759190]:not(:first-child) {
1367
+ margin-left: 1rem;
1386
1368
  }
1387
- .tui-message-box .tui-message-box-header .close[data-v-a24162df] {
1388
- width: 32px;
1389
- height: 32px;
1369
+ .header-container .center-container[data-v-28759190] {
1390
1370
  position: absolute;
1391
- top: 50%;
1392
- transform: translateY(-50%);
1393
- right: 20px;
1371
+ left: 50%;
1372
+ height: 100%;
1394
1373
  display: flex;
1395
- justify-content: center;
1396
1374
  align-items: center;
1397
- color: #4f586b;
1398
- cursor: pointer;
1375
+ transform: translateX(-50%);
1399
1376
  }
1400
- .tui-message-box-h5[data-v-a24162df] {
1401
- min-width: 80vw;
1402
- max-width: 80vw;
1403
- position: fixed;
1404
- background-color: #ffffff;
1405
- border-radius: 8px;
1406
- top: 50%;
1407
- left: 50%;
1408
- transform: translate(-50%, -50%);
1377
+ .header-container .right-container[data-v-28759190] {
1378
+ position: absolute;
1379
+ top: 0;
1380
+ right: 0;
1381
+ height: 100%;
1382
+ float: right;
1383
+ padding-right: 24px;
1409
1384
  display: flex;
1410
- flex-direction: column;
1411
- font-style: normal;
1412
- color: var(--black-color);
1385
+ align-items: center;
1413
1386
  }
1414
- .tui-message-box-h5 .tui-message-box-header[data-v-a24162df] {
1415
- display: inline-block;
1416
- font-size: 16px;
1417
- text-align: center;
1418
- font-weight: 500;
1419
- padding-top: 14px;
1420
- padding: 24px 24px 12px 24px;
1421
- box-sizing: border-box;
1387
+ .header-container .right-container .header-item[data-v-28759190]:not(:last-child) {
1388
+ margin-right: 1rem;
1422
1389
  }
1423
- .tui-message-box-h5 .tui-message-box-header .close[data-v-a24162df] {
1390
+ .header-container .right-container .end-control-container[data-v-28759190] {
1424
1391
  display: none;
1392
+ }.tui-theme-white .user-control-container[data-v-45ccc1b8] {
1393
+ --filter-color:
1394
+ drop-shadow(0px 0px 4px rgba(32, 77, 141, 0.03))
1395
+ drop-shadow(0px 4px 10px rgba(32, 77, 141, 0.06))
1396
+ drop-shadow(0px 1px 14px rgba(32, 77, 141, 0.05));
1425
1397
  }
1426
- .tui-message-box-h5 .tui-message-box-body[data-v-a24162df] {
1427
- font-weight: 400;
1428
- font-size: 14px;
1429
- text-align: center;
1430
- font-weight: 400;
1431
- color: var(--font-color-4);
1432
- padding: 0 24px 20px 24px;
1398
+ .tui-theme-black .user-control-container[data-v-45ccc1b8] {
1399
+ --filter-color:
1400
+ drop-shadow(0px 8px 40px rgba(23, 25, 31, 0.6))
1401
+ drop-shadow(0px 4px 12px rgba(23, 25, 31, 0.4));
1433
1402
  }
1434
- .tui-message-box-h5 .tui-message-box-footer[data-v-a24162df] {
1435
- width: 100%;
1436
- border-top: 1px solid #d5e0f2;
1403
+ .user-info-container[data-v-45ccc1b8] {
1404
+ position: relative;
1405
+ }
1406
+ .user-info-container .user-info-content[data-v-45ccc1b8] {
1437
1407
  display: flex;
1438
- justify-content: center;
1439
- padding: 11px 0;
1408
+ align-items: center;
1409
+ cursor: pointer;
1440
1410
  }
1441
- .tui-message-box-h5 .tui-message-box-footer .button[data-v-a24162df] {
1442
- background-color: #fff;
1443
- color: var(--active-color-1);
1444
- border: none;
1445
- text-align: center;
1446
- font-size: 16px;
1447
- font-weight: 500;
1411
+ .user-info-container .user-info-content .avatar[data-v-45ccc1b8] {
1412
+ width: 28px;
1413
+ height: 28px;
1414
+ border-radius: 50%;
1448
1415
  }
1449
- .tui-message-box-body[data-v-a24162df] {
1450
- flex: 1;
1451
- padding: 20px 24px;
1452
- font-size: 14px;
1453
- font-style: normal;
1454
- font-weight: 400;
1455
- line-height: 22px;
1456
- color: #4f586b;
1416
+ .user-info-container .user-info-content .name[data-v-45ccc1b8] {
1417
+ max-width: 100px;
1418
+ margin-left: 10px;
1419
+ font-size: 16px;
1420
+ white-space: nowrap;
1421
+ overflow: hidden;
1422
+ text-overflow: ellipsis;
1423
+ color: var(--font-color);
1457
1424
  }
1458
- .tui-message-box-footer[data-v-a24162df] {
1459
- padding: 20px 30px;
1460
- display: flex;
1461
- justify-content: flex-end;
1462
- }.tui-notification .tui-notification-container-mobile[data-v-f10f5d6d] {
1463
- position: fixed;
1464
- top: 8%;
1465
- width: 95%;
1466
- margin: 0 10px;
1467
- height: 44px;
1468
- background-color: #fff;
1469
- border-radius: 10px;
1470
- display: flex;
1471
- text-align: center;
1425
+ .user-info-container .user-info-content .down-icon[data-v-45ccc1b8] {
1426
+ margin-left: 4px;
1472
1427
  }
1473
- .tui-notification .tui-notification-container-mobile .tui-notification-mobile-icon[data-v-f10f5d6d] {
1474
- color: #000000;
1475
- padding: 0 10px;
1428
+ .user-info-container .user-info-content .up-icon[data-v-45ccc1b8] {
1476
1429
  margin-left: 4px;
1430
+ transform: rotate(180deg);
1477
1431
  }
1478
- .tui-notification .tui-notification-container-mobile .tui-notification-mobile-content[data-v-f10f5d6d] {
1479
- font-weight: 400;
1480
- font-size: 15px;
1481
- line-height: 44px;
1482
- color: #181820;
1483
- margin: 0 auto 0 4px;
1432
+ .user-info-container .user-control-container[data-v-45ccc1b8] {
1433
+ position: absolute;
1434
+ top: calc(100% + 15px);
1435
+ right: 0;
1436
+ padding: 10px;
1437
+ min-width: 100px;
1438
+ background: #ffffff;
1439
+ border-radius: 8px;
1440
+ filter: var(--filter-color);
1484
1441
  }
1485
- .tui-notification .tui-notification-container-mobile .tui-notification-mobile-check[data-v-f10f5d6d] {
1486
- background-color: #1C66E5;
1487
- color: #FFFFFF;
1442
+ .user-info-container .user-control-container[data-v-45ccc1b8]::before {
1443
+ content: "";
1444
+ position: absolute;
1445
+ right: 20px;
1446
+ top: -20px;
1447
+ width: 0px;
1448
+ border-top: 10px solid transparent;
1449
+ border-right: 10px solid transparent;
1450
+ border-bottom: 10px solid #ffffff;
1451
+ border-left: 10px solid transparent;
1452
+ }
1453
+ .user-info-container .user-control-container[data-v-45ccc1b8]::after {
1454
+ content: "";
1455
+ width: 100%;
1456
+ height: 20px;
1457
+ position: absolute;
1458
+ left: 0px;
1459
+ top: -20px;
1460
+ background-color: transparent;
1461
+ }
1462
+ .user-info-container .user-control-container .user-control-item-foot[data-v-45ccc1b8],
1463
+ .user-info-container .user-control-container .user-control-item-head[data-v-45ccc1b8] {
1464
+ text-align: center;
1465
+ color: #4f586b;
1466
+ font-size: 14px;
1467
+ cursor: pointer;
1468
+ height: 20px;
1469
+ }
1470
+ .edit-content[data-v-45ccc1b8] {
1471
+ width: 100%;
1472
+ display: flex;
1473
+ align-items: center;
1474
+ }
1475
+ .edit-content .edit-name-input[data-v-45ccc1b8] {
1476
+ margin-left: 16px;
1477
+ flex-grow: 1;
1478
+ }
1479
+ .button[data-v-45ccc1b8] {
1480
+ margin-left: 12px;
1481
+ }.tui-notification .tui-notification-container-mobile[data-v-f10f5d6d] {
1482
+ position: fixed;
1483
+ top: 8%;
1484
+ width: 95%;
1485
+ margin: 0 10px;
1486
+ height: 44px;
1487
+ background-color: #fff;
1488
+ border-radius: 10px;
1489
+ display: flex;
1490
+ text-align: center;
1491
+ }
1492
+ .tui-notification .tui-notification-container-mobile .tui-notification-mobile-icon[data-v-f10f5d6d] {
1493
+ color: #000000;
1494
+ padding: 0 10px;
1495
+ margin-left: 4px;
1496
+ }
1497
+ .tui-notification .tui-notification-container-mobile .tui-notification-mobile-content[data-v-f10f5d6d] {
1498
+ font-weight: 400;
1499
+ font-size: 15px;
1500
+ line-height: 44px;
1501
+ color: #181820;
1502
+ margin: 0 auto 0 4px;
1503
+ }
1504
+ .tui-notification .tui-notification-container-mobile .tui-notification-mobile-check[data-v-f10f5d6d] {
1505
+ background-color: #1C66E5;
1506
+ color: #FFFFFF;
1488
1507
  border-radius: 10px;
1489
1508
  margin: 6px 10px 6px 0;
1490
1509
  padding: 0 12px;
@@ -1744,176 +1763,46 @@ input[data-v-afc0a29e]:disabled {
1744
1763
  .control-container .control-region .room-control-region .enter-room-region .enter-room-action .enter-button.active[data-v-08aec5e4] {
1745
1764
  cursor: pointer;
1746
1765
  background-color: var(--active-color-1);
1747
- }.tui-theme-white .user-control-container[data-v-45ccc1b8] {
1748
- --filter-color:
1749
- drop-shadow(0px 0px 4px rgba(32, 77, 141, 0.03))
1750
- drop-shadow(0px 4px 10px rgba(32, 77, 141, 0.06))
1751
- drop-shadow(0px 1px 14px rgba(32, 77, 141, 0.05));
1752
- }
1753
- .tui-theme-black .user-control-container[data-v-45ccc1b8] {
1754
- --filter-color:
1755
- drop-shadow(0px 8px 40px rgba(23, 25, 31, 0.6))
1756
- drop-shadow(0px 4px 12px rgba(23, 25, 31, 0.4));
1757
- }
1758
- .user-info-container[data-v-45ccc1b8] {
1759
- position: relative;
1760
- }
1761
- .user-info-container .user-info-content[data-v-45ccc1b8] {
1762
- display: flex;
1763
- align-items: center;
1764
- cursor: pointer;
1765
- }
1766
- .user-info-container .user-info-content .avatar[data-v-45ccc1b8] {
1767
- width: 28px;
1768
- height: 28px;
1769
- border-radius: 50%;
1770
- }
1771
- .user-info-container .user-info-content .name[data-v-45ccc1b8] {
1772
- max-width: 100px;
1773
- margin-left: 10px;
1774
- font-size: 16px;
1775
- white-space: nowrap;
1776
- overflow: hidden;
1777
- text-overflow: ellipsis;
1778
- color: var(--font-color);
1779
- }
1780
- .user-info-container .user-info-content .down-icon[data-v-45ccc1b8] {
1781
- margin-left: 4px;
1782
- }
1783
- .user-info-container .user-info-content .up-icon[data-v-45ccc1b8] {
1784
- margin-left: 4px;
1785
- transform: rotate(180deg);
1786
- }
1787
- .user-info-container .user-control-container[data-v-45ccc1b8] {
1788
- position: absolute;
1789
- top: calc(100% + 15px);
1790
- right: 0;
1791
- padding: 10px;
1792
- min-width: 100px;
1793
- background: #ffffff;
1794
- border-radius: 8px;
1795
- filter: var(--filter-color);
1796
- }
1797
- .user-info-container .user-control-container[data-v-45ccc1b8]::before {
1798
- content: "";
1799
- position: absolute;
1800
- right: 20px;
1801
- top: -20px;
1802
- width: 0px;
1803
- border-top: 10px solid transparent;
1804
- border-right: 10px solid transparent;
1805
- border-bottom: 10px solid #ffffff;
1806
- border-left: 10px solid transparent;
1807
- }
1808
- .user-info-container .user-control-container[data-v-45ccc1b8]::after {
1809
- content: "";
1810
- width: 100%;
1811
- height: 20px;
1812
- position: absolute;
1813
- left: 0px;
1814
- top: -20px;
1815
- background-color: transparent;
1816
- }
1817
- .user-info-container .user-control-container .user-control-item-foot[data-v-45ccc1b8],
1818
- .user-info-container .user-control-container .user-control-item-head[data-v-45ccc1b8] {
1819
- text-align: center;
1820
- color: #4f586b;
1821
- font-size: 14px;
1822
- cursor: pointer;
1823
- height: 20px;
1824
- }
1825
- .edit-content[data-v-45ccc1b8] {
1826
- width: 100%;
1827
- display: flex;
1828
- align-items: center;
1829
- }
1830
- .edit-content .edit-name-input[data-v-45ccc1b8] {
1831
- margin-left: 16px;
1832
- flex-grow: 1;
1833
- }
1834
- .button[data-v-45ccc1b8] {
1835
- margin-left: 12px;
1836
- }.content-container[data-v-62c87292] {
1837
- width: 100%;
1838
- height: 100%;
1839
- overflow: hidden;
1840
- }.header-container[data-v-28759190] {
1841
- width: 100%;
1842
- height: 100%;
1843
- padding-left: 9px;
1844
- padding-right: 24px;
1845
- position: relative;
1846
- display: flex;
1847
- justify-content: space-between;
1848
- }
1849
- .header-container .left-container[data-v-28759190] {
1850
- height: 100%;
1851
- position: absolute;
1852
- top: 0;
1853
- left: 0;
1854
- display: flex;
1855
- align-items: center;
1856
- padding-left: 24px;
1857
- }
1858
- .header-container .left-container .header-item[data-v-28759190]:not(:first-child) {
1859
- margin-left: 1rem;
1860
- }
1861
- .header-container .center-container[data-v-28759190] {
1862
- position: absolute;
1863
- left: 50%;
1864
- height: 100%;
1865
- display: flex;
1866
- align-items: center;
1867
- transform: translateX(-50%);
1868
- }
1869
- .header-container .right-container[data-v-28759190] {
1870
- position: absolute;
1871
- top: 0;
1872
- right: 0;
1873
- height: 100%;
1874
- float: right;
1875
- padding-right: 24px;
1876
- display: flex;
1877
- align-items: center;
1878
- }
1879
- .header-container .right-container .header-item[data-v-28759190]:not(:last-child) {
1880
- margin-right: 1rem;
1881
- }
1882
- .header-container .right-container .end-control-container[data-v-28759190] {
1883
- display: none;
1884
- }.overlay-container[data-v-1a02b9d3] {
1766
+ }.message-box-overlay[data-v-a24162df] {
1885
1767
  position: fixed;
1886
1768
  top: 0;
1887
1769
  bottom: 0;
1888
1770
  left: 0;
1771
+ width: 100%;
1772
+ height: 100%;
1889
1773
  right: 0;
1890
- z-index: 2007;
1891
1774
  }
1892
- .overlay-container.overlay[data-v-1a02b9d3] {
1775
+ .message-box-overlay.overlay[data-v-a24162df] {
1893
1776
  background-color: rgba(15, 16, 20, 0.6);
1894
1777
  }
1895
- .setting-container[data-v-1a02b9d3] {
1896
- width: 610px;
1897
- height: 590px;
1778
+ .tui-message-box[data-v-a24162df] {
1779
+ width: 480px;
1780
+ background-color: var(--white-color);
1898
1781
  position: absolute;
1899
1782
  top: 50%;
1900
1783
  left: 50%;
1901
1784
  transform: translate(-50%, -50%);
1902
1785
  display: flex;
1903
- background-color: #ffffff;
1904
- border-radius: 20px;
1905
1786
  flex-direction: column;
1787
+ border-radius: 20px;
1906
1788
  }
1907
- .setting-container .setting-header[data-v-1a02b9d3] {
1789
+ .tui-message-box .tui-message-box-header[data-v-a24162df] {
1908
1790
  height: 64px;
1909
- border-bottom: 1px solid rgb(235, 240, 247);
1910
- box-shadow: 0px 7px 10px -5px rgba(230, 236, 245, 0.8);
1911
- display: flex;
1912
- flex-direction: row;
1913
- justify-content: space-between;
1914
1791
  position: relative;
1792
+ display: flex;
1793
+ padding: 0 24px;
1794
+ color: var(--title-color);
1795
+ align-items: center;
1796
+ box-shadow: 0px 7px 10px -5px rgba(230, 236, 245, 0.8);
1915
1797
  }
1916
- .setting-container .setting-header .close-icon[data-v-1a02b9d3] {
1798
+ .tui-message-box .tui-message-box-header .tui-dialog-header-title[data-v-a24162df] {
1799
+ font-size: 16px;
1800
+ font-style: normal;
1801
+ font-weight: 600;
1802
+ line-height: 24px;
1803
+ color: #0f1014;
1804
+ }
1805
+ .tui-message-box .tui-message-box-header .close[data-v-a24162df] {
1917
1806
  width: 32px;
1918
1807
  height: 32px;
1919
1808
  position: absolute;
@@ -1926,54 +1815,68 @@ input[data-v-afc0a29e]:disabled {
1926
1815
  color: #4f586b;
1927
1816
  cursor: pointer;
1928
1817
  }
1929
- .setting-container .setting-header .setting-title[data-v-1a02b9d3] {
1818
+ .tui-message-box-h5[data-v-a24162df] {
1819
+ min-width: 80vw;
1820
+ max-width: 80vw;
1821
+ position: fixed;
1822
+ background-color: #ffffff;
1823
+ border-radius: 8px;
1824
+ top: 50%;
1825
+ left: 50%;
1826
+ transform: translate(-50%, -50%);
1827
+ display: flex;
1828
+ flex-direction: column;
1829
+ font-style: normal;
1830
+ color: var(--black-color);
1831
+ }
1832
+ .tui-message-box-h5 .tui-message-box-header[data-v-a24162df] {
1930
1833
  display: inline-block;
1931
- font-weight: 500;
1932
- line-height: 24px;
1933
- color: #000;
1934
- padding: 20px 0 20px 24px;
1935
1834
  font-size: 16px;
1936
- font-style: normal;
1937
- font-weight: 600;
1938
- line-height: 24px;
1939
- }
1940
- .setting-container .setting-body[data-v-1a02b9d3] {
1941
- height: 100%;
1942
- display: flex;
1835
+ text-align: center;
1836
+ font-weight: 500;
1837
+ padding-top: 14px;
1838
+ padding: 24px 24px 12px 24px;
1839
+ box-sizing: border-box;
1943
1840
  }
1944
- .setting-container .setting-body .setting-tabs[data-v-1a02b9d3] {
1945
- width: 170px;
1946
- background-color: #f0f3fa;
1947
- padding-top: 7px;
1948
- border-bottom-left-radius: 10px;
1841
+ .tui-message-box-h5 .tui-message-box-header .close[data-v-a24162df] {
1842
+ display: none;
1949
1843
  }
1950
- .setting-container .setting-body .setting-tabs .tabs-title[data-v-1a02b9d3] {
1951
- width: 100%;
1952
- height: 36px;
1953
- padding-left: 32px;
1844
+ .tui-message-box-h5 .tui-message-box-body[data-v-a24162df] {
1954
1845
  font-weight: 400;
1955
1846
  font-size: 14px;
1956
- color: #4f586b;
1957
- line-height: 36px;
1958
- position: relative;
1959
- cursor: pointer;
1960
- }
1961
- .setting-container .setting-body .setting-tabs .tabs-title.active[data-v-1a02b9d3] {
1962
- background-color: #1c66e5;
1963
- color: #fff;
1847
+ text-align: center;
1964
1848
  font-weight: 400;
1849
+ color: var(--font-color-4);
1850
+ padding: 0 24px 20px 24px;
1965
1851
  }
1966
- .setting-container .setting-body .divide-line[data-v-1a02b9d3] {
1967
- width: 1px;
1968
- height: 100%;
1969
- background: var(--divide-line-color-setting);
1852
+ .tui-message-box-h5 .tui-message-box-footer[data-v-a24162df] {
1853
+ width: 100%;
1854
+ border-top: 1px solid #d5e0f2;
1855
+ display: flex;
1856
+ justify-content: center;
1857
+ padding: 11px 0;
1970
1858
  }
1971
- .setting-container .setting-body .setting-content[data-v-1a02b9d3] {
1972
- flex-grow: 1;
1973
- padding: 16px 30px;
1859
+ .tui-message-box-h5 .tui-message-box-footer .button[data-v-a24162df] {
1860
+ background-color: #fff;
1861
+ color: var(--active-color-1);
1862
+ border: none;
1863
+ text-align: center;
1864
+ font-size: 16px;
1865
+ font-weight: 500;
1974
1866
  }
1975
- .setting-container .setting-body .setting-content .setting-tab[data-v-1a02b9d3] {
1976
- width: 100%;
1867
+ .tui-message-box-body[data-v-a24162df] {
1868
+ flex: 1;
1869
+ padding: 20px 24px;
1870
+ font-size: 14px;
1871
+ font-style: normal;
1872
+ font-weight: 400;
1873
+ line-height: 22px;
1874
+ color: #4f586b;
1875
+ }
1876
+ .tui-message-box-footer[data-v-a24162df] {
1877
+ padding: 20px 30px;
1878
+ display: flex;
1879
+ justify-content: flex-end;
1977
1880
  }.footer-container[data-v-cc1a7a3e] {
1978
1881
  position: absolute;
1979
1882
  bottom: 0;
@@ -2011,86 +1914,103 @@ input[data-v-afc0a29e]:disabled {
2011
1914
  height: 100%;
2012
1915
  display: flex;
2013
1916
  align-items: center;
2014
- }.message-enter-from[data-v-c5813be3] {
2015
- transform: translate3d(0, -75px, 0);
2016
- opacity: 0;
2017
- }
2018
- .message-enter-active[data-v-c5813be3] {
2019
- transition: all 0.3s;
1917
+ }.overlay-container[data-v-1a02b9d3] {
1918
+ position: fixed;
1919
+ top: 0;
1920
+ bottom: 0;
1921
+ left: 0;
1922
+ right: 0;
1923
+ z-index: 2007;
2020
1924
  }
2021
- .message-enter-to[data-v-c5813be3] {
2022
- transform: none;
2023
- opacity: 1;
1925
+ .overlay-container.overlay[data-v-1a02b9d3] {
1926
+ background-color: rgba(15, 16, 20, 0.6);
2024
1927
  }
2025
- .t-message[data-v-c5813be3] {
2026
- display: inline-block;
2027
- max-height: 50px;
2028
- border-radius: 8px;
2029
- padding: 10px;
1928
+ .setting-container[data-v-1a02b9d3] {
1929
+ width: 610px;
1930
+ height: 590px;
2030
1931
  position: absolute;
2031
- z-index: 9999;
1932
+ top: 50%;
2032
1933
  left: 50%;
2033
- transform: translateX(-50%);
2034
- top: 6%;
2035
- background: #f5f5f5;
2036
- color: #999;
2037
- white-space: nowrap;
1934
+ transform: translate(-50%, -50%);
1935
+ display: flex;
1936
+ background-color: #ffffff;
1937
+ border-radius: 20px;
1938
+ flex-direction: column;
2038
1939
  }
2039
- .t-message .t-message-text[data-v-c5813be3] {
2040
- vertical-align: middle;
2041
- font-size: 0.875rem;
1940
+ .setting-container .setting-header[data-v-1a02b9d3] {
1941
+ height: 64px;
1942
+ border-bottom: 1px solid rgb(235, 240, 247);
1943
+ box-shadow: 0px 7px 10px -5px rgba(230, 236, 245, 0.8);
1944
+ display: flex;
1945
+ flex-direction: row;
1946
+ justify-content: space-between;
1947
+ position: relative;
2042
1948
  }
2043
- .t-message .t-message-icon[data-v-c5813be3] {
2044
- display: inline-block;
2045
- width: 20px;
2046
- height: 20px;
2047
- background-size: cover;
2048
- margin-right: 4px;
2049
- vertical-align: middle;
1949
+ .setting-container .setting-header .close-icon[data-v-1a02b9d3] {
1950
+ width: 32px;
1951
+ height: 32px;
1952
+ position: absolute;
1953
+ top: 50%;
1954
+ transform: translateY(-50%);
1955
+ right: 20px;
1956
+ display: flex;
1957
+ justify-content: center;
1958
+ align-items: center;
1959
+ color: #4f586b;
1960
+ cursor: pointer;
2050
1961
  }
2051
- .tui-theme-white .t-message.t-message-error[data-v-c5813be3] {
2052
- color: #E04343;
2053
- background-color: #FFEBEE;
1962
+ .setting-container .setting-header .setting-title[data-v-1a02b9d3] {
1963
+ display: inline-block;
1964
+ font-weight: 500;
1965
+ line-height: 24px;
1966
+ color: #000;
1967
+ padding: 20px 0 20px 24px;
1968
+ font-size: 16px;
1969
+ font-style: normal;
1970
+ font-weight: 600;
1971
+ line-height: 24px;
2054
1972
  }
2055
- .tui-theme-black .t-message.t-message-error[data-v-c5813be3] {
2056
- color: #F46262;
2057
- background-color: #421414;
1973
+ .setting-container .setting-body[data-v-1a02b9d3] {
1974
+ height: 100%;
1975
+ display: flex;
2058
1976
  }
2059
- .tui-theme-white .t-message.t-message-success[data-v-c5813be3] {
2060
- color: #00B89C;
2061
- background-color: #EBFFFA;
1977
+ .setting-container .setting-body .setting-tabs[data-v-1a02b9d3] {
1978
+ width: 170px;
1979
+ background-color: #f0f3fa;
1980
+ padding-top: 7px;
1981
+ border-bottom-left-radius: 10px;
2062
1982
  }
2063
- .tui-theme-black .t-message.t-message-success[data-v-c5813be3] {
2064
- color: #1CEACB;
2065
- background-color: #19423C;
1983
+ .setting-container .setting-body .setting-tabs .tabs-title[data-v-1a02b9d3] {
1984
+ width: 100%;
1985
+ height: 36px;
1986
+ padding-left: 32px;
1987
+ font-weight: 400;
1988
+ font-size: 14px;
1989
+ color: #4f586b;
1990
+ line-height: 36px;
1991
+ position: relative;
1992
+ cursor: pointer;
2066
1993
  }
2067
- .tui-theme-white .t-message.t-message-warning[data-v-c5813be3] {
2068
- color: #E59753;
2069
- background-color: #FFF4EB;
1994
+ .setting-container .setting-body .setting-tabs .tabs-title.active[data-v-1a02b9d3] {
1995
+ background-color: #1c66e5;
1996
+ color: #fff;
1997
+ font-weight: 400;
2070
1998
  }
2071
- .tui-theme-black .t-message.t-message-warning[data-v-c5813be3] {
2072
- color: #FFAD66;
2073
- background-color: #3F2712;
1999
+ .setting-container .setting-body .divide-line[data-v-1a02b9d3] {
2000
+ width: 1px;
2001
+ height: 100%;
2002
+ background: var(--divide-line-color-setting);
2074
2003
  }
2075
- .tui-theme-white .t-message.t-message-info[data-v-c5813be3] {
2076
- color: #494F6A;
2077
- background-color: #EBF2FF;
2004
+ .setting-container .setting-body .setting-content[data-v-1a02b9d3] {
2005
+ flex-grow: 1;
2006
+ padding: 16px 30px;
2078
2007
  }
2079
- .tui-theme-black .t-message.t-message-info[data-v-c5813be3] {
2080
- color: #DCE7FA;
2081
- background-color: #4A506B;
2082
- }.avatar-container[data-v-94a403fe] {
2083
- position: relative;
2008
+ .setting-container .setting-body .setting-content .setting-tab[data-v-1a02b9d3] {
2084
2009
  width: 100%;
2085
- height: 100%;
2086
- }
2087
- .avatar-container .avatar[data-v-94a403fe] {
2088
- position: absolute;
2089
- top: 0;
2090
- left: 0;
2091
- border-radius: 50%;
2010
+ }.content-container[data-v-62c87292] {
2092
2011
  width: 100%;
2093
2012
  height: 100%;
2013
+ overflow: hidden;
2094
2014
  }.tui-theme-black .layout-container[data-v-7afa85d3] {
2095
2015
  --background-color: var(--background-color-2);
2096
2016
  --box-shadow: 0px 0px 40px rgba(23, 25, 31, 0.60), 0px 0px 12px rgba(23, 25, 31, 0.40);
@@ -2228,6 +2148,8 @@ input[data-v-afc0a29e]:disabled {
2228
2148
  background-color: var(--block-background-color);
2229
2149
  border-bottom-left-radius: 4px;
2230
2150
  border-bottom-right-radius: 4px;
2151
+ }.cancel-button[data-v-986f8b0b] {
2152
+ margin-left: 20px;
2231
2153
  }.tui-theme-white .network-info-board[data-v-4b8a18b9] {
2232
2154
  --title-font-color: var(--font-color-1);
2233
2155
  --item-font-color: var(--font-color-6);
@@ -2291,324 +2213,274 @@ input[data-v-afc0a29e]:disabled {
2291
2213
  }
2292
2214
  .network-info-container .title-type-info[data-v-4b8a18b9] {
2293
2215
  color: #4F586B;
2294
- }.audio-setting-tab[data-v-31046864] {
2295
- border-radius: 4px;
2296
- font-size: 14px;
2216
+ }.avatar-container[data-v-94a403fe] {
2217
+ position: relative;
2297
2218
  width: 100%;
2219
+ height: 100%;
2298
2220
  }
2299
- .audio-setting-tab .item-setting[data-v-31046864] {
2221
+ .avatar-container .avatar[data-v-94a403fe] {
2222
+ position: absolute;
2223
+ top: 0;
2224
+ left: 0;
2225
+ border-radius: 50%;
2300
2226
  width: 100%;
2227
+ height: 100%;
2228
+ }.video-control-container[data-v-4da95364] {
2229
+ position: relative;
2301
2230
  }
2302
- .audio-setting-tab .item-setting[data-v-31046864]:not(:last-child) {
2303
- margin-bottom: 20px;
2231
+ .video-control-container .video-tab[data-v-4da95364] {
2232
+ position: absolute;
2233
+ bottom: 90px;
2234
+ left: -60px;
2235
+ width: 320px;
2236
+ background: var(--room-videotab-bg-color);
2237
+ padding: 20px;
2304
2238
  }
2305
- .audio-setting-tab .flex[data-v-31046864] {
2306
- width: 100%;
2239
+ .agree[data-v-4da95364], .cancel[data-v-4da95364] {
2240
+ padding: 14px;
2241
+ width: 50%;
2307
2242
  display: flex;
2243
+ align-items: center;
2244
+ justify-content: center;
2245
+ color: var(--active-color-1);
2246
+ font-size: 16px;
2247
+ font-weight: 500;
2308
2248
  }
2309
- .audio-setting-tab .select[data-v-31046864] {
2310
- flex: 1;
2249
+ .cancel[data-v-4da95364] {
2250
+ color: var(--font-color-4);
2311
2251
  }
2312
- .audio-setting-tab .button[data-v-31046864] {
2313
- margin-left: 10px;
2314
- padding: 5px 23px;
2315
- width: 74px;
2252
+ .cancel-button[data-v-4da95364] {
2253
+ margin-left: 20px;
2254
+ }.invite-container[data-v-c6f331a2] {
2255
+ position: fixed;
2256
+ left: 0;
2257
+ top: 0;
2258
+ bottom: 0;
2259
+ width: 100vw;
2260
+ height: auto;
2261
+ box-sizing: border-box;
2262
+ background-color: var(--log-out-mobile);
2263
+ z-index: 1;
2264
+ }.chat-container[data-v-c0b1c904] {
2265
+ display: flex;
2266
+ flex-direction: column;
2267
+ height: 100%;
2268
+ padding: 20px;
2316
2269
  }
2317
- .audio-setting-tab .title[data-v-31046864] {
2318
- display: inline-block;
2319
- margin-bottom: 8px;
2320
- width: 100%;
2321
- color: #4f586b;
2322
- font-size: 14px;
2323
- font-weight: 400;
2324
- line-height: 22px;
2270
+ .chat-container-h5[data-v-c0b1c904] {
2271
+ height: 100%;
2272
+ }.tui-theme-black .search-container[data-v-392914b8] {
2273
+ --background-color: rgba(79, 88, 107, 0.30);
2274
+ --font-color: #636A7E;
2325
2275
  }
2326
- .audio-setting-tab .mic-bar-container[data-v-31046864] {
2327
- display: flex;
2328
- justify-content: space-between;
2276
+ .tui-theme-white .search-container[data-v-392914b8] {
2277
+ --background-color: var(--background-color-3);
2278
+ --font-color: var(--font-color-1);
2329
2279
  }
2330
- .audio-setting-tab .mic-bar-container .mic-bar[data-v-31046864] {
2331
- width: 3px;
2332
- height: 6px;
2333
- background-color: var(--background-color-4);
2280
+ .manage-member-container[data-v-392914b8] {
2281
+ position: relative;
2282
+ height: 100%;
2283
+ display: flex;
2284
+ flex-direction: column;
2334
2285
  }
2335
- .audio-setting-tab .mic-bar-container .mic-bar.active[data-v-31046864] {
2336
- background-color: var(--green-color);
2286
+ .manage-member-container .manage-member-header[data-v-392914b8] {
2287
+ padding: 23px 20px 0 20px;
2288
+ display: flex;
2289
+ justify-content: space-around;
2337
2290
  }
2338
- .audio-setting-tab .audio-level-container[data-v-31046864] {
2339
- width: 100%;
2340
- height: 20px;
2291
+ .manage-member-container .manage-member-header .search-container[data-v-392914b8] {
2292
+ height: 32px;
2293
+ border-radius: 16px;
2294
+ padding: 0 16px;
2295
+ background-color: var(--background-color);
2296
+ color: var(--font-color-1);
2341
2297
  display: flex;
2298
+ align-items: center;
2299
+ flex: 1;
2342
2300
  }
2343
- .audio-setting-tab .audio-level-container .slider[data-v-31046864] {
2344
- height: 20px;
2345
- margin-left: 10px;
2346
- }.video-tab[data-v-6e09e806] {
2347
- border-radius: 8px;
2301
+ .manage-member-container .manage-member-header .search-container .search-input[data-v-392914b8] {
2302
+ margin-left: 8px;
2348
2303
  font-size: 14px;
2304
+ outline: none;
2305
+ border: none;
2306
+ background: none;
2307
+ width: 100%;
2308
+ color: var(--font-color-1);
2349
2309
  }
2350
- .video-tab .item-setting[data-v-6e09e806]:not(:last-child) {
2351
- margin-bottom: 20px;
2310
+ .manage-member-container .manage-member-header .invite-button[data-v-392914b8] {
2311
+ width: 85px;
2312
+ height: 32px;
2313
+ margin-left: 10px;
2314
+ line-height: 16px;
2352
2315
  }
2353
- .video-tab .title[data-v-6e09e806] {
2354
- display: inline-block;
2355
- margin-bottom: 8px;
2356
- width: 100%;
2357
- color: var(--font-color-4);
2358
- font-size: 14px;
2359
- font-weight: 400;
2360
- line-height: 22px;
2316
+ .manage-member-container .manage-member-header .invite-button .invite-content[data-v-392914b8] {
2317
+ margin-left: 3px;
2361
2318
  }
2362
- .video-tab .video-preview-container[data-v-6e09e806] {
2319
+ .manage-member-container .apply-count[data-v-392914b8] {
2320
+ height: 36px;
2321
+ border-radius: 20px;
2322
+ margin: 16px 20px 0 20px;
2323
+ background-color: var(--background-color-11);
2363
2324
  position: relative;
2364
- width: 100%;
2365
- height: 0;
2366
- padding-top: 56.25%;
2367
- background-color: #000000;
2368
- border-radius: 8px;
2369
- overflow: hidden;
2325
+ display: flex;
2326
+ cursor: pointer;
2370
2327
  }
2371
- .video-tab .video-preview-container .video-preview[data-v-6e09e806] {
2328
+ .manage-member-container .apply-count .apply-staged[data-v-392914b8],
2329
+ .manage-member-container .apply-count .apply-not-stage[data-v-392914b8] {
2372
2330
  position: absolute;
2373
- top: 0;
2374
2331
  left: 0;
2375
- width: 100%;
2376
- height: 100%;
2377
- }
2378
- .video-tab .mirror-container[data-v-6e09e806] {
2332
+ top: 3px;
2333
+ width: 50%;
2334
+ height: 80%;
2335
+ filter: drop-shadow(0px 2px 4px rgba(32, 77, 141, 0.03)) drop-shadow(0px 6px 10px rgba(32, 77, 141, 0.06)) drop-shadow(0px 3px 14px rgba(32, 77, 141, 0.05));
2336
+ border-radius: 20px;
2337
+ transform: translateX(4px);
2379
2338
  display: flex;
2380
- justify-content: space-between;
2381
- align-items: center;
2382
- color: var(--font-color-4);
2339
+ justify-content: center;
2340
+ align-content: center;
2341
+ flex-wrap: wrap;
2342
+ color: var(--font-color-1);
2383
2343
  font-size: 14px;
2384
- font-style: normal;
2385
2344
  font-weight: 400;
2386
- line-height: 22px;
2387
- padding-right: 2px;
2388
2345
  }
2389
- .video-tab .item[data-v-6e09e806] {
2390
- width: 100%;
2391
- height: 20px;
2392
- cursor: pointer;
2393
- color: var(--font-color-3);
2394
- }.stream-container-flatten[data-v-d8433998] {
2395
- width: 100%;
2396
- height: 100%;
2397
- overflow: hidden;
2398
- padding: 25px 20px;
2346
+ .manage-member-container .apply-count .apply-not-stage[data-v-392914b8] {
2347
+ top: 50%;
2348
+ left: 50%;
2349
+ width: 176px;
2350
+ height: 30px;
2351
+ transform: translateY(-50%);
2399
2352
  }
2400
- .stream-container-flatten .stream-list-container[data-v-d8433998] {
2401
- width: 100%;
2402
- height: 100%;
2403
- display: flex;
2404
- justify-content: center;
2405
- align-content: center;
2353
+ .manage-member-container .apply-count .apply-count-active[data-v-392914b8] {
2354
+ background-color: var(--background-color-12);
2406
2355
  }
2407
- .stream-container-flatten .stream-list[data-v-d8433998] {
2356
+ .manage-member-container .apply-on-stage-info[data-v-392914b8] {
2357
+ width: 100%;
2358
+ height: 60px;
2359
+ background-color: var(--background-color-8);
2360
+ padding: 0 20px 0 32px;
2408
2361
  display: flex;
2409
- flex-wrap: wrap;
2410
- justify-content: center;
2362
+ justify-content: space-between;
2411
2363
  align-items: center;
2412
- align-content: center;
2413
- }
2414
- .stream-container-flatten .stream-list .single-stream[data-v-d8433998] {
2415
- margin: 4px;
2364
+ position: relative;
2416
2365
  }
2417
- .arrow-stroke-right[data-v-d8433998] {
2418
- position: absolute;
2419
- right: 280px;
2420
- top: 0;
2366
+ .manage-member-container .apply-on-stage-info .apply-icon[data-v-392914b8] {
2367
+ color: var(--font-color-2);
2421
2368
  }
2422
- .arrow-stroke-left[data-v-d8433998] {
2423
- position: absolute;
2424
- right: 12px;
2425
- top: 0;
2369
+ .manage-member-container .apply-on-stage-info .apply-info[data-v-392914b8] {
2370
+ font-weight: 400;
2371
+ font-size: 14px;
2372
+ color: var(--font-color-8);
2373
+ padding-left: 4px;
2374
+ flex: 1;
2426
2375
  }
2427
- .arrow-stroke-up[data-v-d8433998] {
2428
- position: absolute;
2429
- top: 175px;
2430
- left: 0;
2376
+ .manage-member-container .apply-on-stage-info .apply-check[data-v-392914b8] {
2377
+ text-align: center;
2378
+ line-height: 32px;
2379
+ font-weight: 400;
2380
+ font-size: 14px;
2381
+ color: var(--active-color-2);
2382
+ cursor: pointer;
2431
2383
  }
2432
- .arrow-stroke-down[data-v-d8433998] {
2384
+ .manage-member-container .apply-on-stage-info[data-v-392914b8]::after {
2385
+ content: "";
2433
2386
  position: absolute;
2434
- top: 76px;
2435
- left: 0;
2387
+ left: 5%;
2388
+ bottom: 0;
2389
+ width: 90%;
2390
+ height: 1px;
2391
+ background-color: var(--stroke-color-2);
2436
2392
  }
2437
- .stream-container-top[data-v-d8433998] {
2438
- width: 100%;
2439
- height: 100%;
2440
- overflow: hidden;
2441
- position: relative;
2393
+ .manage-member-container .member-list-container[data-v-392914b8] {
2394
+ flex: 1;
2395
+ margin-top: 10px;
2396
+ overflow-y: scroll;
2442
2397
  }
2443
- .stream-container-top .enlarged-stream-container[data-v-d8433998] {
2444
- width: 100%;
2445
- height: calc(100% - 184px);
2446
- padding: 25px 20px;
2447
- position: absolute;
2448
- top: 175px;
2449
- display: flex;
2450
- justify-content: center;
2451
- align-items: center;
2398
+ .manage-member-container .member-list-container[data-v-392914b8]::-webkit-scrollbar {
2399
+ display: none;
2452
2400
  }
2453
- .stream-container-top .stream-list-container[data-v-d8433998] {
2454
- width: 100%;
2455
- height: 175px;
2456
- position: absolute;
2457
- top: 0;
2458
- left: 0;
2459
- padding: 20px 40px;
2401
+ .manage-member-container .global-setting[data-v-392914b8] {
2460
2402
  display: flex;
2461
- justify-content: center;
2403
+ justify-content: space-around;
2404
+ margin: 20px;
2462
2405
  }
2463
- .stream-container-top .stream-list-container.hide-list[data-v-d8433998] {
2464
- transform: translateY(-166px);
2406
+ .cancel-button[data-v-392914b8] {
2407
+ margin-left: 12px;
2408
+ }.invite-container[data-v-6414c67c] {
2409
+ padding: 20px;
2465
2410
  }
2466
- .stream-container-top .stream-list-container .stream-list[data-v-d8433998] {
2411
+ .invite-container .invite-item[data-v-6414c67c] {
2467
2412
  display: flex;
2468
- overflow-x: scroll;
2469
- max-width: 100%;
2470
- max-height: 100%;
2471
- scrollbar-width: none;
2472
- -ms-overflow-style: none;
2413
+ flex-direction: column;
2414
+ position: relative;
2473
2415
  }
2474
- .stream-container-top .stream-list-container .stream-list[data-v-d8433998]::-webkit-scrollbar {
2475
- display: none;
2476
- }
2477
- .stream-container-top .stream-list-container .stream-list .single-stream[data-v-d8433998] {
2478
- width: 240px;
2479
- height: 135px;
2480
- border-radius: 8px;
2481
- overflow: hidden;
2482
- flex-shrink: 0;
2483
- }
2484
- .stream-container-top .stream-list-container .stream-list .single-stream[data-v-d8433998]:not(:first-child) {
2485
- margin-left: 14px;
2416
+ .invite-container .invite-item[data-v-6414c67c]:not(:first-child) {
2417
+ margin-top: 20px;
2486
2418
  }
2487
- .stream-container-right[data-v-d8433998] {
2419
+ .invite-container .invite-item .invite-title[data-v-6414c67c] {
2420
+ font-size: 14px;
2421
+ font-weight: 400;
2422
+ line-height: 22px;
2423
+ color: var(--font-color-5);
2488
2424
  width: 100%;
2489
- height: 100%;
2425
+ padding-bottom: 8px;
2426
+ }
2427
+ .invite-container .invite-item .invite-content[data-v-6414c67c] {
2428
+ flex: 1;
2429
+ background-color: var(--background-color-7);
2430
+ border-radius: 8px;
2431
+ border: 1px solid var(--border-color);
2432
+ box-sizing: border-box;
2433
+ color: var(--font-color-6);
2434
+ display: inline-block;
2435
+ font-size: 14px;
2436
+ height: 42px;
2437
+ font-weight: 500;
2438
+ line-height: 22px;
2439
+ outline: none;
2440
+ padding: 10px 30px 10px 16px;
2441
+ transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
2490
2442
  overflow: hidden;
2491
- display: flex;
2492
- flex-wrap: nowrap;
2493
- justify-content: space-between;
2494
- align-content: center;
2443
+ text-overflow: ellipsis;
2444
+ white-space: nowrap;
2495
2445
  position: relative;
2496
2446
  }
2497
- .stream-container-right .enlarged-stream-container[data-v-d8433998] {
2498
- width: calc(100% - 280px);
2499
- height: 100%;
2500
- padding: 25px 20px;
2447
+ .invite-container .invite-item .copy-icon[data-v-6414c67c] {
2501
2448
  display: flex;
2502
- justify-content: center;
2503
2449
  align-items: center;
2504
- }
2505
- .stream-container-right .stream-list-container[data-v-d8433998] {
2506
- width: 280px;
2507
- height: 100%;
2450
+ justify-content: center;
2451
+ width: 32px;
2452
+ height: 32px;
2453
+ cursor: pointer;
2508
2454
  position: absolute;
2509
- top: 0;
2455
+ top: 36px;
2510
2456
  right: 0;
2457
+ }.more-container[data-v-acb09f87] {
2511
2458
  padding: 20px;
2512
- display: flex;
2513
- align-items: center;
2514
- }
2515
- .stream-container-right .stream-list-container.hide-list[data-v-d8433998] {
2516
- transform: translateX(270px);
2517
2459
  }
2518
- .stream-container-right .stream-list-container[data-v-d8433998]::before {
2519
- content: "";
2520
- width: 100%;
2521
- height: 40px;
2522
- position: absolute;
2523
- top: 10px;
2524
- left: 0;
2525
- opacity: 0.1;
2526
- }
2527
- .stream-container-right .stream-list[data-v-d8433998] {
2528
- max-width: 100%;
2529
- max-height: 100%;
2530
- overflow-y: scroll;
2531
- padding: 10px 0;
2532
- scrollbar-width: none;
2533
- -ms-overflow-style: none;
2534
- }
2535
- .stream-container-right .stream-list[data-v-d8433998]::-webkit-scrollbar {
2536
- display: none;
2537
- }
2538
- .stream-container-right .stream-list .single-stream[data-v-d8433998] {
2539
- width: 240px;
2540
- height: 135px;
2541
- border-radius: 8px;
2542
- overflow: hidden;
2543
- }
2544
- .stream-container-right .stream-list .single-stream[data-v-d8433998]:not(:first-child) {
2545
- margin-top: 14px;
2546
- }
2547
- .tui-theme-black .turn-page-container[data-v-d8433998] {
2548
- --turn-page-background-color: rgba(114, 122, 138, 0.4);
2549
- --turn-page-hover-background-color: rgba(114, 122, 138, 0.7);
2550
- --turn-page-arrow-color: #D5E0F2;
2551
- }
2552
- .tui-theme-white .turn-page-container[data-v-d8433998] {
2553
- --turn-page-background-color: rgba(114, 122, 138, 0.4);
2554
- --turn-page-hover-background-color: rgba(114, 122, 138, 0.7);
2555
- --turn-page-arrow-color: white;
2556
- }
2557
- .turn-page-container[data-v-d8433998] {
2558
- width: 100%;
2559
- height: 60px;
2560
- position: absolute;
2561
- left: 0;
2562
- top: 50%;
2563
- transform: translateY(-50%);
2564
- display: flex;
2565
- justify-content: space-between;
2566
- }
2567
- .turn-page-container .turn-page-arrow-container[data-v-d8433998] {
2568
- width: 32px;
2569
- height: 60px;
2570
- background: var(--turn-page-background-color);
2571
- backdrop-filter: blur(2.25px);
2572
- border-radius: 32px;
2460
+ .more-container .more-title[data-v-acb09f87] {
2573
2461
  display: flex;
2574
- justify-content: center;
2575
- align-items: center;
2576
- cursor: pointer;
2577
- color: var(--turn-page-arrow-color);
2578
- }
2579
- .turn-page-container .turn-page-arrow-container[data-v-d8433998]:hover {
2580
- background: var(--turn-page-hover-background-color);
2581
- }
2582
- .turn-page-container .left-container[data-v-d8433998] {
2583
- position: absolute;
2584
- left: 34px;
2585
- }
2586
- .turn-page-container .right-container[data-v-d8433998] {
2587
- position: absolute;
2588
- right: 34px;
2589
2462
  }
2590
- .turn-page-container .turn-page-right[data-v-d8433998] {
2591
- transform: rotateY(180deg);
2592
- }.chat-container[data-v-c0b1c904] {
2593
- display: flex;
2594
- flex-direction: column;
2595
- height: 100%;
2596
- padding: 20px;
2463
+ .more-container .more-title .email-icon[data-v-acb09f87] {
2464
+ color: #7c85a6;
2597
2465
  }
2598
- .chat-container-h5[data-v-c0b1c904] {
2599
- height: 100%;
2600
- }.invite-container[data-v-6414c67c] {
2601
- padding: 20px;
2466
+ .more-container .more-title .more-notice[data-v-acb09f87] {
2467
+ font-size: 14px;
2468
+ width: 100%;
2469
+ height: 22px;
2470
+ line-height: 22px;
2471
+ font-weight: 400;
2472
+ color: var(--font-color-5);
2473
+ padding-left: 8px;
2602
2474
  }
2603
- .invite-container .invite-item[data-v-6414c67c] {
2475
+ .more-container .more-item[data-v-acb09f87] {
2604
2476
  display: flex;
2605
2477
  flex-direction: column;
2606
2478
  position: relative;
2607
2479
  }
2608
- .invite-container .invite-item[data-v-6414c67c]:not(:first-child) {
2480
+ .more-container .more-item[data-v-acb09f87]:not(:first-child) {
2609
2481
  margin-top: 20px;
2610
2482
  }
2611
- .invite-container .invite-item .invite-title[data-v-6414c67c] {
2483
+ .more-container .more-item:not(:first-child) .item-title[data-v-acb09f87] {
2612
2484
  font-size: 14px;
2613
2485
  font-weight: 400;
2614
2486
  line-height: 22px;
@@ -2616,7 +2488,11 @@ input[data-v-afc0a29e]:disabled {
2616
2488
  width: 100%;
2617
2489
  padding-bottom: 8px;
2618
2490
  }
2619
- .invite-container .invite-item .invite-content[data-v-6414c67c] {
2491
+ .more-container .more-item:not(:first-child) .join-button[data-v-acb09f87] {
2492
+ height: 42px;
2493
+ font-weight: 600;
2494
+ }
2495
+ .more-container .more-item:not(:first-child) .more-content[data-v-acb09f87] {
2620
2496
  flex: 1;
2621
2497
  background-color: var(--background-color-7);
2622
2498
  border-radius: 8px;
@@ -2636,7 +2512,7 @@ input[data-v-afc0a29e]:disabled {
2636
2512
  white-space: nowrap;
2637
2513
  position: relative;
2638
2514
  }
2639
- .invite-container .invite-item .copy-icon[data-v-6414c67c] {
2515
+ .more-container .more-item:not(:first-child) .copy-icon[data-v-acb09f87] {
2640
2516
  display: flex;
2641
2517
  align-items: center;
2642
2518
  justify-content: center;
@@ -2646,263 +2522,59 @@ input[data-v-afc0a29e]:disabled {
2646
2522
  position: absolute;
2647
2523
  top: 36px;
2648
2524
  right: 0;
2649
- }.tui-theme-black .search-container[data-v-392914b8] {
2650
- --background-color: rgba(79, 88, 107, 0.30);
2651
- --font-color: #636A7E;
2525
+ }.tui-theme-white .roomInfo-container[data-v-c47b43e3] {
2526
+ --title-font-color: var(--font-color-1);
2527
+ --item-font-color: var(--font-color-6);
2528
+ --filter-color: drop-shadow(0px 0px 4px rgba(32, 77, 141, 0.03)) drop-shadow(0px 4px 10px rgba(32, 77, 141, 0.06))
2529
+ drop-shadow(0px 1px 14px rgba(32, 77, 141, 0.05));
2652
2530
  }
2653
- .tui-theme-white .search-container[data-v-392914b8] {
2654
- --background-color: var(--background-color-3);
2655
- --font-color: var(--font-color-1);
2531
+ .tui-theme-black .roomInfo-container[data-v-c47b43e3] {
2532
+ --title-font-color: #8f9ab2;
2533
+ --item-font-color: var(--font-color-1);
2534
+ --filter-color: drop-shadow(0px 8px 40px rgba(23, 25, 31, 0.6)) drop-shadow(0px 4px 12px rgba(23, 25, 31, 0.4));
2656
2535
  }
2657
- .manage-member-container[data-v-392914b8] {
2536
+ .conference-container[data-v-c47b43e3] {
2537
+ min-width: 140px;
2658
2538
  position: relative;
2659
- height: 100%;
2660
- display: flex;
2661
- flex-direction: column;
2662
2539
  }
2663
- .manage-member-container .manage-member-header[data-v-392914b8] {
2664
- padding: 23px 20px 0 20px;
2540
+ .title-container[data-v-c47b43e3] {
2665
2541
  display: flex;
2666
- justify-content: space-around;
2542
+ align-items: center;
2543
+ padding: 20px 0;
2544
+ font-size: 16px;
2545
+ font-style: normal;
2546
+ font-weight: 500;
2547
+ line-height: 24px;
2548
+ cursor: pointer;
2667
2549
  }
2668
- .manage-member-container .manage-member-header .search-container[data-v-392914b8] {
2669
- height: 32px;
2670
- border-radius: 16px;
2671
- padding: 0 16px;
2672
- background-color: var(--background-color);
2673
- color: var(--font-color-1);
2550
+ .arrow-icon[data-v-c47b43e3] {
2674
2551
  display: flex;
2552
+ margin-left: 5px;
2553
+ background-size: cover;
2554
+ width: 16px;
2555
+ height: 16px;
2675
2556
  align-items: center;
2676
- flex: 1;
2677
- }
2678
- .manage-member-container .manage-member-header .search-container .search-input[data-v-392914b8] {
2679
- margin-left: 8px;
2680
- font-size: 14px;
2681
- outline: none;
2682
- border: none;
2683
- background: none;
2684
- width: 100%;
2685
- color: var(--font-color-1);
2557
+ transform: rotateX(180deg);
2686
2558
  }
2687
- .manage-member-container .manage-member-header .invite-button[data-v-392914b8] {
2688
- width: 85px;
2689
- height: 32px;
2690
- margin-left: 10px;
2691
- line-height: 16px;
2559
+ .arrow-down-icon[data-v-c47b43e3] {
2560
+ transform: rotateX(0);
2692
2561
  }
2693
- .manage-member-container .manage-member-header .invite-button .invite-content[data-v-392914b8] {
2694
- margin-left: 3px;
2562
+ .room-timing[data-v-c47b43e3] {
2563
+ padding-left: 12px;
2695
2564
  }
2696
- .manage-member-container .apply-count[data-v-392914b8] {
2697
- height: 36px;
2698
- border-radius: 20px;
2699
- margin: 16px 20px 0 20px;
2700
- background-color: var(--background-color-11);
2701
- position: relative;
2565
+ .roomInfo-container[data-v-c47b43e3] {
2566
+ position: absolute;
2567
+ left: 50%;
2568
+ top: calc(100% - 12px);
2569
+ transform: translateX(-50%);
2570
+ padding: 20px;
2571
+ box-sizing: border-box;
2572
+ background-color: var(--background-color-2);
2573
+ border-radius: 16px;
2574
+ filter: var(--filter-color);
2702
2575
  display: flex;
2703
- cursor: pointer;
2704
- }
2705
- .manage-member-container .apply-count .apply-staged[data-v-392914b8],
2706
- .manage-member-container .apply-count .apply-not-stage[data-v-392914b8] {
2707
- position: absolute;
2708
- left: 0;
2709
- top: 3px;
2710
- width: 50%;
2711
- height: 80%;
2712
- filter: drop-shadow(0px 2px 4px rgba(32, 77, 141, 0.03)) drop-shadow(0px 6px 10px rgba(32, 77, 141, 0.06)) drop-shadow(0px 3px 14px rgba(32, 77, 141, 0.05));
2713
- border-radius: 20px;
2714
- transform: translateX(4px);
2715
- display: flex;
2716
- justify-content: center;
2717
- align-content: center;
2718
- flex-wrap: wrap;
2719
- color: var(--font-color-1);
2720
- font-size: 14px;
2721
- font-weight: 400;
2722
- }
2723
- .manage-member-container .apply-count .apply-not-stage[data-v-392914b8] {
2724
- top: 50%;
2725
- left: 50%;
2726
- width: 176px;
2727
- height: 30px;
2728
- transform: translateY(-50%);
2729
- }
2730
- .manage-member-container .apply-count .apply-count-active[data-v-392914b8] {
2731
- background-color: var(--background-color-12);
2732
- }
2733
- .manage-member-container .apply-on-stage-info[data-v-392914b8] {
2734
- width: 100%;
2735
- height: 60px;
2736
- background-color: var(--background-color-8);
2737
- padding: 0 20px 0 32px;
2738
- display: flex;
2739
- justify-content: space-between;
2740
- align-items: center;
2741
- position: relative;
2742
- }
2743
- .manage-member-container .apply-on-stage-info .apply-icon[data-v-392914b8] {
2744
- color: var(--font-color-2);
2745
- }
2746
- .manage-member-container .apply-on-stage-info .apply-info[data-v-392914b8] {
2747
- font-weight: 400;
2748
- font-size: 14px;
2749
- color: var(--font-color-8);
2750
- padding-left: 4px;
2751
- flex: 1;
2752
- }
2753
- .manage-member-container .apply-on-stage-info .apply-check[data-v-392914b8] {
2754
- text-align: center;
2755
- line-height: 32px;
2756
- font-weight: 400;
2757
- font-size: 14px;
2758
- color: var(--active-color-2);
2759
- cursor: pointer;
2760
- }
2761
- .manage-member-container .apply-on-stage-info[data-v-392914b8]::after {
2762
- content: "";
2763
- position: absolute;
2764
- left: 5%;
2765
- bottom: 0;
2766
- width: 90%;
2767
- height: 1px;
2768
- background-color: var(--stroke-color-2);
2769
- }
2770
- .manage-member-container .member-list-container[data-v-392914b8] {
2771
- flex: 1;
2772
- margin-top: 10px;
2773
- overflow-y: scroll;
2774
- }
2775
- .manage-member-container .member-list-container[data-v-392914b8]::-webkit-scrollbar {
2776
- display: none;
2777
- }
2778
- .manage-member-container .global-setting[data-v-392914b8] {
2779
- display: flex;
2780
- justify-content: space-around;
2781
- margin: 20px;
2782
- }
2783
- .cancel-button[data-v-392914b8] {
2784
- margin-left: 12px;
2785
- }.more-container[data-v-acb09f87] {
2786
- padding: 20px;
2787
- }
2788
- .more-container .more-title[data-v-acb09f87] {
2789
- display: flex;
2790
- }
2791
- .more-container .more-title .email-icon[data-v-acb09f87] {
2792
- color: #7c85a6;
2793
- }
2794
- .more-container .more-title .more-notice[data-v-acb09f87] {
2795
- font-size: 14px;
2796
- width: 100%;
2797
- height: 22px;
2798
- line-height: 22px;
2799
- font-weight: 400;
2800
- color: var(--font-color-5);
2801
- padding-left: 8px;
2802
- }
2803
- .more-container .more-item[data-v-acb09f87] {
2804
- display: flex;
2805
- flex-direction: column;
2806
- position: relative;
2807
- }
2808
- .more-container .more-item[data-v-acb09f87]:not(:first-child) {
2809
- margin-top: 20px;
2810
- }
2811
- .more-container .more-item:not(:first-child) .item-title[data-v-acb09f87] {
2812
- font-size: 14px;
2813
- font-weight: 400;
2814
- line-height: 22px;
2815
- color: var(--font-color-5);
2816
- width: 100%;
2817
- padding-bottom: 8px;
2818
- }
2819
- .more-container .more-item:not(:first-child) .join-button[data-v-acb09f87] {
2820
- height: 42px;
2821
- font-weight: 600;
2822
- }
2823
- .more-container .more-item:not(:first-child) .more-content[data-v-acb09f87] {
2824
- flex: 1;
2825
- background-color: var(--background-color-7);
2826
- border-radius: 8px;
2827
- border: 1px solid var(--border-color);
2828
- box-sizing: border-box;
2829
- color: var(--font-color-6);
2830
- display: inline-block;
2831
- font-size: 14px;
2832
- height: 42px;
2833
- font-weight: 500;
2834
- line-height: 22px;
2835
- outline: none;
2836
- padding: 10px 30px 10px 16px;
2837
- transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
2838
- overflow: hidden;
2839
- text-overflow: ellipsis;
2840
- white-space: nowrap;
2841
- position: relative;
2842
- }
2843
- .more-container .more-item:not(:first-child) .copy-icon[data-v-acb09f87] {
2844
- display: flex;
2845
- align-items: center;
2846
- justify-content: center;
2847
- width: 32px;
2848
- height: 32px;
2849
- cursor: pointer;
2850
- position: absolute;
2851
- top: 36px;
2852
- right: 0;
2853
- }.tui-theme-white .roomInfo-container[data-v-c47b43e3] {
2854
- --title-font-color: var(--font-color-1);
2855
- --item-font-color: var(--font-color-6);
2856
- --filter-color: drop-shadow(0px 0px 4px rgba(32, 77, 141, 0.03)) drop-shadow(0px 4px 10px rgba(32, 77, 141, 0.06))
2857
- drop-shadow(0px 1px 14px rgba(32, 77, 141, 0.05));
2858
- }
2859
- .tui-theme-black .roomInfo-container[data-v-c47b43e3] {
2860
- --title-font-color: #8f9ab2;
2861
- --item-font-color: var(--font-color-1);
2862
- --filter-color: drop-shadow(0px 8px 40px rgba(23, 25, 31, 0.6)) drop-shadow(0px 4px 12px rgba(23, 25, 31, 0.4));
2863
- }
2864
- .conference-container[data-v-c47b43e3] {
2865
- min-width: 140px;
2866
- position: relative;
2867
- }
2868
- .title-container[data-v-c47b43e3] {
2869
- display: flex;
2870
- align-items: center;
2871
- padding: 20px 0;
2872
- font-size: 16px;
2873
- font-style: normal;
2874
- font-weight: 500;
2875
- line-height: 24px;
2876
- cursor: pointer;
2877
- }
2878
- .arrow-icon[data-v-c47b43e3] {
2879
- display: flex;
2880
- margin-left: 5px;
2881
- background-size: cover;
2882
- width: 16px;
2883
- height: 16px;
2884
- align-items: center;
2885
- transform: rotateX(180deg);
2886
- }
2887
- .arrow-down-icon[data-v-c47b43e3] {
2888
- transform: rotateX(0);
2889
- }
2890
- .room-timing[data-v-c47b43e3] {
2891
- padding-left: 12px;
2892
- }
2893
- .roomInfo-container[data-v-c47b43e3] {
2894
- position: absolute;
2895
- left: 50%;
2896
- top: calc(100% - 12px);
2897
- transform: translateX(-50%);
2898
- padding: 20px;
2899
- box-sizing: border-box;
2900
- background-color: var(--background-color-2);
2901
- border-radius: 16px;
2902
- filter: var(--filter-color);
2903
- display: flex;
2904
- flex-direction: column;
2905
- gap: 16px;
2576
+ flex-direction: column;
2577
+ gap: 16px;
2906
2578
  }
2907
2579
  .roomInfo-container .roomInfo-content[data-v-c47b43e3] {
2908
2580
  display: flex;
@@ -2934,116 +2606,89 @@ input[data-v-afc0a29e]:disabled {
2934
2606
  .roomInfo-container .roomInfo-content .copy-container .copy[data-v-c47b43e3] {
2935
2607
  width: 20px;
2936
2608
  height: 20px;
2937
- }.pc-en-logo[data-v-a3741d41] {
2938
- display: flex;
2939
- align-items: center;
2940
- transform: scale(0.9);
2941
- }
2942
- .pc-en-logo .title[data-v-a3741d41] {
2943
- margin-left: 10px;
2944
- }
2945
- .pc-en-logo .white[data-v-a3741d41] {
2946
- color: #202C40;
2947
- }
2948
- .pc-en-logo .black[data-v-a3741d41] {
2949
- color: #D5E0F2;
2950
- }
2951
- .pc-en-logo.mobile[data-v-a3741d41] {
2952
- transform: scale(0.6);
2609
+ }.screen-share-control-container[data-v-2dd9ae04] {
2610
+ position: relative;
2953
2611
  }
2954
- .mobile-zh-logo[data-v-a3741d41] {
2612
+ .stop-share-region[data-v-2dd9ae04] {
2613
+ width: 131px;
2614
+ height: 48px;
2615
+ background: var(--stop-share-region-bg-color);
2616
+ border-radius: 4px;
2617
+ position: absolute;
2618
+ top: -58px;
2619
+ left: 50%;
2620
+ transform: translateX(-50%);
2955
2621
  display: flex;
2956
- flex-direction: column;
2957
- }
2958
- .mobile-zh-logo .logo[data-v-a3741d41] {
2959
- margin-bottom: 7px;
2622
+ justify-content: center;
2623
+ align-items: center;
2624
+ cursor: pointer;
2625
+ font-size: 14px;
2626
+ color: var(--color-font);
2960
2627
  }
2961
- .mobile-zh-logo .white[data-v-a3741d41] {
2962
- color: #000000;
2628
+ .stop-share-icon[data-v-2dd9ae04] {
2629
+ width: 24px;
2630
+ height: 24px;
2631
+ margin-right: 10px;
2963
2632
  }
2964
- .mobile-zh-logo .black[data-v-a3741d41] {
2965
- color: #FFFFFF;
2966
- }.audio-control-container[data-v-cf4e2f9b] {
2633
+ .button[data-v-2dd9ae04] {
2634
+ margin-left: 12px;
2635
+ }.apply-control-container[data-v-915fbd92] {
2967
2636
  position: relative;
2968
2637
  }
2969
- .audio-control-container .audio-tab[data-v-cf4e2f9b] {
2638
+ .apply-control-container .attention[data-v-915fbd92] {
2639
+ background: var(--active-color-1);
2640
+ box-shadow: 0 4px 16px 0 rgba(47, 48, 164, 0.1);
2970
2641
  position: absolute;
2971
- bottom: calc(100% + 12px);
2972
- left: -5px;
2973
- width: 305px;
2974
- background: var(--background-color-1);
2975
- padding: 20px 20px 24px 20px;
2976
2642
  border-radius: 8px;
2977
- box-shadow: 0px 2px 4px -3px rgba(32, 77, 141, 0.03), 0px 6px 10px 1px rgba(32, 77, 141, 0.06), 0px 3px 14px 2px rgba(32, 77, 141, 0.05);
2643
+ display: flex;
2644
+ align-items: center;
2645
+ justify-content: space-between;
2646
+ bottom: 70px;
2978
2647
  }
2979
- .audio-control-container .audio-tab[data-v-cf4e2f9b]::before {
2648
+ .apply-control-container .attention[data-v-915fbd92]::after {
2980
2649
  content: "";
2650
+ display: block;
2651
+ border: 5px solid transparent;
2652
+ border-top-color: var(--active-color-1);
2981
2653
  position: absolute;
2982
- left: 28px;
2983
- bottom: -10px;
2984
- border-top: 5px solid var(--background-color-1);
2985
- border-left: 5px solid transparent;
2986
- border-right: 5px solid transparent;
2987
- border-bottom: 5px solid transparent;
2988
- }.video-control-container[data-v-31eaf048] {
2989
- position: relative;
2654
+ top: 100%;
2655
+ left: 10%;
2656
+ transform: translateX(-50%);
2990
2657
  }
2991
- .video-control-container .video-tab[data-v-31eaf048] {
2992
- position: absolute;
2993
- bottom: calc(100% + 12px);
2994
- left: -5px;
2995
- width: 305px;
2996
- background: var(--background-color-1);
2997
- padding: 20px 20px 24px 20px;
2998
- border-radius: 8px;
2999
- box-shadow: 0px 2px 4px -3px rgba(32, 77, 141, 0.03), 0px 6px 10px 1px rgba(32, 77, 141, 0.06), 0px 3px 14px 2px rgba(32, 77, 141, 0.05);
2658
+ .apply-control-container .member-attention[data-v-915fbd92] {
2659
+ padding: 12px;
3000
2660
  }
3001
- .video-control-container .video-tab[data-v-31eaf048]::before {
3002
- content: "";
3003
- position: absolute;
3004
- left: 30px;
3005
- bottom: -10px;
3006
- border-top: 5px solid var(--background-color-1);
3007
- border-left: 5px solid transparent;
3008
- border-right: 5px solid transparent;
3009
- border-bottom: 5px solid transparent;
3010
- }.cancel-button[data-v-986f8b0b] {
3011
- margin-left: 20px;
3012
- }.invite-container[data-v-c6f331a2] {
3013
- position: fixed;
3014
- left: 0;
3015
- top: 0;
3016
- bottom: 0;
3017
- width: 100vw;
3018
- height: auto;
3019
- box-sizing: border-box;
3020
- background-color: var(--log-out-mobile);
3021
- z-index: 1;
3022
- }.video-control-container[data-v-4da95364] {
3023
- position: relative;
2661
+ .apply-control-container .member-attention .info[data-v-915fbd92], .apply-control-container .member-attention .mobile-info[data-v-915fbd92] {
2662
+ height: 20px;
2663
+ font-weight: 500;
2664
+ font-size: 14px;
2665
+ color: #ffffff;
2666
+ line-height: 20px;
2667
+ white-space: nowrap;
3024
2668
  }
3025
- .video-control-container .video-tab[data-v-4da95364] {
3026
- position: absolute;
3027
- bottom: 90px;
3028
- left: -60px;
3029
- width: 320px;
3030
- background: var(--room-videotab-bg-color);
3031
- padding: 20px;
2669
+ .apply-control-container .member-attention .mobile-info[data-v-915fbd92] {
2670
+ min-width: 50vw;
3032
2671
  }
3033
- .agree[data-v-4da95364], .cancel[data-v-4da95364] {
2672
+ .apply-control-container .member-attention .close[data-v-915fbd92] {
2673
+ cursor: pointer;
2674
+ color: #ffffff;
2675
+ padding-left: 12px;
2676
+ }
2677
+ .agree[data-v-915fbd92],
2678
+ .cancel[data-v-915fbd92] {
3034
2679
  padding: 14px;
3035
2680
  width: 50%;
3036
2681
  display: flex;
3037
2682
  align-items: center;
3038
- justify-content: center;
3039
- color: var(--active-color-1);
3040
2683
  font-size: 16px;
3041
2684
  font-weight: 500;
2685
+ justify-content: center;
2686
+ color: var(--active-color-1);
3042
2687
  }
3043
- .cancel[data-v-4da95364] {
2688
+ .cancel[data-v-915fbd92] {
3044
2689
  color: var(--font-color-4);
3045
2690
  }
3046
- .cancel-button[data-v-4da95364] {
2691
+ .cancel-button[data-v-915fbd92] {
3047
2692
  margin-left: 20px;
3048
2693
  }.stream-preview[data-v-46cc60bc] {
3049
2694
  display: flex;
@@ -3131,516 +2776,887 @@ input[data-v-afc0a29e]:disabled {
3131
2776
  .footer .button[data-v-46cc60bc] {
3132
2777
  width: 84px;
3133
2778
  height: 32px;
3134
- }.screen-share-control-container[data-v-2dd9ae04] {
3135
- position: relative;
3136
- }
3137
- .stop-share-region[data-v-2dd9ae04] {
3138
- width: 131px;
3139
- height: 48px;
3140
- background: var(--stop-share-region-bg-color);
2779
+ }.audio-setting-tab[data-v-31046864] {
3141
2780
  border-radius: 4px;
3142
- position: absolute;
3143
- top: -58px;
3144
- left: 50%;
3145
- transform: translateX(-50%);
3146
- display: flex;
3147
- justify-content: center;
3148
- align-items: center;
3149
- cursor: pointer;
3150
2781
  font-size: 14px;
3151
- color: var(--color-font);
2782
+ width: 100%;
3152
2783
  }
3153
- .stop-share-icon[data-v-2dd9ae04] {
3154
- width: 24px;
3155
- height: 24px;
3156
- margin-right: 10px;
2784
+ .audio-setting-tab .item-setting[data-v-31046864] {
2785
+ width: 100%;
3157
2786
  }
3158
- .button[data-v-2dd9ae04] {
3159
- margin-left: 12px;
3160
- }.apply-control-container[data-v-915fbd92] {
3161
- position: relative;
2787
+ .audio-setting-tab .item-setting[data-v-31046864]:not(:last-child) {
2788
+ margin-bottom: 20px;
3162
2789
  }
3163
- .apply-control-container .attention[data-v-915fbd92] {
3164
- background: var(--active-color-1);
3165
- box-shadow: 0 4px 16px 0 rgba(47, 48, 164, 0.1);
3166
- position: absolute;
3167
- border-radius: 8px;
2790
+ .audio-setting-tab .flex[data-v-31046864] {
2791
+ width: 100%;
3168
2792
  display: flex;
3169
- align-items: center;
3170
- justify-content: space-between;
3171
- bottom: 70px;
3172
2793
  }
3173
- .apply-control-container .attention[data-v-915fbd92]::after {
3174
- content: "";
3175
- display: block;
3176
- border: 5px solid transparent;
3177
- border-top-color: var(--active-color-1);
3178
- position: absolute;
3179
- top: 100%;
3180
- left: 10%;
3181
- transform: translateX(-50%);
2794
+ .audio-setting-tab .select[data-v-31046864] {
2795
+ flex: 1;
3182
2796
  }
3183
- .apply-control-container .member-attention[data-v-915fbd92] {
3184
- padding: 12px;
2797
+ .audio-setting-tab .button[data-v-31046864] {
2798
+ margin-left: 10px;
2799
+ padding: 5px 23px;
2800
+ width: 74px;
3185
2801
  }
3186
- .apply-control-container .member-attention .info[data-v-915fbd92], .apply-control-container .member-attention .mobile-info[data-v-915fbd92] {
3187
- height: 20px;
3188
- font-weight: 500;
2802
+ .audio-setting-tab .title[data-v-31046864] {
2803
+ display: inline-block;
2804
+ margin-bottom: 8px;
2805
+ width: 100%;
2806
+ color: #4f586b;
3189
2807
  font-size: 14px;
3190
- color: #ffffff;
3191
- line-height: 20px;
3192
- white-space: nowrap;
2808
+ font-weight: 400;
2809
+ line-height: 22px;
3193
2810
  }
3194
- .apply-control-container .member-attention .mobile-info[data-v-915fbd92] {
3195
- min-width: 50vw;
2811
+ .audio-setting-tab .mic-bar-container[data-v-31046864] {
2812
+ display: flex;
2813
+ justify-content: space-between;
3196
2814
  }
3197
- .apply-control-container .member-attention .close[data-v-915fbd92] {
3198
- cursor: pointer;
3199
- color: #ffffff;
3200
- padding-left: 12px;
2815
+ .audio-setting-tab .mic-bar-container .mic-bar[data-v-31046864] {
2816
+ width: 3px;
2817
+ height: 6px;
2818
+ background-color: var(--background-color-4);
3201
2819
  }
3202
- .agree[data-v-915fbd92],
3203
- .cancel[data-v-915fbd92] {
3204
- padding: 14px;
3205
- width: 50%;
3206
- display: flex;
3207
- align-items: center;
3208
- font-size: 16px;
3209
- font-weight: 500;
3210
- justify-content: center;
3211
- color: var(--active-color-1);
2820
+ .audio-setting-tab .mic-bar-container .mic-bar.active[data-v-31046864] {
2821
+ background-color: var(--green-color);
3212
2822
  }
3213
- .cancel[data-v-915fbd92] {
3214
- color: var(--font-color-4);
2823
+ .audio-setting-tab .audio-level-container[data-v-31046864] {
2824
+ width: 100%;
2825
+ height: 20px;
2826
+ display: flex;
3215
2827
  }
3216
- .cancel-button[data-v-915fbd92] {
3217
- margin-left: 20px;
3218
- }.end-control-container .end-button[data-v-8a854972] {
3219
- padding: 9px 20px;
2828
+ .audio-setting-tab .audio-level-container .slider[data-v-31046864] {
2829
+ height: 20px;
2830
+ margin-left: 10px;
2831
+ }.video-tab[data-v-6e09e806] {
2832
+ border-radius: 8px;
3220
2833
  font-size: 14px;
3221
- border-radius: 20px;
3222
- border: 1.5px solid var(--red-color-2);
3223
- color: var(--red-color-2);
3224
2834
  }
3225
- .end-control-container .end-button[data-v-8a854972]:hover {
3226
- background: var(--red-color-2);
3227
- color: var(--font-color-7);
3228
- border: 1px solid var(--red-color-2);
2835
+ .video-tab .item-setting[data-v-6e09e806]:not(:last-child) {
2836
+ margin-bottom: 20px;
3229
2837
  }
3230
- .button[data-v-8a854972] {
3231
- margin-left: 20px;
3232
- }.select[data-v-21a1edd5] {
2838
+ .video-tab .title[data-v-6e09e806] {
2839
+ display: inline-block;
2840
+ margin-bottom: 8px;
3233
2841
  width: 100%;
2842
+ color: var(--font-color-4);
3234
2843
  font-size: 14px;
3235
- }.tui-theme-white .message-body[data-v-277e0346] {
3236
- --user-chat-color: rgba(213, 224, 242, 0.4);
3237
- --user-font-color: var(--black-color);
3238
- --host-font-color: var(--white-color);
3239
- }
3240
- .tui-theme-black .message-body[data-v-277e0346] {
3241
- --user-chat-color: rgba(213, 224, 242, 0.1);
3242
- --user-font-color: var(--background-color-4);
3243
- --host-font-color: var(--background-color-4);
2844
+ font-weight: 400;
2845
+ line-height: 22px;
3244
2846
  }
3245
- .message-list-container[data-v-277e0346] {
3246
- height: 100%;
3247
- overflow: auto;
3248
- flex: 1;
2847
+ .video-tab .video-preview-container[data-v-6e09e806] {
2848
+ position: relative;
2849
+ width: 100%;
2850
+ height: 0;
2851
+ padding-top: 56.25%;
2852
+ background-color: #000000;
2853
+ border-radius: 8px;
2854
+ overflow: hidden;
3249
2855
  }
3250
- .message-list-container .message-list[data-v-277e0346] {
2856
+ .video-tab .video-preview-container .video-preview[data-v-6e09e806] {
2857
+ position: absolute;
2858
+ top: 0;
2859
+ left: 0;
2860
+ width: 100%;
3251
2861
  height: 100%;
3252
- overflow-y: auto;
3253
- overflow-x: hidden;
3254
- }
3255
- .message-list-container .message-list[data-v-277e0346]::-webkit-scrollbar {
3256
- display: none;
3257
2862
  }
3258
- .message-list-container .message-top[data-v-277e0346] {
2863
+ .video-tab .mirror-container[data-v-6e09e806] {
3259
2864
  display: flex;
3260
- justify-content: center;
3261
- }
3262
- .message-list-container .message-item[data-v-277e0346] {
3263
- margin-bottom: 8px;
3264
- word-break: break-all;
3265
- display: flex;
3266
- flex-direction: column;
3267
- align-items: flex-start;
3268
- }
3269
- .message-list-container .message-item[data-v-277e0346]:last-of-type {
3270
- margin-bottom: 0;
3271
- }
3272
- .message-list-container .message-item.is-me[data-v-277e0346] {
3273
- align-items: end;
3274
- }
3275
- .message-list-container .message-item.is-me .message-body[data-v-277e0346] {
3276
- background-color: var(--active-color-1);
3277
- min-width: 24px;
3278
- padding: 10px;
3279
- color: var(--host-font-color);
3280
- border-radius: 8px;
3281
- }
3282
- .message-list-container .message-item .message-header[data-v-277e0346] {
2865
+ justify-content: space-between;
2866
+ align-items: center;
2867
+ color: var(--font-color-4);
3283
2868
  font-size: 14px;
3284
- color: var(--font-color-8);
3285
- margin-bottom: 4px;
3286
- max-width: 180px;
3287
- white-space: nowrap;
3288
- text-overflow: ellipsis;
3289
- overflow: hidden;
2869
+ font-style: normal;
3290
2870
  font-weight: 400;
3291
2871
  line-height: 22px;
2872
+ padding-right: 2px;
3292
2873
  }
3293
- .message-list-container .message-item .message-body[data-v-277e0346] {
3294
- background-color: var(--user-chat-color);
3295
- display: inline-block;
3296
- padding: 10px;
3297
- font-weight: 400;
3298
- font-size: 14px;
3299
- color: var(--user-font-color);
3300
- border-radius: 8px;
3301
- }
3302
- .message-list-container-h5[data-v-277e0346] {
3303
- padding: 10px 23px 10px 32px;
3304
- background-color: var(--message-list-color-h5);
3305
- height: 100%;
2874
+ .video-tab .item[data-v-6e09e806] {
3306
2875
  width: 100%;
2876
+ height: 20px;
2877
+ cursor: pointer;
2878
+ color: var(--font-color-3);
2879
+ }.pc-en-logo[data-v-a3741d41] {
2880
+ display: flex;
2881
+ align-items: center;
2882
+ transform: scale(0.9);
3307
2883
  }
3308
- .message-list-container-h5 .message-list[data-v-277e0346] {
3309
- height: 100%;
3310
- overflow-y: auto;
3311
- overflow-x: hidden;
2884
+ .pc-en-logo .title[data-v-a3741d41] {
2885
+ margin-left: 10px;
3312
2886
  }
3313
- .message-list-container-h5 .message-list[data-v-277e0346]::-webkit-scrollbar {
3314
- display: none;
2887
+ .pc-en-logo .white[data-v-a3741d41] {
2888
+ color: #202C40;
3315
2889
  }
3316
- .message-list-container-h5 .message-top[data-v-277e0346] {
3317
- display: flex;
3318
- justify-content: center;
2890
+ .pc-en-logo .black[data-v-a3741d41] {
2891
+ color: #D5E0F2;
3319
2892
  }
3320
- .message-list-container-h5 .message-list[data-v-277e0346] {
3321
- overflow-y: scroll;
2893
+ .pc-en-logo.mobile[data-v-a3741d41] {
2894
+ transform: scale(0.6);
3322
2895
  }
3323
- .message-list-container-h5 .message-list .message-item[data-v-277e0346] {
3324
- margin-bottom: 20px;
3325
- word-break: break-all;
2896
+ .mobile-zh-logo[data-v-a3741d41] {
3326
2897
  display: flex;
3327
2898
  flex-direction: column;
3328
- align-items: flex-start;
3329
2899
  }
3330
- .message-list-container-h5 .message-list .message-item[data-v-277e0346]:last-of-type {
3331
- margin-bottom: 0;
2900
+ .mobile-zh-logo .logo[data-v-a3741d41] {
2901
+ margin-bottom: 7px;
3332
2902
  }
3333
- .message-list-container-h5 .message-list .message-item.is-me[data-v-277e0346] {
3334
- align-items: end;
2903
+ .mobile-zh-logo .white[data-v-a3741d41] {
2904
+ color: #000000;
3335
2905
  }
3336
- .message-list-container-h5 .message-list .message-item.is-me .message-body[data-v-277e0346] {
3337
- background-color: #4791ff;
3338
- min-width: 24px;
2906
+ .mobile-zh-logo .black[data-v-a3741d41] {
2907
+ color: #FFFFFF;
2908
+ }.audio-control-container[data-v-cf4e2f9b] {
2909
+ position: relative;
2910
+ }
2911
+ .audio-control-container .audio-tab[data-v-cf4e2f9b] {
2912
+ position: absolute;
2913
+ bottom: calc(100% + 12px);
2914
+ left: -5px;
2915
+ width: 305px;
2916
+ background: var(--background-color-1);
2917
+ padding: 20px 20px 24px 20px;
3339
2918
  border-radius: 8px;
3340
- display: inline-block;
3341
- padding: 7px;
3342
- font-weight: 400;
3343
- font-size: 14px;
3344
- color: #ffffff;
2919
+ box-shadow: 0px 2px 4px -3px rgba(32, 77, 141, 0.03), 0px 6px 10px 1px rgba(32, 77, 141, 0.06), 0px 3px 14px 2px rgba(32, 77, 141, 0.05);
3345
2920
  }
3346
- .message-list-container-h5 .message-list .message-item .message-header[data-v-277e0346] {
3347
- margin-bottom: 10px;
3348
- max-width: 180px;
3349
- white-space: nowrap;
3350
- text-overflow: ellipsis;
3351
- overflow: hidden;
3352
- font-style: normal;
3353
- font-weight: 500;
3354
- font-size: 10px;
3355
- color: #ff7200;
3356
- line-height: 14px;
2921
+ .audio-control-container .audio-tab[data-v-cf4e2f9b]::before {
2922
+ content: "";
2923
+ position: absolute;
2924
+ left: 28px;
2925
+ bottom: -10px;
2926
+ border-top: 5px solid var(--background-color-1);
2927
+ border-left: 5px solid transparent;
2928
+ border-right: 5px solid transparent;
2929
+ border-bottom: 5px solid transparent;
2930
+ }.video-control-container[data-v-31eaf048] {
2931
+ position: relative;
3357
2932
  }
3358
- .message-list-container-h5 .message-list .message-item .message-body[data-v-277e0346] {
3359
- background-color: var(--message-body-h5);
3360
- display: inline-block;
3361
- padding: 7px;
3362
- font-weight: 400;
3363
- font-size: 14px;
3364
- color: #ffffff;
2933
+ .video-control-container .video-tab[data-v-31eaf048] {
2934
+ position: absolute;
2935
+ bottom: calc(100% + 12px);
2936
+ left: -5px;
2937
+ width: 305px;
2938
+ background: var(--background-color-1);
2939
+ padding: 20px 20px 24px 20px;
3365
2940
  border-radius: 8px;
3366
- }.tui-theme-white textarea[data-v-417e38fe] {
3367
- --input-border-color: var(--background-color-10);
3368
- --chat-editor-color: var(--background-color-8);
2941
+ box-shadow: 0px 2px 4px -3px rgba(32, 77, 141, 0.03), 0px 6px 10px 1px rgba(32, 77, 141, 0.06), 0px 3px 14px 2px rgba(32, 77, 141, 0.05);
3369
2942
  }
3370
- .tui-theme-black textarea[data-v-417e38fe] {
3371
- --input-border-color: rgba(213, 224, 242, 0.2);
3372
- --chat-editor-color: var(--background-color-2);
2943
+ .video-control-container .video-tab[data-v-31eaf048]::before {
2944
+ content: "";
2945
+ position: absolute;
2946
+ left: 30px;
2947
+ bottom: -10px;
2948
+ border-top: 5px solid var(--background-color-1);
2949
+ border-left: 5px solid transparent;
2950
+ border-right: 5px solid transparent;
2951
+ border-bottom: 5px solid transparent;
2952
+ }.end-control-container .end-button[data-v-8a854972] {
2953
+ padding: 9px 20px;
2954
+ font-size: 14px;
2955
+ border-radius: 20px;
2956
+ border: 1.5px solid var(--red-color-2);
2957
+ color: var(--red-color-2);
3373
2958
  }
3374
- .chat-editor[data-v-417e38fe] {
3375
- width: 100%;
3376
- height: 150px;
3377
- box-sizing: border-box;
3378
- margin-top: 20px;
3379
- display: flex;
3380
- flex-direction: column;
3381
- border: 1px solid var(--input-border-color);
2959
+ .end-control-container .end-button[data-v-8a854972]:hover {
2960
+ background: var(--red-color-2);
2961
+ color: var(--font-color-7);
2962
+ border: 1px solid var(--red-color-2);
2963
+ }
2964
+ .button[data-v-8a854972] {
2965
+ margin-left: 20px;
2966
+ }.message-enter-from[data-v-c5813be3] {
2967
+ transform: translate3d(0, -75px, 0);
2968
+ opacity: 0;
2969
+ }
2970
+ .message-enter-active[data-v-c5813be3] {
2971
+ transition: all 0.3s;
2972
+ }
2973
+ .message-enter-to[data-v-c5813be3] {
2974
+ transform: none;
2975
+ opacity: 1;
2976
+ }
2977
+ .t-message[data-v-c5813be3] {
2978
+ display: inline-block;
2979
+ max-height: 50px;
3382
2980
  border-radius: 8px;
3383
- padding: 12px 16px;
3384
- position: relative;
2981
+ padding: 10px;
2982
+ position: absolute;
2983
+ z-index: 9999;
2984
+ left: 50%;
2985
+ transform: translateX(-50%);
2986
+ top: 6%;
2987
+ background: #f5f5f5;
2988
+ color: #999;
2989
+ white-space: nowrap;
3385
2990
  }
3386
- .chat-editor .chat-emoji[data-v-417e38fe] {
3387
- display: flex;
2991
+ .t-message .t-message-text[data-v-c5813be3] {
2992
+ vertical-align: middle;
2993
+ font-size: 0.875rem;
3388
2994
  }
3389
- .chat-editor .content-bottom-input[data-v-417e38fe] {
3390
- height: 100%;
3391
- border: none;
3392
- background: var(--chat-editor-color);
3393
- color: var(--textarea-color);
3394
- box-sizing: border-box;
3395
- caret-color: var(--caret-color);
3396
- resize: none;
3397
- padding: 0;
3398
- margin-top: 8px;
3399
- font-family: "PingFang SC";
3400
- font-size: 14px;
3401
- font-weight: 400;
3402
- line-height: 22px;
2995
+ .t-message .t-message-icon[data-v-c5813be3] {
2996
+ display: inline-block;
2997
+ width: 20px;
2998
+ height: 20px;
2999
+ background-size: cover;
3000
+ margin-right: 4px;
3001
+ vertical-align: middle;
3403
3002
  }
3404
- .chat-editor .content-bottom-input[data-v-417e38fe]:focus-visible {
3405
- outline: none;
3003
+ .tui-theme-white .t-message.t-message-error[data-v-c5813be3] {
3004
+ color: #E04343;
3005
+ background-color: #FFEBEE;
3406
3006
  }
3407
- .chat-editor .content-bottom-input[data-v-417e38fe]::placeholder {
3408
- color: rgba(143, 154, 178, 0.7);
3409
- font-size: 14px;
3410
- font-weight: 400;
3411
- line-height: 22px;
3007
+ .tui-theme-black .t-message.t-message-error[data-v-c5813be3] {
3008
+ color: #F46262;
3009
+ background-color: #421414;
3412
3010
  }
3413
- .chat-editor .content-bottom-input[data-v-417e38fe]::-webkit-scrollbar {
3414
- display: none;
3011
+ .tui-theme-white .t-message.t-message-success[data-v-c5813be3] {
3012
+ color: #00B89C;
3013
+ background-color: #EBFFFA;
3415
3014
  }
3416
- .chat-editor.disable[data-v-417e38fe] {
3417
- background-color: var(--disable-color);
3015
+ .tui-theme-black .t-message.t-message-success[data-v-c5813be3] {
3016
+ color: #1CEACB;
3017
+ background-color: #19423C;
3418
3018
  }
3419
- .chat-editor.disable .chat-emoji[data-v-417e38fe] {
3420
- color: #8f9ab2;
3421
- pointer-events: none;
3019
+ .tui-theme-white .t-message.t-message-warning[data-v-c5813be3] {
3020
+ color: #E59753;
3021
+ background-color: #FFF4EB;
3422
3022
  }
3423
- .chat-editor.disable .content-bottom-input[data-v-417e38fe]:disabled {
3424
- background-color: var(--disable-color);
3425
- }.select[data-v-c12fa79f] {
3023
+ .tui-theme-black .t-message.t-message-warning[data-v-c5813be3] {
3024
+ color: #FFAD66;
3025
+ background-color: #3F2712;
3026
+ }
3027
+ .tui-theme-white .t-message.t-message-info[data-v-c5813be3] {
3028
+ color: #494F6A;
3029
+ background-color: #EBF2FF;
3030
+ }
3031
+ .tui-theme-black .t-message.t-message-info[data-v-c5813be3] {
3032
+ color: #DCE7FA;
3033
+ background-color: #4A506B;
3034
+ }.stream-container-flatten[data-v-d8433998] {
3426
3035
  width: 100%;
3427
- font-size: 14px;
3428
- }.timing[data-v-e34df50f] {
3429
- text-align: center;
3430
- font-size: 14px;
3431
- font-weight: 500;
3432
- line-height: 20px;
3433
- }.arrow-stroke-container-left[data-v-19325188] {
3434
- width: 8px;
3435
3036
  height: 100%;
3037
+ overflow: hidden;
3038
+ padding: 25px 20px;
3436
3039
  }
3437
- .arrow-stroke-container-left .stroke-content[data-v-19325188] {
3040
+ .stream-container-flatten .stream-list-container[data-v-d8433998] {
3438
3041
  width: 100%;
3439
3042
  height: 100%;
3440
- position: absolute;
3441
- background-color: transparent;
3442
- transform: perspective(20px) rotateX(0deg) rotateY(-20deg) translateZ(0);
3443
- }
3444
- .arrow-stroke-container-left .stroke-content .arrow-content[data-v-19325188] {
3445
- width: 5px;
3446
- height: 60px;
3447
- position: absolute;
3448
- top: 50%;
3449
- left: 0px;
3450
- transform: translateY(-50%);
3451
- cursor: pointer;
3043
+ display: flex;
3044
+ justify-content: center;
3045
+ align-content: center;
3452
3046
  }
3453
- .arrow-stroke-container-left .stroke-content .arrow-content[data-v-19325188]::before {
3454
- content: "";
3455
- width: 20px;
3456
- height: 100%;
3457
- box-sizing: border-box;
3458
- position: absolute;
3459
- top: 0;
3460
- right: -15px;
3461
- border-top-left-radius: 10px;
3462
- border-bottom-left-radius: 10px;
3463
- border: 1px solid rgba(143, 154, 178, 0.1);
3464
- background-color: rgba(15, 16, 20, 0.3);
3047
+ .stream-container-flatten .stream-list[data-v-d8433998] {
3048
+ display: flex;
3049
+ flex-wrap: wrap;
3050
+ justify-content: center;
3051
+ align-items: center;
3052
+ align-content: center;
3465
3053
  }
3466
- .arrow-stroke-container-left .stroke-content.has-stroke .arrow-content[data-v-19325188] {
3467
- width: 5px;
3468
- height: 60px;
3469
- position: absolute;
3470
- top: 50%;
3471
- left: 0px;
3472
- transform: translateY(-50%);
3473
- border-top: 1px solid var(--stroke-color);
3474
- border-left: 1px solid var(--stroke-color);
3475
- border-bottom: 1px solid var(--stroke-color);
3476
- border-top-left-radius: 4px;
3477
- border-bottom-left-radius: 4px;
3478
- cursor: pointer;
3054
+ .stream-container-flatten .stream-list .single-stream[data-v-d8433998] {
3055
+ margin: 4px;
3479
3056
  }
3480
- .arrow-stroke-container-left .stroke-content.has-stroke .arrow-content[data-v-19325188]::before {
3481
- content: "";
3482
- width: 20px;
3483
- height: 100%;
3057
+ .arrow-stroke-right[data-v-d8433998] {
3484
3058
  position: absolute;
3059
+ right: 280px;
3485
3060
  top: 0;
3486
- right: -15px;
3487
- border: 0px;
3488
- background-color: transparent;
3489
3061
  }
3490
- .arrow-stroke-container-left .stroke-content.has-stroke[data-v-19325188]::before {
3491
- content: "";
3492
- width: 2px;
3493
- height: calc((100% - 60px) / 2);
3062
+ .arrow-stroke-left[data-v-d8433998] {
3494
3063
  position: absolute;
3495
- top: 0px;
3496
- right: 0px;
3497
- border-right: 1px solid var(--stroke-color);
3498
- border-bottom: 1px solid var(--stroke-color);
3499
- border-bottom-right-radius: 4px;
3064
+ right: 12px;
3065
+ top: 0;
3500
3066
  }
3501
- .arrow-stroke-container-left .stroke-content.has-stroke[data-v-19325188]::after {
3502
- content: "";
3503
- width: 2px;
3504
- height: calc((100% - 60px) / 2);
3067
+ .arrow-stroke-up[data-v-d8433998] {
3505
3068
  position: absolute;
3506
- bottom: 0px;
3507
- right: 0px;
3508
- border-right: 1px solid var(--stroke-color);
3509
- border-top: 1px solid var(--stroke-color);
3510
- border-top-right-radius: 4px;
3069
+ top: 175px;
3070
+ left: 0;
3511
3071
  }
3512
- .arrow-stroke-container-left .arrow[data-v-19325188] {
3072
+ .arrow-stroke-down[data-v-d8433998] {
3513
3073
  position: absolute;
3514
- top: 50%;
3515
- left: 6px;
3516
- transform: translateY(-50%);
3517
- cursor: pointer;
3518
- color: #D5E0F2;
3519
- transition: color 0s;
3520
- }
3521
- .arrow-stroke-container-left .arrow svg[data-v-19325188] {
3522
- transition: color 0s;
3074
+ top: 76px;
3075
+ left: 0;
3523
3076
  }
3524
- .arrow-stroke-container-bottom[data-v-19325188] {
3077
+ .stream-container-top[data-v-d8433998] {
3525
3078
  width: 100%;
3526
- height: 8px;
3079
+ height: 100%;
3080
+ overflow: hidden;
3081
+ position: relative;
3527
3082
  }
3528
- .arrow-stroke-container-bottom .stroke-content[data-v-19325188] {
3083
+ .stream-container-top .enlarged-stream-container[data-v-d8433998] {
3529
3084
  width: 100%;
3530
- height: 100%;
3085
+ height: calc(100% - 184px);
3086
+ padding: 25px 20px;
3531
3087
  position: absolute;
3532
- background-color: transparent;
3533
- transform: perspective(20px) rotateX(-20deg) rotateY(0deg) translateZ(0);
3088
+ top: 175px;
3089
+ display: flex;
3090
+ justify-content: center;
3091
+ align-items: center;
3534
3092
  }
3535
- .arrow-stroke-container-bottom .stroke-content .arrow-content[data-v-19325188] {
3536
- width: 60px;
3537
- height: 5px;
3093
+ .stream-container-top .stream-list-container[data-v-d8433998] {
3094
+ width: 100%;
3095
+ height: 175px;
3538
3096
  position: absolute;
3539
- left: 50%;
3540
- bottom: 0px;
3541
- transform: translateX(-50%);
3542
- cursor: pointer;
3097
+ top: 0;
3098
+ left: 0;
3099
+ padding: 20px 40px;
3100
+ display: flex;
3101
+ justify-content: center;
3543
3102
  }
3544
- .arrow-stroke-container-bottom .stroke-content .arrow-content[data-v-19325188]::before {
3545
- content: "";
3103
+ .stream-container-top .stream-list-container.hide-list[data-v-d8433998] {
3104
+ transform: translateY(-166px);
3105
+ }
3106
+ .stream-container-top .stream-list-container .stream-list[data-v-d8433998] {
3107
+ display: flex;
3108
+ overflow-x: scroll;
3109
+ max-width: 100%;
3110
+ max-height: 100%;
3111
+ scrollbar-width: none;
3112
+ -ms-overflow-style: none;
3113
+ }
3114
+ .stream-container-top .stream-list-container .stream-list[data-v-d8433998]::-webkit-scrollbar {
3115
+ display: none;
3116
+ }
3117
+ .stream-container-top .stream-list-container .stream-list .single-stream[data-v-d8433998] {
3118
+ width: 240px;
3119
+ height: 135px;
3120
+ border-radius: 8px;
3121
+ overflow: hidden;
3122
+ flex-shrink: 0;
3123
+ }
3124
+ .stream-container-top .stream-list-container .stream-list .single-stream[data-v-d8433998]:not(:first-child) {
3125
+ margin-left: 14px;
3126
+ }
3127
+ .stream-container-right[data-v-d8433998] {
3546
3128
  width: 100%;
3547
- height: 20px;
3548
- position: absolute;
3549
- box-sizing: border-box;
3550
- bottom: 0;
3551
- border-bottom-left-radius: 10px;
3552
- border-bottom-right-radius: 10px;
3553
- border: 1px solid rgba(143, 154, 178, 0.1);
3554
- background-color: rgba(15, 16, 20, 0.3);
3129
+ height: 100%;
3130
+ overflow: hidden;
3131
+ display: flex;
3132
+ flex-wrap: nowrap;
3133
+ justify-content: space-between;
3134
+ align-content: center;
3135
+ position: relative;
3555
3136
  }
3556
- .arrow-stroke-container-bottom .stroke-content.has-stroke .arrow-content[data-v-19325188] {
3557
- width: 60px;
3558
- height: 5px;
3137
+ .stream-container-right .enlarged-stream-container[data-v-d8433998] {
3138
+ width: calc(100% - 280px);
3139
+ height: 100%;
3140
+ padding: 25px 20px;
3141
+ display: flex;
3142
+ justify-content: center;
3143
+ align-items: center;
3144
+ }
3145
+ .stream-container-right .stream-list-container[data-v-d8433998] {
3146
+ width: 280px;
3147
+ height: 100%;
3559
3148
  position: absolute;
3560
- left: 50%;
3561
- bottom: 0px;
3562
- transform: translateX(-50%);
3563
- border-left: 1px solid var(--stroke-color);
3564
- border-bottom: 1px solid var(--stroke-color);
3565
- border-right: 1px solid var(--stroke-color);
3566
- border-bottom-left-radius: 4px;
3567
- border-bottom-right-radius: 4px;
3568
- cursor: pointer;
3149
+ top: 0;
3150
+ right: 0;
3151
+ padding: 20px;
3152
+ display: flex;
3153
+ align-items: center;
3569
3154
  }
3570
- .arrow-stroke-container-bottom .stroke-content.has-stroke .arrow-content .arrow[data-v-19325188] {
3571
- color: #A4BBDB;
3155
+ .stream-container-right .stream-list-container.hide-list[data-v-d8433998] {
3156
+ transform: translateX(270px);
3572
3157
  }
3573
- .arrow-stroke-container-bottom .stroke-content.has-stroke .arrow-content[data-v-19325188]::before {
3158
+ .stream-container-right .stream-list-container[data-v-d8433998]::before {
3574
3159
  content: "";
3575
3160
  width: 100%;
3576
- height: 20px;
3161
+ height: 40px;
3577
3162
  position: absolute;
3578
- bottom: 0;
3579
- border: 0px;
3580
- background-color: transparent;
3163
+ top: 10px;
3164
+ left: 0;
3165
+ opacity: 0.1;
3581
3166
  }
3582
- .arrow-stroke-container-bottom .stroke-content.has-stroke[data-v-19325188]::before {
3583
- content: "";
3584
- width: calc((100% - 60px) / 2);
3585
- height: 2px;
3586
- position: absolute;
3587
- top: 0px;
3588
- left: 0px;
3589
- border-top: 1px solid var(--stroke-color);
3590
- border-right: 1px solid var(--stroke-color);
3591
- border-top-right-radius: 4px;
3167
+ .stream-container-right .stream-list[data-v-d8433998] {
3168
+ max-width: 100%;
3169
+ max-height: 100%;
3170
+ overflow-y: scroll;
3171
+ padding: 10px 0;
3172
+ scrollbar-width: none;
3173
+ -ms-overflow-style: none;
3592
3174
  }
3593
- .arrow-stroke-container-bottom .stroke-content.has-stroke[data-v-19325188]::after {
3594
- content: "";
3595
- width: calc((100% - 60px) / 2);
3596
- height: 2px;
3175
+ .stream-container-right .stream-list[data-v-d8433998]::-webkit-scrollbar {
3176
+ display: none;
3177
+ }
3178
+ .stream-container-right .stream-list .single-stream[data-v-d8433998] {
3179
+ width: 240px;
3180
+ height: 135px;
3181
+ border-radius: 8px;
3182
+ overflow: hidden;
3183
+ }
3184
+ .stream-container-right .stream-list .single-stream[data-v-d8433998]:not(:first-child) {
3185
+ margin-top: 14px;
3186
+ }
3187
+ .tui-theme-black .turn-page-container[data-v-d8433998] {
3188
+ --turn-page-background-color: rgba(114, 122, 138, 0.4);
3189
+ --turn-page-hover-background-color: rgba(114, 122, 138, 0.7);
3190
+ --turn-page-arrow-color: #D5E0F2;
3191
+ }
3192
+ .tui-theme-white .turn-page-container[data-v-d8433998] {
3193
+ --turn-page-background-color: rgba(114, 122, 138, 0.4);
3194
+ --turn-page-hover-background-color: rgba(114, 122, 138, 0.7);
3195
+ --turn-page-arrow-color: white;
3196
+ }
3197
+ .turn-page-container[data-v-d8433998] {
3198
+ width: 100%;
3199
+ height: 60px;
3200
+ position: absolute;
3201
+ left: 0;
3202
+ top: 50%;
3203
+ transform: translateY(-50%);
3204
+ display: flex;
3205
+ justify-content: space-between;
3206
+ }
3207
+ .turn-page-container .turn-page-arrow-container[data-v-d8433998] {
3208
+ width: 32px;
3209
+ height: 60px;
3210
+ background: var(--turn-page-background-color);
3211
+ backdrop-filter: blur(2.25px);
3212
+ border-radius: 32px;
3213
+ display: flex;
3214
+ justify-content: center;
3215
+ align-items: center;
3216
+ cursor: pointer;
3217
+ color: var(--turn-page-arrow-color);
3218
+ }
3219
+ .turn-page-container .turn-page-arrow-container[data-v-d8433998]:hover {
3220
+ background: var(--turn-page-hover-background-color);
3221
+ }
3222
+ .turn-page-container .left-container[data-v-d8433998] {
3223
+ position: absolute;
3224
+ left: 34px;
3225
+ }
3226
+ .turn-page-container .right-container[data-v-d8433998] {
3227
+ position: absolute;
3228
+ right: 34px;
3229
+ }
3230
+ .turn-page-container .turn-page-right[data-v-d8433998] {
3231
+ transform: rotateY(180deg);
3232
+ }.timing[data-v-e34df50f] {
3233
+ text-align: center;
3234
+ font-size: 14px;
3235
+ font-weight: 500;
3236
+ line-height: 20px;
3237
+ }.tui-theme-white .message-body[data-v-277e0346] {
3238
+ --user-chat-color: rgba(213, 224, 242, 0.4);
3239
+ --user-font-color: var(--black-color);
3240
+ --host-font-color: var(--white-color);
3241
+ }
3242
+ .tui-theme-black .message-body[data-v-277e0346] {
3243
+ --user-chat-color: rgba(213, 224, 242, 0.1);
3244
+ --user-font-color: var(--background-color-4);
3245
+ --host-font-color: var(--background-color-4);
3246
+ }
3247
+ .message-list-container[data-v-277e0346] {
3248
+ height: 100%;
3249
+ overflow: auto;
3250
+ flex: 1;
3251
+ }
3252
+ .message-list-container .message-list[data-v-277e0346] {
3253
+ height: 100%;
3254
+ overflow-y: auto;
3255
+ overflow-x: hidden;
3256
+ }
3257
+ .message-list-container .message-list[data-v-277e0346]::-webkit-scrollbar {
3258
+ display: none;
3259
+ }
3260
+ .message-list-container .message-top[data-v-277e0346] {
3261
+ display: flex;
3262
+ justify-content: center;
3263
+ }
3264
+ .message-list-container .message-item[data-v-277e0346] {
3265
+ margin-bottom: 8px;
3266
+ word-break: break-all;
3267
+ display: flex;
3268
+ flex-direction: column;
3269
+ align-items: flex-start;
3270
+ }
3271
+ .message-list-container .message-item[data-v-277e0346]:last-of-type {
3272
+ margin-bottom: 0;
3273
+ }
3274
+ .message-list-container .message-item.is-me[data-v-277e0346] {
3275
+ align-items: end;
3276
+ }
3277
+ .message-list-container .message-item.is-me .message-body[data-v-277e0346] {
3278
+ background-color: var(--active-color-1);
3279
+ min-width: 24px;
3280
+ padding: 10px;
3281
+ color: var(--host-font-color);
3282
+ border-radius: 8px;
3283
+ }
3284
+ .message-list-container .message-item .message-header[data-v-277e0346] {
3285
+ font-size: 14px;
3286
+ color: var(--font-color-8);
3287
+ margin-bottom: 4px;
3288
+ max-width: 180px;
3289
+ white-space: nowrap;
3290
+ text-overflow: ellipsis;
3291
+ overflow: hidden;
3292
+ font-weight: 400;
3293
+ line-height: 22px;
3294
+ }
3295
+ .message-list-container .message-item .message-body[data-v-277e0346] {
3296
+ background-color: var(--user-chat-color);
3297
+ display: inline-block;
3298
+ padding: 10px;
3299
+ font-weight: 400;
3300
+ font-size: 14px;
3301
+ color: var(--user-font-color);
3302
+ border-radius: 8px;
3303
+ }
3304
+ .message-list-container-h5[data-v-277e0346] {
3305
+ padding: 10px 23px 10px 32px;
3306
+ background-color: var(--message-list-color-h5);
3307
+ height: 100%;
3308
+ width: 100%;
3309
+ }
3310
+ .message-list-container-h5 .message-list[data-v-277e0346] {
3311
+ height: 100%;
3312
+ overflow-y: auto;
3313
+ overflow-x: hidden;
3314
+ }
3315
+ .message-list-container-h5 .message-list[data-v-277e0346]::-webkit-scrollbar {
3316
+ display: none;
3317
+ }
3318
+ .message-list-container-h5 .message-top[data-v-277e0346] {
3319
+ display: flex;
3320
+ justify-content: center;
3321
+ }
3322
+ .message-list-container-h5 .message-list[data-v-277e0346] {
3323
+ overflow-y: scroll;
3324
+ }
3325
+ .message-list-container-h5 .message-list .message-item[data-v-277e0346] {
3326
+ margin-bottom: 20px;
3327
+ word-break: break-all;
3328
+ display: flex;
3329
+ flex-direction: column;
3330
+ align-items: flex-start;
3331
+ }
3332
+ .message-list-container-h5 .message-list .message-item[data-v-277e0346]:last-of-type {
3333
+ margin-bottom: 0;
3334
+ }
3335
+ .message-list-container-h5 .message-list .message-item.is-me[data-v-277e0346] {
3336
+ align-items: end;
3337
+ }
3338
+ .message-list-container-h5 .message-list .message-item.is-me .message-body[data-v-277e0346] {
3339
+ background-color: #4791ff;
3340
+ min-width: 24px;
3341
+ border-radius: 8px;
3342
+ display: inline-block;
3343
+ padding: 7px;
3344
+ font-weight: 400;
3345
+ font-size: 14px;
3346
+ color: #ffffff;
3347
+ }
3348
+ .message-list-container-h5 .message-list .message-item .message-header[data-v-277e0346] {
3349
+ margin-bottom: 10px;
3350
+ max-width: 180px;
3351
+ white-space: nowrap;
3352
+ text-overflow: ellipsis;
3353
+ overflow: hidden;
3354
+ font-style: normal;
3355
+ font-weight: 500;
3356
+ font-size: 10px;
3357
+ color: #ff7200;
3358
+ line-height: 14px;
3359
+ }
3360
+ .message-list-container-h5 .message-list .message-item .message-body[data-v-277e0346] {
3361
+ background-color: var(--message-body-h5);
3362
+ display: inline-block;
3363
+ padding: 7px;
3364
+ font-weight: 400;
3365
+ font-size: 14px;
3366
+ color: #ffffff;
3367
+ border-radius: 8px;
3368
+ }.tui-theme-white textarea[data-v-417e38fe] {
3369
+ --input-border-color: var(--background-color-10);
3370
+ --chat-editor-color: var(--background-color-8);
3371
+ }
3372
+ .tui-theme-black textarea[data-v-417e38fe] {
3373
+ --input-border-color: rgba(213, 224, 242, 0.2);
3374
+ --chat-editor-color: var(--background-color-2);
3375
+ }
3376
+ .chat-editor[data-v-417e38fe] {
3377
+ width: 100%;
3378
+ height: 150px;
3379
+ box-sizing: border-box;
3380
+ margin-top: 20px;
3381
+ display: flex;
3382
+ flex-direction: column;
3383
+ border: 1px solid var(--input-border-color);
3384
+ border-radius: 8px;
3385
+ padding: 12px 16px;
3386
+ position: relative;
3387
+ }
3388
+ .chat-editor .chat-emoji[data-v-417e38fe] {
3389
+ display: flex;
3390
+ }
3391
+ .chat-editor .content-bottom-input[data-v-417e38fe] {
3392
+ height: 100%;
3393
+ border: none;
3394
+ background: var(--chat-editor-color);
3395
+ color: var(--textarea-color);
3396
+ box-sizing: border-box;
3397
+ caret-color: var(--caret-color);
3398
+ resize: none;
3399
+ padding: 0;
3400
+ margin-top: 8px;
3401
+ font-family: "PingFang SC";
3402
+ font-size: 14px;
3403
+ font-weight: 400;
3404
+ line-height: 22px;
3405
+ }
3406
+ .chat-editor .content-bottom-input[data-v-417e38fe]:focus-visible {
3407
+ outline: none;
3408
+ }
3409
+ .chat-editor .content-bottom-input[data-v-417e38fe]::placeholder {
3410
+ color: rgba(143, 154, 178, 0.7);
3411
+ font-size: 14px;
3412
+ font-weight: 400;
3413
+ line-height: 22px;
3414
+ }
3415
+ .chat-editor .content-bottom-input[data-v-417e38fe]::-webkit-scrollbar {
3416
+ display: none;
3417
+ }
3418
+ .chat-editor.disable[data-v-417e38fe] {
3419
+ background-color: var(--disable-color);
3420
+ }
3421
+ .chat-editor.disable .chat-emoji[data-v-417e38fe] {
3422
+ color: #8f9ab2;
3423
+ pointer-events: none;
3424
+ }
3425
+ .chat-editor.disable .content-bottom-input[data-v-417e38fe]:disabled {
3426
+ background-color: var(--disable-color);
3427
+ }.tui-theme-black .member-item-container[data-v-ca3f9dba] {
3428
+ --hover-bg-color: rgba(79, 88, 107, 0.2);
3429
+ }
3430
+ .tui-theme-white .member-item-container[data-v-ca3f9dba] {
3431
+ --hover-bg-color: rgba(213, 224, 242, 0.3);
3432
+ }
3433
+ .member-item-container[data-v-ca3f9dba] {
3434
+ display: flex;
3435
+ flex-direction: row;
3436
+ align-items: center;
3437
+ height: 52px;
3438
+ padding: 0 20px;
3439
+ justify-content: space-between;
3440
+ }
3441
+ .member-item-container[data-v-ca3f9dba]:hover {
3442
+ cursor: pointer;
3443
+ background: var(--hover-bg-color);
3444
+ }.screen-content[data-v-f20f3578] {
3445
+ height: auto;
3446
+ min-width: 200px;
3447
+ max-height: 500px;
3448
+ overflow: auto;
3449
+ }
3450
+ .screen-content[data-v-f20f3578]::-webkit-scrollbar {
3451
+ display: none;
3452
+ }
3453
+ .screen-list[data-v-f20f3578],
3454
+ .window-list[data-v-f20f3578] {
3455
+ list-style: none;
3456
+ margin: 0;
3457
+ padding: 0;
3458
+ margin-bottom: 0;
3459
+ }
3460
+ .screen-title[data-v-f20f3578],
3461
+ .window-title[data-v-f20f3578] {
3462
+ color: #4f586b;
3463
+ font-size: 14px;
3464
+ font-weight: 400;
3465
+ margin-bottom: 12px;
3466
+ }
3467
+ .selected[data-v-f20f3578] {
3468
+ color: #fff;
3469
+ background-color: #1c66e5;
3470
+ }
3471
+ ul[data-v-f20f3578] {
3472
+ padding-left: 0;
3473
+ }.apply-control-container[data-v-5e2dbb41] {
3474
+ position: relative;
3475
+ }
3476
+ .cancel-button[data-v-5e2dbb41] {
3477
+ margin-left: 10px;
3478
+ background-color: #f0f3fa;
3479
+ border: 1px solid #f0f3fa;
3480
+ color: #4f586b;
3481
+ }
3482
+ .cancel-button[data-v-5e2dbb41]:hover {
3483
+ background-color: #f0f3fa;
3484
+ border: 1px solid #f0f3fa;
3485
+ }
3486
+ .apply-list[data-v-5e2dbb41] {
3487
+ height: 290px;
3488
+ overflow: scroll;
3489
+ margin-top: 4px;
3490
+ }
3491
+ .apply-list[data-v-5e2dbb41]::-webkit-scrollbar {
3492
+ display: none;
3493
+ }
3494
+ .apply-list .apply-list-title[data-v-5e2dbb41] {
3495
+ display: flex;
3496
+ justify-content: space-between;
3497
+ border-bottom: 1px solid #f0f3fa;
3498
+ padding-bottom: 10px;
3499
+ }
3500
+ .apply-list .apply-list-title .apply-list-name[data-v-5e2dbb41],
3501
+ .apply-list .apply-list-title .apply-list-operate[data-v-5e2dbb41] {
3502
+ width: calc(100% - 310px);
3503
+ color: #4f586b;
3504
+ font-size: 14px;
3505
+ font-style: normal;
3506
+ font-weight: 500;
3507
+ line-height: 22px;
3508
+ }
3509
+ .apply-list .apply-item[data-v-5e2dbb41] {
3510
+ display: flex;
3511
+ justify-content: space-between;
3512
+ align-items: center;
3513
+ height: 48px;
3514
+ margin-top: 8px;
3515
+ border-bottom: 1px solid #f0f3fa;
3516
+ }
3517
+ .apply-list .apply-item .user-info[data-v-5e2dbb41] {
3518
+ width: calc(100% - 176px);
3519
+ height: 100%;
3520
+ display: flex;
3521
+ align-items: center;
3522
+ }
3523
+ .apply-list .apply-item .user-info .avatar-url[data-v-5e2dbb41] {
3524
+ width: 32px;
3525
+ height: 32px;
3526
+ border-radius: 50%;
3527
+ }
3528
+ .apply-list .apply-item .user-info .user-name[data-v-5e2dbb41] {
3529
+ font-weight: 400;
3530
+ font-size: 14px;
3531
+ color: #4f586b;
3532
+ line-height: 22px;
3533
+ margin-left: 12px;
3534
+ max-width: 180px;
3535
+ white-space: nowrap;
3536
+ text-overflow: ellipsis;
3537
+ overflow: hidden;
3538
+ }
3539
+ .apply-list .apply-item .control-container[data-v-5e2dbb41] {
3540
+ display: flex;
3541
+ justify-content: space-between;
3542
+ }
3543
+ .apply-list .apply-item .control-container .agree[data-v-5e2dbb41],
3544
+ .apply-list .apply-item .control-container .reject[data-v-5e2dbb41] {
3545
+ padding: 2px 12px;
3546
+ }
3547
+ .apply-list .apply-item .control-container .reject[data-v-5e2dbb41] {
3548
+ margin-left: 8px;
3549
+ background-color: #f0f3fa;
3550
+ border: 1px solid #f0f3fa;
3551
+ color: #4f586b;
3552
+ }
3553
+ .apply-nobody[data-v-5e2dbb41] {
3554
+ height: 290px;
3555
+ display: flex;
3556
+ justify-content: center;
3557
+ align-items: center;
3558
+ flex-direction: column;
3559
+ }
3560
+ .apply-nobody .apply-text[data-v-5e2dbb41] {
3561
+ color: #8f9ab2;
3562
+ font-size: 14px;
3563
+ font-style: normal;
3564
+ font-weight: 400;
3565
+ line-height: 22px;
3566
+ margin-top: 10px;
3567
+ }.select[data-v-21a1edd5] {
3568
+ width: 100%;
3569
+ font-size: 14px;
3570
+ }.select[data-v-c12fa79f] {
3571
+ width: 100%;
3572
+ font-size: 14px;
3573
+ }.audio-icon-container[data-v-09a04b4a] {
3574
+ position: relative;
3575
+ width: 24px;
3576
+ height: 24px;
3577
+ }
3578
+ .audio-icon-container.small[data-v-09a04b4a] {
3579
+ transform: scale(0.8);
3580
+ }
3581
+ .audio-icon-container .audio-level-container[data-v-09a04b4a] {
3597
3582
  position: absolute;
3598
- top: 0px;
3599
- right: 0px;
3600
- border-left: 1px solid var(--stroke-color);
3601
- border-top: 1px solid var(--stroke-color);
3602
- border-top-left-radius: 4px;
3583
+ top: 2px;
3584
+ left: 7px;
3585
+ width: 10px;
3586
+ height: 14px;
3587
+ display: flex;
3588
+ flex-wrap: wrap;
3589
+ border-radius: 4px;
3590
+ overflow: hidden;
3591
+ flex-direction: column-reverse;
3592
+ justify-content: space-between;
3603
3593
  }
3604
- .arrow-stroke-container-bottom .arrow[data-v-19325188] {
3594
+ .audio-icon-container .audio-level-container .audio-level[data-v-09a04b4a] {
3595
+ width: 100%;
3596
+ background-color: var(--green-color);
3597
+ transition: height 0.2s;
3598
+ }
3599
+ .audio-icon-container .audio-icon[data-v-09a04b4a] {
3605
3600
  position: absolute;
3606
- left: 50%;
3607
- bottom: 4px;
3608
- transform: translateX(-50%);
3609
- cursor: pointer;
3610
- color: #D5E0F2;
3611
- transition: color 0s;
3601
+ top: 0;
3602
+ left: 0;
3603
+ }.tui-theme-white .emoji-list[data-v-522fd19b] {
3604
+ --emoji-box-shadow:
3605
+ 0px 2px 4px -3px rgba(32, 77, 141, 0.03),
3606
+ 0px 6px 10px 1px rgba(32, 77, 141, 0.06),
3607
+ 0px 3px 14px 2px rgba(32, 77, 141, 0.05);
3612
3608
  }
3613
- .arrow-stroke-container-bottom .arrow svg[data-v-19325188] {
3614
- transition: color 0s;
3609
+ .tui-theme-black .emoji-list[data-v-522fd19b] {
3610
+ --emoji-box-shadow:
3611
+ 0px 8px 40px 0px rgba(23, 25, 31, 0.6),
3612
+ 0px 4px 12px 0px rgba(23, 25, 31, 0.8);
3615
3613
  }
3616
- .up[data-v-19325188] {
3617
- transform: rotate(90deg);
3614
+ .emoji-tool .emoji-icon[data-v-522fd19b] {
3615
+ cursor: pointer;
3618
3616
  }
3619
- .left[data-v-19325188] {
3620
- transform: rotate(0deg);
3617
+ .emoji-tool .emoji-list[data-v-522fd19b],
3618
+ .emoji-tool .emoji-list-h5[data-v-522fd19b] {
3619
+ height: 204px;
3620
+ width: 100%;
3621
+ position: absolute;
3622
+ bottom: 160px;
3623
+ left: 0px;
3624
+ display: flex;
3625
+ flex-wrap: wrap;
3626
+ overflow-y: auto;
3627
+ background-color: var(--background-color-8);
3628
+ padding: 10px;
3629
+ border-radius: 8px;
3630
+ box-shadow: var(--emoji-box-shadow);
3631
+ gap: 5px;
3621
3632
  }
3622
- .down[data-v-19325188] {
3623
- transform: rotate(-90deg);
3633
+ .emoji-tool .emoji-list[data-v-522fd19b]::-webkit-scrollbar,
3634
+ .emoji-tool .emoji-list-h5[data-v-522fd19b]::-webkit-scrollbar {
3635
+ display: none;
3624
3636
  }
3625
- .right[data-v-19325188] {
3626
- transform: rotate(180deg);
3627
- }.tui-theme-black .member-item-container[data-v-ca3f9dba] {
3628
- --hover-bg-color: rgba(79, 88, 107, 0.2);
3637
+ .emoji-tool .emoji-list .emoji-item[data-v-522fd19b]:hover,
3638
+ .emoji-tool .emoji-list-h5 .emoji-item[data-v-522fd19b]:hover {
3639
+ cursor: pointer;
3629
3640
  }
3630
- .tui-theme-white .member-item-container[data-v-ca3f9dba] {
3631
- --hover-bg-color: rgba(213, 224, 242, 0.3);
3641
+ .emoji-tool .emoji-list img[data-v-522fd19b],
3642
+ .emoji-tool .emoji-list-h5 img[data-v-522fd19b] {
3643
+ width: 23px;
3644
+ height: 23px;
3632
3645
  }
3633
- .member-item-container[data-v-ca3f9dba] {
3634
- display: flex;
3635
- flex-direction: row;
3636
- align-items: center;
3637
- height: 52px;
3638
- padding: 0 20px;
3639
- justify-content: space-between;
3646
+ .emoji-tool .emoji-list-h5[data-v-522fd19b] {
3647
+ width: 298px;
3648
+ height: 148px;
3649
+ position: fixed;
3650
+ bottom: 77px;
3651
+ left: 30px;
3652
+ }.text-img[data-v-2d009ef3] {
3653
+ width: 20px;
3654
+ height: 20px;
3655
+ vertical-align: middle;
3640
3656
  }
3641
- .member-item-container[data-v-ca3f9dba]:hover {
3642
- cursor: pointer;
3643
- background: var(--hover-bg-color);
3657
+ .text-box[data-v-2d009ef3] {
3658
+ line-height: 20px;
3659
+ vertical-align: middle;
3644
3660
  }@keyframes loading-rotate-f3b29630 {
3645
3661
  0% {
3646
3662
  transform: rotate(0deg);
@@ -3769,208 +3785,235 @@ input[data-v-afc0a29e]:disabled {
3769
3785
  text-overflow: ellipsis;
3770
3786
  overflow: hidden;
3771
3787
  vertical-align: bottom;
3772
- }.audio-icon-container[data-v-09a04b4a] {
3773
- position: relative;
3774
- width: 24px;
3775
- height: 24px;
3776
- }
3777
- .audio-icon-container.small[data-v-09a04b4a] {
3778
- transform: scale(0.8);
3788
+ }.arrow-stroke-container-left[data-v-19325188] {
3789
+ width: 8px;
3790
+ height: 100%;
3779
3791
  }
3780
- .audio-icon-container .audio-level-container[data-v-09a04b4a] {
3792
+ .arrow-stroke-container-left .stroke-content[data-v-19325188] {
3793
+ width: 100%;
3794
+ height: 100%;
3781
3795
  position: absolute;
3782
- top: 2px;
3783
- left: 7px;
3784
- width: 10px;
3785
- height: 14px;
3786
- display: flex;
3787
- flex-wrap: wrap;
3788
- border-radius: 4px;
3789
- overflow: hidden;
3790
- flex-direction: column-reverse;
3791
- justify-content: space-between;
3796
+ background-color: transparent;
3797
+ transform: perspective(20px) rotateX(0deg) rotateY(-20deg) translateZ(0);
3792
3798
  }
3793
- .audio-icon-container .audio-level-container .audio-level[data-v-09a04b4a] {
3794
- width: 100%;
3795
- background-color: var(--green-color);
3796
- transition: height 0.2s;
3799
+ .arrow-stroke-container-left .stroke-content .arrow-content[data-v-19325188] {
3800
+ width: 5px;
3801
+ height: 60px;
3802
+ position: absolute;
3803
+ top: 50%;
3804
+ left: 0px;
3805
+ transform: translateY(-50%);
3806
+ cursor: pointer;
3797
3807
  }
3798
- .audio-icon-container .audio-icon[data-v-09a04b4a] {
3808
+ .arrow-stroke-container-left .stroke-content .arrow-content[data-v-19325188]::before {
3809
+ content: "";
3810
+ width: 20px;
3811
+ height: 100%;
3812
+ box-sizing: border-box;
3799
3813
  position: absolute;
3800
3814
  top: 0;
3801
- left: 0;
3802
- }.apply-control-container[data-v-5e2dbb41] {
3803
- position: relative;
3815
+ right: -15px;
3816
+ border-top-left-radius: 10px;
3817
+ border-bottom-left-radius: 10px;
3818
+ border: 1px solid rgba(143, 154, 178, 0.1);
3819
+ background-color: rgba(15, 16, 20, 0.3);
3804
3820
  }
3805
- .cancel-button[data-v-5e2dbb41] {
3806
- margin-left: 10px;
3807
- background-color: #f0f3fa;
3808
- border: 1px solid #f0f3fa;
3809
- color: #4f586b;
3821
+ .arrow-stroke-container-left .stroke-content.has-stroke .arrow-content[data-v-19325188] {
3822
+ width: 5px;
3823
+ height: 60px;
3824
+ position: absolute;
3825
+ top: 50%;
3826
+ left: 0px;
3827
+ transform: translateY(-50%);
3828
+ border-top: 1px solid var(--stroke-color);
3829
+ border-left: 1px solid var(--stroke-color);
3830
+ border-bottom: 1px solid var(--stroke-color);
3831
+ border-top-left-radius: 4px;
3832
+ border-bottom-left-radius: 4px;
3833
+ cursor: pointer;
3810
3834
  }
3811
- .cancel-button[data-v-5e2dbb41]:hover {
3812
- background-color: #f0f3fa;
3813
- border: 1px solid #f0f3fa;
3835
+ .arrow-stroke-container-left .stroke-content.has-stroke .arrow-content[data-v-19325188]::before {
3836
+ content: "";
3837
+ width: 20px;
3838
+ height: 100%;
3839
+ position: absolute;
3840
+ top: 0;
3841
+ right: -15px;
3842
+ border: 0px;
3843
+ background-color: transparent;
3814
3844
  }
3815
- .apply-list[data-v-5e2dbb41] {
3816
- height: 290px;
3817
- overflow: scroll;
3818
- margin-top: 4px;
3845
+ .arrow-stroke-container-left .stroke-content.has-stroke[data-v-19325188]::before {
3846
+ content: "";
3847
+ width: 2px;
3848
+ height: calc((100% - 60px) / 2);
3849
+ position: absolute;
3850
+ top: 0px;
3851
+ right: 0px;
3852
+ border-right: 1px solid var(--stroke-color);
3853
+ border-bottom: 1px solid var(--stroke-color);
3854
+ border-bottom-right-radius: 4px;
3819
3855
  }
3820
- .apply-list[data-v-5e2dbb41]::-webkit-scrollbar {
3821
- display: none;
3856
+ .arrow-stroke-container-left .stroke-content.has-stroke[data-v-19325188]::after {
3857
+ content: "";
3858
+ width: 2px;
3859
+ height: calc((100% - 60px) / 2);
3860
+ position: absolute;
3861
+ bottom: 0px;
3862
+ right: 0px;
3863
+ border-right: 1px solid var(--stroke-color);
3864
+ border-top: 1px solid var(--stroke-color);
3865
+ border-top-right-radius: 4px;
3822
3866
  }
3823
- .apply-list .apply-list-title[data-v-5e2dbb41] {
3824
- display: flex;
3825
- justify-content: space-between;
3826
- border-bottom: 1px solid #f0f3fa;
3827
- padding-bottom: 10px;
3867
+ .arrow-stroke-container-left .arrow[data-v-19325188] {
3868
+ position: absolute;
3869
+ top: 50%;
3870
+ left: 6px;
3871
+ transform: translateY(-50%);
3872
+ cursor: pointer;
3873
+ color: #D5E0F2;
3874
+ transition: color 0s;
3828
3875
  }
3829
- .apply-list .apply-list-title .apply-list-name[data-v-5e2dbb41],
3830
- .apply-list .apply-list-title .apply-list-operate[data-v-5e2dbb41] {
3831
- width: calc(100% - 310px);
3832
- color: #4f586b;
3833
- font-size: 14px;
3834
- font-style: normal;
3835
- font-weight: 500;
3836
- line-height: 22px;
3876
+ .arrow-stroke-container-left .arrow svg[data-v-19325188] {
3877
+ transition: color 0s;
3837
3878
  }
3838
- .apply-list .apply-item[data-v-5e2dbb41] {
3839
- display: flex;
3840
- justify-content: space-between;
3841
- align-items: center;
3842
- height: 48px;
3843
- margin-top: 8px;
3844
- border-bottom: 1px solid #f0f3fa;
3879
+ .arrow-stroke-container-bottom[data-v-19325188] {
3880
+ width: 100%;
3881
+ height: 8px;
3845
3882
  }
3846
- .apply-list .apply-item .user-info[data-v-5e2dbb41] {
3847
- width: calc(100% - 176px);
3883
+ .arrow-stroke-container-bottom .stroke-content[data-v-19325188] {
3884
+ width: 100%;
3848
3885
  height: 100%;
3849
- display: flex;
3850
- align-items: center;
3886
+ position: absolute;
3887
+ background-color: transparent;
3888
+ transform: perspective(20px) rotateX(-20deg) rotateY(0deg) translateZ(0);
3851
3889
  }
3852
- .apply-list .apply-item .user-info .avatar-url[data-v-5e2dbb41] {
3853
- width: 32px;
3854
- height: 32px;
3855
- border-radius: 50%;
3890
+ .arrow-stroke-container-bottom .stroke-content .arrow-content[data-v-19325188] {
3891
+ width: 60px;
3892
+ height: 5px;
3893
+ position: absolute;
3894
+ left: 50%;
3895
+ bottom: 0px;
3896
+ transform: translateX(-50%);
3897
+ cursor: pointer;
3856
3898
  }
3857
- .apply-list .apply-item .user-info .user-name[data-v-5e2dbb41] {
3858
- font-weight: 400;
3859
- font-size: 14px;
3860
- color: #4f586b;
3861
- line-height: 22px;
3862
- margin-left: 12px;
3863
- max-width: 180px;
3864
- white-space: nowrap;
3865
- text-overflow: ellipsis;
3866
- overflow: hidden;
3899
+ .arrow-stroke-container-bottom .stroke-content .arrow-content[data-v-19325188]::before {
3900
+ content: "";
3901
+ width: 100%;
3902
+ height: 20px;
3903
+ position: absolute;
3904
+ box-sizing: border-box;
3905
+ bottom: 0;
3906
+ border-bottom-left-radius: 10px;
3907
+ border-bottom-right-radius: 10px;
3908
+ border: 1px solid rgba(143, 154, 178, 0.1);
3909
+ background-color: rgba(15, 16, 20, 0.3);
3867
3910
  }
3868
- .apply-list .apply-item .control-container[data-v-5e2dbb41] {
3869
- display: flex;
3870
- justify-content: space-between;
3911
+ .arrow-stroke-container-bottom .stroke-content.has-stroke .arrow-content[data-v-19325188] {
3912
+ width: 60px;
3913
+ height: 5px;
3914
+ position: absolute;
3915
+ left: 50%;
3916
+ bottom: 0px;
3917
+ transform: translateX(-50%);
3918
+ border-left: 1px solid var(--stroke-color);
3919
+ border-bottom: 1px solid var(--stroke-color);
3920
+ border-right: 1px solid var(--stroke-color);
3921
+ border-bottom-left-radius: 4px;
3922
+ border-bottom-right-radius: 4px;
3923
+ cursor: pointer;
3871
3924
  }
3872
- .apply-list .apply-item .control-container .agree[data-v-5e2dbb41],
3873
- .apply-list .apply-item .control-container .reject[data-v-5e2dbb41] {
3874
- padding: 2px 12px;
3925
+ .arrow-stroke-container-bottom .stroke-content.has-stroke .arrow-content .arrow[data-v-19325188] {
3926
+ color: #A4BBDB;
3875
3927
  }
3876
- .apply-list .apply-item .control-container .reject[data-v-5e2dbb41] {
3877
- margin-left: 8px;
3878
- background-color: #f0f3fa;
3879
- border: 1px solid #f0f3fa;
3880
- color: #4f586b;
3928
+ .arrow-stroke-container-bottom .stroke-content.has-stroke .arrow-content[data-v-19325188]::before {
3929
+ content: "";
3930
+ width: 100%;
3931
+ height: 20px;
3932
+ position: absolute;
3933
+ bottom: 0;
3934
+ border: 0px;
3935
+ background-color: transparent;
3881
3936
  }
3882
- .apply-nobody[data-v-5e2dbb41] {
3883
- height: 290px;
3884
- display: flex;
3885
- justify-content: center;
3886
- align-items: center;
3887
- flex-direction: column;
3937
+ .arrow-stroke-container-bottom .stroke-content.has-stroke[data-v-19325188]::before {
3938
+ content: "";
3939
+ width: calc((100% - 60px) / 2);
3940
+ height: 2px;
3941
+ position: absolute;
3942
+ top: 0px;
3943
+ left: 0px;
3944
+ border-top: 1px solid var(--stroke-color);
3945
+ border-right: 1px solid var(--stroke-color);
3946
+ border-top-right-radius: 4px;
3888
3947
  }
3889
- .apply-nobody .apply-text[data-v-5e2dbb41] {
3890
- color: #8f9ab2;
3891
- font-size: 14px;
3892
- font-style: normal;
3893
- font-weight: 400;
3894
- line-height: 22px;
3895
- margin-top: 10px;
3896
- }.screen-content[data-v-f20f3578] {
3897
- height: auto;
3898
- min-width: 200px;
3899
- max-height: 500px;
3900
- overflow: auto;
3948
+ .arrow-stroke-container-bottom .stroke-content.has-stroke[data-v-19325188]::after {
3949
+ content: "";
3950
+ width: calc((100% - 60px) / 2);
3951
+ height: 2px;
3952
+ position: absolute;
3953
+ top: 0px;
3954
+ right: 0px;
3955
+ border-left: 1px solid var(--stroke-color);
3956
+ border-top: 1px solid var(--stroke-color);
3957
+ border-top-left-radius: 4px;
3901
3958
  }
3902
- .screen-content[data-v-f20f3578]::-webkit-scrollbar {
3903
- display: none;
3959
+ .arrow-stroke-container-bottom .arrow[data-v-19325188] {
3960
+ position: absolute;
3961
+ left: 50%;
3962
+ bottom: 4px;
3963
+ transform: translateX(-50%);
3964
+ cursor: pointer;
3965
+ color: #D5E0F2;
3966
+ transition: color 0s;
3904
3967
  }
3905
- .screen-list[data-v-f20f3578],
3906
- .window-list[data-v-f20f3578] {
3907
- list-style: none;
3908
- margin: 0;
3909
- padding: 0;
3910
- margin-bottom: 0;
3968
+ .arrow-stroke-container-bottom .arrow svg[data-v-19325188] {
3969
+ transition: color 0s;
3911
3970
  }
3912
- .screen-title[data-v-f20f3578],
3913
- .window-title[data-v-f20f3578] {
3914
- color: #4f586b;
3915
- font-size: 14px;
3916
- font-weight: 400;
3917
- margin-bottom: 12px;
3971
+ .up[data-v-19325188] {
3972
+ transform: rotate(90deg);
3918
3973
  }
3919
- .selected[data-v-f20f3578] {
3920
- color: #fff;
3921
- background-color: #1c66e5;
3974
+ .left[data-v-19325188] {
3975
+ transform: rotate(0deg);
3922
3976
  }
3923
- ul[data-v-f20f3578] {
3924
- padding-left: 0;
3925
- }.tui-theme-white .emoji-list[data-v-522fd19b] {
3926
- --emoji-box-shadow:
3927
- 0px 2px 4px -3px rgba(32, 77, 141, 0.03),
3928
- 0px 6px 10px 1px rgba(32, 77, 141, 0.06),
3929
- 0px 3px 14px 2px rgba(32, 77, 141, 0.05);
3977
+ .down[data-v-19325188] {
3978
+ transform: rotate(-90deg);
3930
3979
  }
3931
- .tui-theme-black .emoji-list[data-v-522fd19b] {
3932
- --emoji-box-shadow:
3933
- 0px 8px 40px 0px rgba(23, 25, 31, 0.6),
3934
- 0px 4px 12px 0px rgba(23, 25, 31, 0.8);
3980
+ .right[data-v-19325188] {
3981
+ transform: rotate(180deg);
3982
+ }.screen-window-previewer[data-v-b328c764] {
3983
+ list-style: none;
3984
+ display: inline-block;
3985
+ margin-right: 40px;
3986
+ width: 184px;
3987
+ border-radius: 8px;
3988
+ border: 2px solid #e4eaf7;
3989
+ text-align: center;
3990
+ margin-bottom: 40px;
3935
3991
  }
3936
- .emoji-tool .emoji-icon[data-v-522fd19b] {
3937
- cursor: pointer;
3992
+ .screen-window-previewer[data-v-b328c764]:hover {
3993
+ border-color: #1c66e5;
3938
3994
  }
3939
- .emoji-tool .emoji-list[data-v-522fd19b],
3940
- .emoji-tool .emoji-list-h5[data-v-522fd19b] {
3941
- height: 204px;
3942
- width: 100%;
3943
- position: absolute;
3944
- bottom: 160px;
3945
- left: 0px;
3995
+ .previewer-canvas[data-v-b328c764],
3996
+ .previewer-mini[data-v-b328c764] {
3997
+ margin: 0 auto;
3946
3998
  display: flex;
3947
- flex-wrap: wrap;
3948
- overflow-y: auto;
3949
- background-color: var(--background-color-8);
3950
- padding: 10px;
3999
+ justify-content: space-around;
4000
+ align-items: center;
3951
4001
  border-radius: 8px;
3952
- box-shadow: var(--emoji-box-shadow);
3953
- gap: 5px;
3954
- }
3955
- .emoji-tool .emoji-list[data-v-522fd19b]::-webkit-scrollbar,
3956
- .emoji-tool .emoji-list-h5[data-v-522fd19b]::-webkit-scrollbar {
3957
- display: none;
3958
- }
3959
- .emoji-tool .emoji-list .emoji-item[data-v-522fd19b]:hover,
3960
- .emoji-tool .emoji-list-h5 .emoji-item[data-v-522fd19b]:hover {
3961
- cursor: pointer;
4002
+ overflow: hidden;
3962
4003
  }
3963
- .emoji-tool .emoji-list img[data-v-522fd19b],
3964
- .emoji-tool .emoji-list-h5 img[data-v-522fd19b] {
3965
- width: 23px;
3966
- height: 23px;
4004
+ .previewer-mini[data-v-b328c764] {
4005
+ width: 110px;
4006
+ height: 110px;
4007
+ padding: 4px;
3967
4008
  }
3968
- .emoji-tool .emoji-list-h5[data-v-522fd19b] {
3969
- width: 298px;
3970
- height: 148px;
3971
- position: fixed;
3972
- bottom: 77px;
3973
- left: 30px;
4009
+ .previewer-name[data-v-b328c764] {
4010
+ overflow: hidden;
4011
+ text-overflow: ellipsis;
4012
+ white-space: nowrap;
4013
+ font-size: 12px;
4014
+ font-style: normal;
4015
+ font-weight: 400;
4016
+ padding: 0 20px;
3974
4017
  }.tui-theme-black .member-av-state[data-v-18d628a6] {
3975
4018
  --icon-color: #A3AEC7;
3976
4019
  }
@@ -4077,14 +4120,6 @@ ul[data-v-f20f3578] {
4077
4120
  .member-info-mobile[data-v-18d628a6] {
4078
4121
  align-items: center;
4079
4122
  width: 80vw;
4080
- }.text-img[data-v-2d009ef3] {
4081
- width: 20px;
4082
- height: 20px;
4083
- vertical-align: middle;
4084
- }
4085
- .text-box[data-v-2d009ef3] {
4086
- line-height: 20px;
4087
- vertical-align: middle;
4088
4123
  }.tui-theme-black .user-operate-list[data-v-4309b988] {
4089
4124
  --operation-font-color: var(--font-color-1);
4090
4125
  --operation-box-shadow: 0px 3px 8px rgba(34, 38, 46, 0.30), 0px 6px 40px rgba(34, 38, 46, 0.30);
@@ -4230,41 +4265,6 @@ ul[data-v-f20f3578] {
4230
4265
  }
4231
4266
  .dialog-button[data-v-aff18b01] {
4232
4267
  margin-right: 12px;
4233
- }.screen-window-previewer[data-v-b328c764] {
4234
- list-style: none;
4235
- display: inline-block;
4236
- margin-right: 40px;
4237
- width: 184px;
4238
- border-radius: 8px;
4239
- border: 2px solid #e4eaf7;
4240
- text-align: center;
4241
- margin-bottom: 40px;
4242
- }
4243
- .screen-window-previewer[data-v-b328c764]:hover {
4244
- border-color: #1c66e5;
4245
- }
4246
- .previewer-canvas[data-v-b328c764],
4247
- .previewer-mini[data-v-b328c764] {
4248
- margin: 0 auto;
4249
- display: flex;
4250
- justify-content: space-around;
4251
- align-items: center;
4252
- border-radius: 8px;
4253
- overflow: hidden;
4254
- }
4255
- .previewer-mini[data-v-b328c764] {
4256
- width: 110px;
4257
- height: 110px;
4258
- padding: 4px;
4259
- }
4260
- .previewer-name[data-v-b328c764] {
4261
- overflow: hidden;
4262
- text-overflow: ellipsis;
4263
- white-space: nowrap;
4264
- font-size: 12px;
4265
- font-style: normal;
4266
- font-weight: 400;
4267
- padding: 0 20px;
4268
4268
  }`));
4269
4269
  document.head.appendChild(elementStyle);
4270
4270
  }