806 lines
24 KiB
CSS
806 lines
24 KiB
CSS
/*!**********************************************************************************************************************************************************************************************************************************************!*\
|
|
!*** 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;
|
|
}
|