fastlion-amis
Version:
一种MIS页面生成工具
1 lines • 8.55 kB
Source Map (JSON)
{"version":3,"sourceRoot":"","sources":["../../src/components/DragModal/dragDialog.scss"],"names":[],"mappings":"AAGE;EACE;EACA;;AAGA;EACE;;AAEA;EACE;EACA;;AAEA;EACE;EACA;;AAIA;EAEE;EACA;EAEA;EAEA;;AAIJ;EACE;;AACA;EACE;;AAMN;EACE;;AAGF;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAIA;AAAA;EAEE;EACA;EACA;EAEA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EAEA;EACA;EACA;;AAEA;EACE;EACA;;AAIA;EACE;;AAMR;EACE;;AAMI;EACE;;AASR;EACE;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;;AAGF;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;;AAMR;EACE;;;AAQJ;EACE;;AAME;EACE;;AACA;EACE;;AACA;EACE;;;AAQZ;EACE;;;AAIA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;;AAEA;EACE;;AAIJ;EAEE;EACA;;;AAIJ;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;;AAKA;EACE;;AAIJ;EACE;EACA;;AAGF;EACE;;AACA;EACE;;;AAOF;EACE;;;AAKN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAEE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;;AAKF;EACE;;AAGF;EACE;;AAGF;AAAA;EAEE;;AAGF;EACE;;;AAIJ;EACE","file":"dragDialog.css","sourcesContent":[".ant-modal-root {\n\n // 如果要改弹窗内部样式请在下面的作用域修改 不然会影响其他弹窗\n .ant-modal-wrap.drag-dialog {\n height: 100%;\n overflow: hidden;\n\n // top: 45px !important;\n .fl-modal {\n padding-bottom: 0px !important;\n\n .resize-container {\n pointer-events: auto;\n height: 100%;\n\n .ant-modal-content {\n height: 100%;\n width: 100%;\n }\n\n .ant-modal-footer {\n .drag-modal {\n // margin-top: 8px;\n box-sizing: border-box;\n padding: 0;\n // background: transparent;\n text-align: right;\n // border-top: 1px solid #f0f0f0;\n border-radius: 0 0 2px 2px;\n }\n }\n\n &.height-auto {\n height: auto !important;\n .ant-modal-body {\n height: auto !important;\n }\n }\n }\n\n\n .ant-modal-header {\n cursor: move;\n }\n\n .ant-modal-body {\n flex: unset;\n padding: 8px;\n }\n\n // 电脑的弹窗\n &.pc-dialog {\n height: 100vh !important;\n width: 100% !important;\n max-width: 100vw !important;\n overflow: hidden;\n padding: 0;\n\n .icon {\n cursor: pointer;\n }\n\n .ant-modal-header {\n padding: 0px !important;\n // background: #F7F8FA;\n // border-bottom: none;\n\n .move-title,\n .disabled-move-title {\n user-select: none;\n font-size: 16px;\n font-weight: bold;\n // color: #2A3E61;\n color: var(--saas-Title-Text);\n }\n\n .dialog-title {\n display: flex;\n width: 100%;\n padding: 16px 24px;\n align-items: center;\n justify-content: space-between;\n }\n\n .tools-bar {\n display: flex;\n justify-content: flex-end;\n // gap: 10px;\n width: 75px;\n color: var(--saas-Title-Text);\n font-size: 14px;\n\n .tool-btn {\n width: 1em;\n height: 1em;\n }\n\n div {\n &:not(:first-child) {\n margin-left: 10px;\n }\n }\n }\n }\n\n .ant-modal-footer:empty {\n display: none;\n }\n\n .ant-modal-close {\n .ant-modal-close-x {\n svg {\n .st0 {\n fill: #AAB2C0;\n }\n }\n }\n }\n }\n\n // 手机的弹窗 说实话真的有这种东西吗?\n &.mb-dialog {\n .ant-modal-footer {\n padding: 0px !important;\n }\n\n .ant-modal-header {\n border-bottom: 0px solid #fff !important;\n border-radius: 25px !important;\n padding: 0px !important;\n\n .move-title {\n font-weight: 400;\n color: rgba(51, 51, 51, 1);\n padding: rem(40) 0px;\n text-align: center;\n color: #333;\n font-size: 18px\n }\n }\n\n .ant-modal-content {\n border-radius: 25px !important;\n font-size: 15px\n }\n\n .foot-mb {\n display: flex;\n height: 48px;\n\n &>div {\n width: 50%;\n height: 100%;\n text-align: center;\n display: flex;\n justify-content: center;\n align-items: center;\n font-weight: 500;\n }\n\n &>div:first-child {\n border-right: 1px solid #e8e8e8;\n color: #333;\n font-size: 16px\n }\n\n &>div:last-child {\n color: #2A87EB;\n font-size: 16px\n }\n }\n }\n }\n\n .handle-box {\n pointer-events: all;\n }\n\n }\n}\n\n// 防止被其他样式覆盖\n.drag-dialog {\n .ant-modal-body {\n max-height: 100% !important;\n }\n\n // 配置通用样式 \n .common-modal-component {\n &.fl-modal {\n .ant-modal-header {\n background-color: var(--saas-Background-Header) !important;\n .dialog-title {\n padding: 6px 16px !important;\n .disabled-move-title {\n font-size: 14px !important;\n }\n }\n }\n }\n }\n}\n\n.fixed-hover-title {\n display: none;\n}\n\n.dialog-fix-right {\n .dialog-title {\n position: relative;\n }\n\n .fixed-hover-title {\n display: block;\n opacity: 0;\n position: absolute;\n top: 30px;\n left: -30px;\n padding: 2px;\n width: 30px;\n // background-color: #fff;\n background-image: linear-gradient(180deg, rgba(53, 116, 238, 0.16) 0%, rgba(255, 255, 255, 0.3) 100%);\n border-radius: 4px;\n text-align: center;\n transition: all .3s ease;\n\n &.show {\n opacity: 1;\n }\n }\n\n &:hover {\n // right: 0 !important;\n transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);\n transition-duration: .2s;\n }\n}\n\n.resize-container {\n pointer-events: auto;\n height: 100%;\n\n &::before {\n content: '';\n position: absolute;\n left: 0;\n top: -100vh;\n width: 100%;\n height: 50px;\n // background-color: rgba(180, 180, 180, 0.5);\n transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);\n transition-duration: .2s;\n\n }\n\n &.sticky-right {\n &::before {\n height: 200vh;\n }\n }\n\n .ant-modal-content {\n height: 100%;\n width: 100%;\n }\n\n &.height-auto {\n height: auto !important;\n .ant-modal-body {\n height: auto !important;\n }\n }\n}\n\n.fl-dialog-box {\n &.isDragging {\n .mini-dialog-wrap {\n pointer-events: auto;\n }\n }\n}\n\n.mini-dialog-wrap {\n position: fixed;\n top: 0;\n left: 0;\n width: 100vw !important;\n height: 100vh !important;\n overflow: hidden;\n pointer-events: none;\n}\n\n.mini-dialog-drag-box {\n // position: fixed !important;\n display: none !important;\n pointer-events: auto;\n opacity: 0.8;\n transition: opacity .3s ease;\n\n &:hover {\n opacity: 1;\n }\n\n &.show {\n display: block !important;\n }\n}\n\n.min-dialog {\n z-index: 1;\n position: fixed;\n height: 50px;\n background: #fff;\n padding: 5px 10px;\n bottom: 0px;\n right: 0px;\n display: flex;\n align-items: center;\n box-shadow: 0 8px 12px 0 rgb(115 107 107 / 30%);\n border-radius: 5px;\n\n .move-title {\n user-select: none;\n font-weight: bold;\n color: #2A3E61;\n }\n\n .dialog-title {\n display: flex;\n width: 100%;\n padding: 20px;\n align-items: center;\n justify-content: space-between;\n }\n\n .tools-bar {\n display: flex;\n justify-content: space-between;\n width: 50px;\n }\n}\n\n.fl-dialog-wrapper {\n .ant-modal-header {\n padding: 0px;\n }\n\n .init-modal {\n padding-bottom: 0px !important;\n }\n\n .move-title,\n .disabled-move-title {\n padding: 16px 24px !important;\n }\n\n .move-title {\n cursor: Move;\n }\n}\n\n.react-draggable-transparent-selection {\n pointer-events: none !important;\n}"]}