js-test-meeting/style.css

我创建的第一个组件库

@charset "UTF-8";.tool-list[data-v-59adb0a4]{display:flex;color:#fff;justify-content:center;gap:10px}.tool-list .tool-item[data-v-59adb0a4]{cursor:pointer;display:flex}.tool-list .tool-item .el-radio-group[data-v-59adb0a4]{display:flex;flex-direction:column;align-items:flex-start;width:100%}.tool-list .tool-item .icon-group[data-v-59adb0a4]{min-width:64px;display:flex;flex-direction:column;align-items:center}.tool-list .tool-item .tool-item-icon[data-v-59adb0a4]{font-size:28px}.tool-list .tool-item .tool-item-icon[data-v-59adb0a4]:hover{border-radius:50%;background:#7d7d7d}.el-radio-label[data-v-59adb0a4]{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}[data-v-59adb0a4] .el-radio.el-radio--large{width:100%}[data-v-59adb0a4] .el-radio.el-radio--large .el-radio__label{width:90%}.share-screen-dialog[data-v-59adb0a4]{display:flex;flex-direction:column;align-items:center}.share-screen-dialog .share-screen-list[data-v-59adb0a4]{width:100%;display:flex;margin-top:20px;gap:10px;flex-wrap:wrap;min-height:400px;overflow-y:auto}.share-screen-dialog .share-screen-list .share-screen-item[data-v-59adb0a4]{display:flex;flex-direction:column;align-items:center;height:140px;width:32%;box-sizing:border-box;padding:10px;text-align:center;border:2px solid #dfd6d6;border-radius:8px}.share-screen-dialog .share-screen-list .share-screen-item[data-v-59adb0a4]:hover{background-color:azure}.share-screen-dialog .share-screen-list .is-active[data-v-59adb0a4]{border:2px solid #409eff}.meeting-main-container[data-v-97ac15f0]{position:relative;display:flex;flex-direction:column;width:100%;height:100%;background-color:#222121;-webkit-app-region:no-drag;overflow:hidden;align-items:center}.meeting-main-container .container-header[data-v-97ac15f0]{display:flex;width:100%;justify-content:space-between;height:40px;align-items:center}.meeting-main-container .container-header.draggable[data-v-97ac15f0]{-webkit-app-region:drag!important}.meeting-main-container .container-header .meeting-info[data-v-97ac15f0]{color:#fff;display:flex;font-size:14px;font-weight:500}.meeting-main-container .container-header .operation-button[data-v-97ac15f0]{display:flex;align-items:center;gap:10px}.meeting-main-container .container-header .operation-button .view-drop-down[data-v-97ac15f0]{cursor:pointer;color:#fff;display:flex;align-items:center;margin-right:10px}.meeting-main-container .container-header .operation-button .view-drop-down .view-drop-down-class[data-v-97ac15f0]{display:flex;color:#fff;width:100px;font-size:16px;font-weight:500}.meeting-main-container .container-header .operation-button .icon-button[data-v-97ac15f0]{width:40px;height:40px;display:flex;justify-content:center;align-items:center;color:#b3b3b3;font-size:20px;cursor:pointer}.meeting-main-container .container-header .operation-button .icon-button[data-v-97ac15f0]:hover{color:#fff}.meeting-main-container .container-header .operation-button .full-screen[data-v-97ac15f0]{width:40px;height:40px}.meeting-main-container .container-content[data-v-97ac15f0]{flex:1;width:100%;background-color:#000}.meeting-main-container .container-toolbar[data-v-97ac15f0]{width:100%;height:60px}.video-box[data-v-97ac15f0]{display:flex;flex-direction:row;gap:10px}.video-box-item[data-v-97ac15f0]{background-image:url(@/assets/images/1.png);background-size:cover;height:10vw;width:20vw}.normal-container[data-v-97ac15f0]{display:flex;flex-direction:column;flex:1}.grid-container[data-v-97ac15f0]{display:flex;align-items:center;flex:1;gap:10px}.grid-box-item[data-v-97ac15f0]{background-image:url(@/assets/images/1.png);background-size:cover;height:20vw;width:32vw}.member-container[data-v-72303ac4]{position:relative;width:300px;background-color:#b19e9e;border-radius:0 20px 20px 0;box-shadow:0 0 10px #0000001a;padding:10px}.member-container .member-list[data-v-72303ac4]{display:flex;flex-direction:column;height:100%}.member-container .member-list .member-list-header[data-v-72303ac4]{display:flex;justify-content:space-between;align-items:center;padding:10px;border-bottom:1px solid #333333}.member-container .member-list .member-list-header .member-list-header-title[data-v-72303ac4]{display:flex;align-items:center;font-size:1.4em;color:#fff;-webkit-user-select:none;user-select:none}.member-container .member-list .member-list-header .member-list-header-title span[data-v-72303ac4]{margin-left:10px}.member-container .member-list .member-list-header .member-list-header-icon[data-v-72303ac4]{cursor:pointer;color:#fff}.member-container .member-list .member-list-container[data-v-72303ac4]{position:absolute;bottom:70px;width:calc(100% - 20px);box-shadow:0 0 10px #0000001a}.member-container .member-list .member-list-container .member-list-content[data-v-72303ac4]{background-color:#333;border-top-left-radius:8px;border-top-right-radius:8px;-webkit-user-select:none;user-select:none;overflow-y:auto}.member-container .member-list .member-list-container .member-list-content .title[data-v-72303ac4]{position:absolute;width:calc(100% - 20px);padding:10px;font-size:16px;color:#fff;border-bottom:1px solid #666}.member-container .member-list .member-list-container .member-list-content .title .icon-hide-member[data-v-72303ac4]{float:right;cursor:pointer;color:#fff;font-size:1.5em}.member-container .member-list .member-list-container .member-list-content .member[data-v-72303ac4]{width:100%;margin-top:60px;max-height:240px;overflow-y:auto}.member-container .member-list .member-list-container .member-list-content .member[data-v-72303ac4]::-webkit-scrollbar-thumb{background:#666;border-radius:50%;width:8px;height:8px;cursor:pointer}.member-container .member-list .member-list-container .member-list-content .member[data-v-72303ac4]::-webkit-scrollbar-track{background:#333;border-radius:10px;cursor:pointer}.member-container .member-list .member-hide-container[data-v-72303ac4]{position:absolute;bottom:70px;width:calc(100% - 20px);box-shadow:0 0 10px #0000001a;background-color:#333;border-top-left-radius:8px;border-top-right-radius:8px;-webkit-user-select:none;user-select:none;overflow-y:auto}.member-container .member-list .member-hide-container .title[data-v-72303ac4]{padding:10px;font-size:16px;color:#fff}.member-container .member-list .member-hide-container .title .icon-hide-member[data-v-72303ac4]{float:right;cursor:pointer;color:#fff;font-size:1.5em}.member-container .member-list .member-list-footer[data-v-72303ac4]{display:flex;justify-content:center;align-items:center;padding:10px;border-top:1px solid #333333;height:50px;color:#fff;width:calc(100% - 20px);background-color:#333}.member-container .member-list .member-list-footer .js-galileo-button[data-v-72303ac4]{font-size:.8em;margin:0 20px}.member-container .member-list .video-list-container[data-v-72303ac4]{width:100%;background-color:transparent;border-top-left-radius:20px;border-bottom-left-radius:20px;height:90vh}.member-container .member-list .video-list-container .video-list-scroll-area[data-v-72303ac4]{width:100%;overflow-y:auto;height:75vh}.member-container .member-list .video-list-container .video-list-scroll-area .video-list-content[data-v-72303ac4]{margin:10px;width:calc(100% - 20px);display:flex;flex-flow:column}.member-container .member-list .video-list-container .video-list-scroll-area .video-list-content .video-item-container[data-v-72303ac4]{width:100%}.meeting-container[data-v-643b5c00]{width:100%;position:relative;display:flex;flex-flow:row;height:100%;background-color:#222121;border-radius:20px;box-shadow:0 0 10px #0000001a;margin-bottom:10px}.meeting-container.sidebar[data-v-643b5c00]{border-top-right-radius:20px;border-bottom-right-radius:20px}.meeting-container .main-container[data-v-643b5c00]{flex:1}.meeting-container .member-container[data-v-643b5c00]{width:300px}