funda-ui 4.5.711 → 4.5.713

package/publish/lib/esm/MultipleSelect/index.scss

@@ -1,398 +0,0 @@
-/* ======================================================
-    <!-- Multiple Select -->
-/* ====================================================== */
-.m-select-v2__wrapper {
-
-    --m-select-v2-wrapper-min-w: 350px;
-    --m-select-v2-wrapper-min-h: 315px;
-    --m-select-v2-header-font-size: 0.75rem;
-    --m-select-v2-body-font-size: 0.75rem;
-    --m-select-v2-scrollbar-color: rgba(0, 0, 0, 0.2);
-    --m-select-v2-scrollbar-track: rgba(0, 0, 0, 0);
-    --m-select-v2-scrollbar-w: 10px;
-    --m-select-v2-search-icon-color: #333;
-    --m-select-v2-body-bg: #fff;
-    --m-select-v2-header-bg: #dee2e6;
-    --m-select-v2-border-color: #dee2e6;
-    --m-select-v2-search-input-w: 100px;
-    --m-select-v2-search-input-bg: #fff;
-    --m-select-v2-search-input-text-color: #333;
-
-
-	min-width: var(--m-select-v2-wrapper-min-w);
-	min-height: var(--m-select-v2-wrapper-min-h);
-	width: 100%;
-	height: 100%;
-	border: solid 1px var(--m-select-v2-border-color);
-	border-radius: 0.35rem;
-	position: relative;
-	background: var(--m-select-v2-body-bg);
-
-
-    .m-select-v2-diving-line {
-        width: 1px;
-        background-color: var(--m-select-v2-border-color);
-        left: 50%;
-        top: 0;
-        position: absolute;
-        height: 100%;
-        z-index: 1;
-    }
-
-    .m-select-v2-inner {
-        display: flex;
-        font-size: 0.8em;
-        height: 100%;
-
-        div.m-select-v2__selected__container,
-        div.m-select-v2__available__container {
-            position: relative;
-            flex: 1;
-        }
-
-
-        /* Main */
-        div {
-            &.m-select-v2__selected__container {
-                .m-select-v2__header {
-                    border-radius: 0 0.35rem 0 0;
-                }
-            }
-            &.m-select-v2__available__container {
-                .m-select-v2__header {
-                    border-radius: 0.35rem 0 0 0;
-                }
-            }
-        }
-
-        /* List */
-        .m-select-v2-draggable-list {
-            font-size: var(--m-select-v2-body-font-size);
-
-            overflow: hidden;
-            overflow-y: auto;
-            max-height: calc(var(--m-select-v2-wrapper-min-h) - 1.75rem);
-            &::-webkit-scrollbar {
-                width: var(--m-select-v2-scrollbar-w);
-            }
-            &::-webkit-scrollbar-thumb {
-                background: var(--m-select-v2-scrollbar-color);
-            }
-            &::-webkit-scrollbar-track {
-                background: var(--m-select-v2-scrollbar-track);
-            }
-
-
-            /* Search Result */
-            .m-select-v2-draggable-list__item.hide {
-                display: none;
-            }
-        }
-
- 
-        /* Header */
-        .m-select-v2__header {
-            border: none;
-            font-size: var(--m-select-v2-header-font-size);
-            margin-bottom: 1px;
-            background: var(--m-select-v2-header-bg);
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-            height: 1.625rem;
-        }
-        .m-select-v2__btn--add-all {
-            padding: 0.2rem;
-        }
-        .m-select-v2__btn--remove-all {
-            padding: 0.2rem;
-        }
-        .m-select-v2__count {
-            padding: 0.2rem;
-        }
-        .m-select-v2__title {
-            padding: 0.2rem;
-            font-weight: bold;
-        }
-
-
-        /* Search */
-        .m-select-v2__search__container {
-            position: relative;
-
-            /* required */
-            align-items: center;
-            display: flex;
-
-            input.m-select-v2__search {
-                height: 14px;
-                padding: .1rem .5rem;
-                opacity: 0.5;
-                margin: 4px;
-                width: var(--m-select-v2-search-input-w);
-                background-color: var(--m-select-v2-search-input-bg);
-                color: var(--m-select-v2-search-input-text-color);
-                border-radius: 25px;
-                border: none;
-                outline: none;
-                box-shadow: none;
-            }
-
-            i {
-                position: absolute;
-                right: .6em;
-
-                svg {
-                    fill: var(--m-select-v2-search-icon-color);
-                }
-            }
-        }
-
-    }
-}
-
-
-
-/*
-///////////////////////////////////////////////////////////
-//////////////////// DragDrop List  //////////////////
-///////////////////////////////////////////////////////////
-*/
-
-.m-select-v2-draggable-list {
-
-    --m-select-v2-draggable-content-bg: transparent;
-    --m-select-v2-draggable-content-color: inherit;
-    --m-select-v2-draggable-border-color: #ddd;
-    --m-select-v2-draggable-wrapper-radius: 0.25rem;
-    --m-select-v2-draggable-control-radius: 0.25rem;
-    --m-select-v2-draggable-primary-color: #ffa940;
-    --m-select-v2-draggable-content-diff-bg: #fafafa;
-    --m-select-v2-draggable-content-diff-border-color: #d9d9d9;
-    --m-select-v2-draggable-control-fs: 0.75rem;
-    --m-select-v2-draggable-control-w: 100px;
-    --m-select-v2-draggable-btn-confirm-bg: #52c41a;
-    --m-select-v2-draggable-btn-cancel-bg: #ff4d4f;
-    --m-select-v2-draggable-btn-color: #fff;
-
-
-    list-style: none;
-    padding: 0;
-    margin: 0;
-    width: 100%;
-    position: relative;
-
-    /* hide wrapper border */
-    border-width: 0;
-    border-radius: 0;
-
-    li {
-        margin: 0;
-        padding: 0;
-    }
-
-    .m-select-v2-draggable-list__item {
-        padding: 0;
-        position: relative;
-        transition: transform 0.15s ease;
-        position: relative;
-
-        .m-select-v2-draggable-list__itemcontent {
-            padding: 5px 15px;
-            background: var(--m-select-v2-draggable-content-bg);
-            color: var(--m-select-v2-draggable-content-color);
-            border-bottom: 1px solid var(--m-select-v2-draggable-border-color);
-            display: flex;
-            align-items: center;
-            user-select: none;
-            transition: all 0.15s ease;
-
-            .m-select-v2-draggable-list__itemcontent-inner {
-                display: flex;
-                align-items: center;
-                justify-content: space-between;
-                width: 100%;
-                
-            }
-        }
-
-        &.disabled {
-            pointer-events: none !important;
-            opacity: .4 !important;
-        }
-    }
-
-    &.alternate-collapse {
-        .m-select-v2-draggable-list__collapse-arrow {
-            cursor: pointer;
-            display: inline-block;
-            width: 20px;
-            text-align: center;
-            user-select: none;
-            margin-left: .2rem;
-
-            svg {
-                transition: all 0.15s ease;
-            }
-
-            &:hover {
-                opacity: 0.7;
-            }
-        }
-
-        .m-select-v2-draggable-list__item {
-            &.has-children {
-                position: relative;
-            }
-
-            &.collapsed {
-                .m-select-v2-draggable-list__collapse-arrow svg {
-                    transform: rotate(-90deg);
-                }
-            }
-        }
-    }
-
-    .m-select-v2-draggable-list__item.draggable .m-select-v2-draggable-list__itemcontent {
-        padding-left: 1.5em;
-    }
-
-
-    &.handle-pos-right .m-select-v2-draggable-list__item.draggable .m-select-v2-draggable-list__itemcontent,
-    &.icon-hide .m-select-v2-draggable-list__item.draggable .m-select-v2-draggable-list__itemcontent {
-        padding-left: .5rem;
-    }
-
-
-    .m-select-v2-draggable-list__item {
-        &.block.draggable {
-            cursor: move;
-        }
-
-        &.dragging .m-select-v2-draggable-list__itemcontent {
-            background: #fff9e6;
-            border: 1px dashed #ffd591;
-            opacity: 0.8;
-        }
-
-        &.drag-over .m-select-v2-draggable-list__itemcontent {
-            background: #fff9e6;
-            border: 2px solid #ffd591;
-        }
-
-        &.drag-over-top::before {
-            content: '';
-            position: absolute;
-            top: -3px;
-            left: 0;
-            right: 0;
-            height: 2px;
-            background: var(--m-select-v2-draggable-primary-color);
-            border-radius: 1px;
-        }
-
-        &.drag-over-bottom::after {
-            content: '';
-            position: absolute;
-            bottom: -3px;
-            left: 0;
-            right: 0;
-            height: 2px;
-            background: var(--m-select-v2-draggable-primary-color);
-            border-radius: 1px;
-        }
-    }
-
-    /* Fix the problem that mobile terminals cannot be touched, DO NOT USE "<svg>" */
-    .m-select-v2-draggable-list__handle {
-        color: #999;
-        padding: 5px;
-        cursor: move;
-        transition: color 0.15s ease;
-        position: absolute;
-        width: 1em;
-        height: 1em;
-        top: 50%;
-        transform: translateY(-50%);
-        z-index: 1;
-        display: flex;
-        align-items: center;
-        font-size: 0.75rem;
-
-        &.left {
-            left: 0;
-        }
-
-        &.right {
-            right: 1em;
-        }
-    }
-
-    .m-select-v2-draggable-list__item,
-    .m-select-v2-draggable-list__itemcontent {
-        transition: all 0.15s ease;
-    }
-
-
-    .m-select-v2-draggable-list__item {
-        &.editing .m-select-v2-draggable-list__itemcontent,
-        &:hover .m-select-v2-draggable-list__itemcontent {
-            background: var(--m-select-v2-draggable-content-diff-bg);
-            border-color: var(--m-select-v2-draggable-content-diff-border-color);
-        }
-        
-
-        &.block:hover .m-select-v2-draggable-list__handle {
-            color: var(--m-select-v2-draggable-primary-color);
-        }
-
-    }    
-
-    &.handle .m-select-v2-draggable-list__handle:hover {
-        color: var(--m-select-v2-draggable-primary-color);
-    }
-
-    /* FORM */
-    .m-select-v2-draggable-list__edit-form {
-        display: flex;
-        flex: 1;
-        gap: 10px;
-        align-items: center;
-
-        input {
-            padding: 4px 8px;
-            border: 1px solid var(--m-select-v2-draggable-border-color);
-            border-radius: var(--m-select-v2-draggable-control-radius);
-            font-size: var(--m-select-v2-draggable-control-fs);
-            width: var(--m-select-v2-draggable-control-w);
-        }
-    }
-
-    .m-select-v2-draggable-list__edit-buttons {
-        display: flex;
-        gap: 5px;
-
-        button {
-            padding: .2rem .5rem;
-            border: none;
-            font-size: 0.75rem;
-            border-radius: var(--m-select-v2-draggable-control-radius);
-            cursor: pointer;
-    
-            &:first-child {
-                background: var(--m-select-v2-draggable-btn-confirm-bg);
-                color: var(--m-select-v2-draggable-btn-color);
-            }
-
-            &:last-child {
-                background: var(--m-select-v2-draggable-btn-cancel-bg);
-                color: var(--m-select-v2-draggable-btn-color);
-            }
-
-            &:hover {
-                opacity: 0.8;
-            }
-        }
-    }
-
-}