/*!**********************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-24.use[1]!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-24.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-24.use[3]!./src/pages/EditMedia/index.scss ***! \**********************************************************************************************************************************************************************************************************************************************/ .btn { display: inline-flex; align-items: center; gap: 6px; border: none; cursor: pointer; font-weight: 600; border-radius: 8px; transition: 0.15s; font-family: inherit; } .btn-pri { font-size: 13px; padding: 8px 16px; background: var(--media-pri); color: var(--media-srf); } .btn-pri:hover { background: var(--media-pri-d); } .btn-acc { background: var(--media-acc); color: var(--media-srf); } .btn-dng { background: var(--media-dng); color: var(--media-srf); } .btn-gho { background: transparent; color: var(--media-txt2); border: 1px solid var(--media-txt2); } .btn-s { font-size: 12px; padding: 6px 12px; } .btn-m { font-size: 13px; padding: 8px 16px; } .btn.attach { background: var(--media-pri); color: var(--media-srf); } .btn.attach:hover { background: #388E3C; } .btn.delete { background: var(--media-dng); color: var(--media-srf); } .btn.delete:hover { background: #C62828; } .thumb { border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; color: var(--media-srf); font-weight: 600; text-align: center; line-height: 1.2; flex-shrink: 0; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08); vertical-align: middle; } @keyframes mediaFadeUp { 0% { opacity: 0; transform: translateY(16px); } 100% { opacity: 1; transform: translateY(0); } } .thumb-skeleton { width: 64px; height: 64px; background: linear-gradient(90deg, #ccc, #ddd, #ccc); background-size: 200% 100%; animation: shimmer 1.2s infinite; } @keyframes shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } :root { --media-pri: #43A047; --media-pri-d: #2E7D32; --media-pri-l: #E8F5E9; --media-dng: #E53935; --media-wrn-l: #FFF3E0; --media-bg: #F5F7FA; --media-srf: #fff; --media-brd: #E0E4EA; --media-brd-l: #F0F2F5; --media-txt: #1A1D23; --media-txt2: #6B7280; --media-txt3: #9CA3AF; --media-acc: #1976D2; --media-acc-l: #E3F2FD; --media-sb: #1E2A38; } /*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/pages/EditMedia/EditSet.vue?vue&type=style&index=0&id=0bfbe54f&lang=scss&scoped=true ***! \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .set-editor-header[data-v-0bfbe54f] { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; } .set-editor-header .editor-name[data-v-0bfbe54f] { font-size: 16px; font-weight: 700; color: var(--media-txt); display: flex; gap: 4px; margin-right: 10px; } .set-editor-header .editor-name label[data-v-0bfbe54f] { position: relative; cursor: pointer; } .set-editor-header .editor-name label input[data-v-0bfbe54f] { field-sizing: content; background: transparent; border-radius: 4px; padding: 0 4px; } .set-editor-header .editor-name label input[data-v-0bfbe54f]:focus { outline: 2px solid #9deba4 !important; } .set-editor-header .editor-name .edit-icon[data-v-0bfbe54f] { position: absolute; right: -15px; top: -10px; z-index: 10; } .set-editor-header .editor-stats[data-v-0bfbe54f] { font-size: 12px; color: var(--media-txt3); } .set-editor[data-v-0bfbe54f] { display: flex; gap: 20px; } .set-editor .set-editor-left[data-v-0bfbe54f] { width: 200px; flex-shrink: 0; background: var(--media-bg); border-radius: 8px; padding: 12px; max-height: 400px; overflow-y: auto; } .set-editor .set-editor-left.disabled[data-v-0bfbe54f] { opacity: 0.7; } .set-editor .set-editor-left h4[data-v-0bfbe54f] { font-size: 12px; color: var(--media-txt3); margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.5px; } .set-editor .set-editor-left .pool-item[data-v-0bfbe54f] { display: flex; align-items: center; gap: 6px; padding: 4px 6px; border-radius: 4px; cursor: pointer; transition: 0.15s; margin-bottom: 2px; } .set-editor .set-editor-left .pool-item[data-v-0bfbe54f]:hover { background: var(--media-pri-l); } .set-editor .set-editor-left .pool-item .pname[data-v-0bfbe54f] { font-size: 11px; color: var(--media-txt); flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .set-editor .set-editor-left .pool-item .padd[data-v-0bfbe54f] { color: var(--media-pri); font-weight: 700; font-size: 14px; } .set-editor .set-editor-right[data-v-0bfbe54f] { flex: 1; min-height: 200px; background: var(--media-srf); border: 2px dashed var(--media-brd); border-radius: 8px; padding: 16px; } .set-editor .set-editor-right h4[data-v-0bfbe54f] { font-size: 12px; color: var(--media-txt3); margin-bottom: 12px; text-transform: uppercase; letter-spacing: 0.5px; font-weight: bold; } .set-editor .set-editor-right .set-item[data-v-0bfbe54f] { display: flex; align-items: center; gap: 8px; padding: 6px 8px; background: var(--media-srf); border: 1px solid var(--media-brd); border-radius: 6px; margin-bottom: 4px; cursor: grab; transition: 0.15s; } .set-editor .set-editor-right .set-item[data-v-0bfbe54f]:hover { border-color: var(--media-pri); background: var(--media-pri-l); } .set-editor .set-editor-right .set-item .drag[data-v-0bfbe54f] { color: var(--media-txt3); font-size: 14px; cursor: grab; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .set-editor .set-editor-right .set-item .pos[data-v-0bfbe54f] { font-size: 11px; color: var(--media-txt3); font-weight: 700; width: 20px; text-align: center; } .set-editor .set-editor-right .set-item .sname[data-v-0bfbe54f] { font-size: 12px; color: var(--media-txt); flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .set-editor .set-editor-right .set-item .remove[data-v-0bfbe54f] { background: none; border: none; color: var(--media-dng); cursor: pointer; font-size: 14px; opacity: 0.5; } .set-editor .set-editor-right .set-item .remove[data-v-0bfbe54f]:hover { opacity: 1; } .set-editor .set-editor-right .set-item button[disabled][data-v-0bfbe54f] { opacity: 0.3; } /*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/pages/EditMedia/EditChess.vue?vue&type=style&index=0&id=4beb0fad&lang=scss&scoped=true ***! \***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .modal-ov[data-v-4beb0fad] { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.45); display: flex; align-items: center; justify-content: center; z-index: 1000; } .modal-ov .modal-md-chess[data-v-4beb0fad] { background: #fff; border-radius: 16px; width: 90%; max-width: 860px; max-height: 85vh; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2); animation: mediaFadeUp 0.25s ease-out; } .modal-ov .modal-md-chess .modal-hd[data-v-4beb0fad] { padding: 20px 24px; border-bottom: 1px solid var(--media-brd); display: flex; justify-content: space-between; align-items: center; } .modal-ov .modal-md-chess .modal-hd h3[data-v-4beb0fad] { font-size: 16px; font-weight: 700; color: var(--media-txt); } .modal-ov .modal-md-chess .modal-hd small[data-v-4beb0fad] { font-size: 12px; color: var(--media-txt3); display: block; margin-top: 4px; } .modal-ov .modal-md-chess .modal-hd .close-btn[data-v-4beb0fad] { cursor: pointer; color: var(--media-txt3); background: none; border: none; font-size: 20px; font-family: inherit; } .modal-ov .modal-md-chess .modal-bd[data-v-4beb0fad] { padding: 24px; overflow-y: auto; flex: 1; } .modal-ov .modal-md-chess .modal-bd .chess-hint[data-v-4beb0fad] { font-size: 11px; color: var(--media-txt3); margin-bottom: 8px; font-style: italic; } .modal-ov .modal-md-chess .modal-bd .chess-legend[data-v-4beb0fad] { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; padding: 8px 12px; background: var(--media-bg); border-radius: 6px; font-size: 11px; color: var(--media-txt2); } .modal-ov .modal-md-chess .modal-bd .chess-legend .chess-legend-item[data-v-4beb0fad] { display: flex; align-items: center; gap: 4px; } .modal-ov .modal-md-chess .modal-bd .chess-legend .chess-legend-item .chess-legend-dot[data-v-4beb0fad] { width: 8px; height: 8px; border-radius: 50%; border: 1.5px solid #fff; box-shadow: 0 0 1px rgba(0, 0, 0, 0.3); } .modal-ov .modal-md-chess .modal-bd .chess-wrap[data-v-4beb0fad] { position: relative; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .modal-ov .modal-md-chess .modal-bd .chess-wrap .chess-secs[data-v-4beb0fad] { display: flex; gap: 20px; overflow-x: auto; padding-bottom: 8px; } .modal-ov .modal-md-chess .modal-bd .chess-wrap .chess-secs .chess-sec-name[data-v-4beb0fad] { font-size: 13px; font-weight: 700; color: var(--media-txt); text-align: center; margin-bottom: 10px; } .modal-ov .modal-md-chess .modal-bd .chess-wrap .chess-secs .chess-floors[data-v-4beb0fad] { display: flex; flex-direction: column-reverse; gap: 10px; } .modal-ov .modal-md-chess .modal-bd .chess-wrap .chess-secs .chess-floors .chess-row[data-v-4beb0fad] { display: flex; align-items: center; gap: 10px; min-height: 28px; } .modal-ov .modal-md-chess .modal-bd .chess-wrap .chess-secs .chess-floors .chess-row .chess-fn[data-v-4beb0fad] { width: 22px; font-size: 11px; color: var(--media-txt3); text-align: right; flex-shrink: 0; } .modal-ov .modal-md-chess .modal-bd .chess-wrap .chess-secs .chess-floors .chess-row .chess-cell[data-v-4beb0fad] { width: 34px; height: 28px; border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 600; cursor: pointer; transition: 0.12s; opacity: 0.4; position: relative; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .modal-ov .modal-md-chess .modal-bd .chess-wrap .chess-secs .chess-floors .chess-row .chess-cell.on[data-v-4beb0fad] { opacity: 1 !important; box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.15); } .modal-ov .modal-md-chess .modal-bd .chess-wrap .chess-secs .chess-floors .chess-row .chess-cell .occ[data-v-4beb0fad] { position: absolute; top: 1px; right: 1px; width: 8px; height: 8px; border-radius: 50%; border: 1.5px solid #fff; box-shadow: 0 0 2px rgba(0, 0, 0, 0.2); } .modal-ov .modal-md-chess .modal-ft[data-v-4beb0fad] { padding: 16px 24px; border-top: 1px solid var(--media-brd); display: flex; gap: 12px; } /*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/pages/EditMedia/Confirm.vue?vue&type=style&index=0&id=39f58617&lang=scss&scoped=true ***! \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .confirm-ov[data-v-39f58617] { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.45); display: flex; align-items: center; justify-content: center; z-index: 1500; } .confirm-ov .confirm-box[data-v-39f58617] { background: #fff; border-radius: 12px; padding: 24px; max-width: 420px; width: 90%; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2); animation: mediaFadeUp 0.2s ease-out; } .confirm-ov .confirm-box h3[data-v-39f58617] { font-size: 16px; font-weight: 700; color: var(--media-txt); margin-bottom: 12px; } .confirm-ov .confirm-box p[data-v-39f58617] { font-size: 13px; color: var(--media-txt2); margin-bottom: 20px; line-height: 1.5; } .confirm-ov .confirm-acts[data-v-39f58617] { display: flex; gap: 12px; justify-content: flex-end; } /*!*******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/pages/EditMedia/index.vue?vue&type=style&index=0&id=c31719ee&scoped=true&lang=scss ***! \*******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ @charset "UTF-8"; .page-wrapper[data-v-c31719ee] { display: flex; flex-direction: column; width: 100%; height: 100%; } .page-wrapper .complex-name[data-v-c31719ee] { font-size: 20px; font-weight: 700; color: var(--media-txt); margin-bottom: 20px; } .page-wrapper .sets-header[data-v-c31719ee] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; } .page-wrapper .sets-header .sets-count[data-v-c31719ee] { font-size: 13px; color: var(--media-txt2); } .page-wrapper .summary-bar[data-v-c31719ee] { display: flex; gap: 16px; align-items: center; padding: 12px 16px; background: var(--media-srf); border: 1px solid var(--media-brd); border-radius: 8px; margin-bottom: 16px; flex-wrap: wrap; } .page-wrapper .summary-bar .summary-item[data-v-c31719ee] { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--media-txt2); } .page-wrapper .summary-bar .summary-item .summary-dot[data-v-c31719ee] { width: 10px; height: 10px; border-radius: 50%; } .page-wrapper .summary-bar .summary-item .summary-num[data-v-c31719ee] { font-weight: 700; color: var(--media-txt); } .page-wrapper .sets-grid[data-v-c31719ee] { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; } .page-wrapper .sets-grid .set-card[data-v-c31719ee] { display: flex; flex-direction: column; background: var(--media-srf); border: 1px solid var(--media-brd); border-radius: 12px; padding: 16px; transition: 0.15s; } .page-wrapper .sets-grid .set-card .set-name[data-v-c31719ee] { font-size: 15px; font-weight: 700; color: var(--media-txt); margin-bottom: 8px; } .page-wrapper .sets-grid .set-card .set-name .set-indicator[data-v-c31719ee] { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; vertical-align: middle; } .page-wrapper .sets-grid .set-card .set-meta[data-v-c31719ee] { font-size: 12px; color: var(--media-txt3); margin-bottom: 12px; } .page-wrapper .sets-grid .set-card .set-thumbs[data-v-c31719ee] { display: flex; gap: 4px; margin-bottom: 12px; overflow: hidden; } .page-wrapper .sets-grid .set-card .set-acts[data-v-c31719ee] { display: flex; gap: 8px; margin-top: auto; } .edit-materials[data-v-c31719ee] { overflow-y: auto; width: 100%; } .edit-materials .message-wrapper[data-v-c31719ee] { display: flex; align-items: flex-start; gap: 10px; background: var(--media-acc-l); border-radius: 8px; border: 1px solid #BBDEFB; margin-bottom: 20px !important; } .edit-materials .message-wrapper .message-text[data-v-c31719ee] { font-size: 13px; color: #1565C0; line-height: 1.5; margin-left: 10px; margin-bottom: 0; } .edit-materials .upload-wrapper[data-v-c31719ee] { cursor: pointer; } .edit-materials .upload-zone[data-v-c31719ee] { width: 100%; border: 2px dashed var(--media-brd); border-radius: 12px; padding: 32px 24px; margin-bottom: 24px; display: flex; align-items: center; justify-content: center; flex-direction: column; font-size: 14px; cursor: pointer; transition: all 0.2s ease; } .edit-materials .upload-zone p[data-v-c31719ee] { font-size: 12px; color: var(--media-txt3); margin-top: 4px; } .edit-materials .upload-zone.drag-over[data-v-c31719ee] { border-color: #43A047; background: var(--media-pri-l); } .edit-materials .upload-zone .upload-title[data-v-c31719ee] { font-size: 14px; font-weight: 700; } .edit-materials .bulk-panel[data-v-c31719ee] { display: flex; align-items: center; gap: 12px; padding: 10px 16px; background: var(--media-pri-l); border: 1px solid var(--media-pri); border-radius: 8px; margin-bottom: 12px; animation: fadeUp 0.2s ease-out; flex-wrap: wrap; } .edit-materials .bulk-panel .bp-count[data-v-c31719ee] { font-size: 13px; color: var(--media-pri-d); font-weight: 600; } .edit-materials .bulk-panel .bp-spacer[data-v-c31719ee] { flex: 1; } .edit-materials .files-list-counter[data-v-c31719ee] { font-size: 13px; color: var(--media-txt2); margin-bottom: 8px; } .edit-materials .file-grid[data-v-c31719ee] { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 12px; margin-top: 16px; } .edit-materials .file-grid .file-card[data-v-c31719ee] { align-items: center; justify-content: center; display: flex; flex-direction: column; background: var(--media-srf); border: 1px solid var(--media-brd); border-radius: 8px; padding: 8px; text-align: center; cursor: pointer; transition: 0.15s; position: relative; } .edit-materials .file-grid .file-card .fchk[data-v-c31719ee] { position: absolute; top: 6px; left: 6px; width: 18px; height: 18px; cursor: pointer; z-index: 2; accent-color: var(--media-pri); margin: 0; display: none; } .edit-materials .file-grid .file-card[data-v-c31719ee]:hover, .edit-materials .file-grid .file-card[data-v-c31719ee]:has(input:checked) { border-color: #43A047; box-shadow: 0 0 0 2px var(--media-pri-l); } .edit-materials .file-grid .file-card:hover .fbtn[data-v-c31719ee], .edit-materials .file-grid .file-card:has(input:checked) .fbtn[data-v-c31719ee] { display: flex; font-size: 11px; justify-content: center; } .edit-materials .file-grid .file-card:hover .fchk[data-v-c31719ee], .edit-materials .file-grid .file-card:has(input:checked) .fchk[data-v-c31719ee] { display: block; } .edit-materials .file-grid .file-card .fbtn[data-v-c31719ee] { position: absolute; top: 4px; right: 4px; background: var(--media-dng); color: var(--media-srf); border: none; border-radius: 50%; width: 18px; height: 18px; font-size: 10px; cursor: pointer; display: none; align-items: center; } .edit-materials .file-grid .file-card .fname[data-v-c31719ee] { font-size: 10px; color: var(--media-txt2); margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; } .edit-materials .file-grid .file-card .fsize[data-v-c31719ee] { font-size: 10px; color: var(--media-txt3); } /* ================== */ /* Загрузка файлов */ /* ================== */ .uploading-list[data-v-c31719ee] { margin: 16px 0; display: flex; flex-direction: column; gap: 8px; } .uploading-item[data-v-c31719ee] { display: flex; align-items: center; gap: 12px; background: var(--media-pri-l); border-radius: 8px; padding: 12px; color: var(--media-pri-d); font-weight: 500; } .uploading-item.errored[data-v-c31719ee] { background: rgba(229, 57, 53, 0.8509803922); font-size: 12px; color: var(--media-pri-l); } /* loader */ .loader[data-v-c31719ee] { width: 16px; height: 16px; border: 2px solid #A5D6A7; border-top-color: var(--media-pri-d); border-radius: 50%; animation: spin-c31719ee 0.8s linear infinite; } @keyframes spin-c31719ee { to { transform: rotate(360deg); } } .subtabs[data-v-c31719ee] { display: flex; gap: 0; margin-bottom: 20px; border-bottom: 2px solid var(--media-brd); } .subtabs .subtab[data-v-c31719ee] { padding: 10px 20px; font-size: 14px; font-weight: 600; color: var(--media-txt3); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; font-family: inherit; background: none; border-top: none; border-left: none; border-right: none; } .subtabs .subtab.on[data-v-c31719ee] { color: #43A047; border-bottom-color: #43A047; } .error-message[data-v-c31719ee] { color: #e53935; font-size: 12px; margin-top: 4px; } input[type=checkbox][data-v-c31719ee] { cursor: pointer; } .error-wrapper[data-v-c31719ee] { display: flex; justify-content: space-between; width: 100%; } .error-wrapper p[data-v-c31719ee] { background: rgba(229, 57, 53, 0.8509803922); font-size: 12px; color: var(--media-pri-l); padding: 0 10px; border-radius: 4px; }