@visns-studio/visns-components 4.7.0 → 4.7.2

package/components/crm/sorting/styles/Item.module.css

@@ -1,68 +0,0 @@
-.sortlist {
-    width: 100%;
-    display: grid;
-    grid-gap: 0.5rem;
-    grid-template-columns: repeat(4, 1fr);
-    box-sizing: border-box;
-    padding: 0;
-    margin: 0;
-    list-style: none;
-
-    li {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        flex-wrap: wrap;
-        border-radius: 5px;
-        border: 1px solid rgba(var(--primary-color-rgb), 0.2);
-        box-shadow: 0px 0px 20px rgba(var(--primary-color-rgb), 0.1);
-        padding: 1.25rem;
-        box-sizing: border-box;
-        cursor: pointer;
-        list-style: none;
-        position: relative;
-        color: var(--paragraph-color);
-        user-select: none;
-
-        svg {
-            width: 100%;
-            max-width: 18px;
-            position: absolute;
-            left: 5px;
-            top: 5px;
-        }
-
-        .pencil-edit {
-            width: 100%;
-            max-width: 18px;
-            position: absolute;
-            left: 5px;
-            top: 30px;
-        }
-
-        .trash-delete {
-            width: 100%;
-            max-width: 18px;
-            position: absolute;
-            left: 5px;
-            top: 60px;
-        }
-    }
-
-    .sortimg {
-        width: 50px;
-        position: relative;
-        height: 50px;
-        margin-left: auto;
-        border-radius: 5px;
-        overflow: hidden;
-
-        img {
-            display: block;
-            object-fit: cover;
-            height: 100%;
-            width: 100%;
-            overflow: hidden;
-        }
-    }
-}

package/components/crm/sorting/styles/List.module.css

@@ -1,68 +0,0 @@
-.sortlist {
-    width: 100%;
-    display: grid;
-    grid-gap: 0.5rem;
-    grid-template-columns: repeat(4, 1fr);
-    box-sizing: border-box;
-    padding: 0;
-    margin: 0;
-    list-style: none;
-
-    li {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        flex-wrap: wrap;
-        border-radius: 5px;
-        border: 1px solid rgba(var(--primary-color-rgb), 0.2);
-        box-shadow: 0px 0px 20px rgba(var(--primary-color-rgb), 0.1);
-        padding: 1.25rem;
-        box-sizing: border-box;
-        cursor: pointer;
-        list-style: none;
-        position: relative;
-        color: var(--paragraph-color);
-        user-select: none;
-
-        svg {
-            width: 100%;
-            max-width: 18px;
-            position: absolute;
-            left: 5px;
-            top: 5px;
-        }
-
-        .pencil-edit {
-            width: 100%;
-            max-width: 18px;
-            position: absolute;
-            left: 5px;
-            top: 30px;
-        }
-
-        .trash-delete {
-            width: 100%;
-            max-width: 18px;
-            position: absolute;
-            left: 5px;
-            top: 60px;
-        }
-    }
-
-    .sortimg {
-        width: 50px;
-        position: relative;
-        height: 50px;
-        margin-left: auto;
-        border-radius: 5px;
-        overflow: hidden;
-
-        img {
-            display: block;
-            object-fit: cover;
-            height: 100%;
-            width: 100%;
-            overflow: hidden;
-        }
-    }
-}

package/components/crm/styles/AsyncSelect.module.css

@@ -1,8 +0,0 @@
-.visns__ms input:hover {
-    box-shadow: none !important;
-    transition: box-shadow 0.15s linear !important;
-}
-
-.visns__ms input:focus {
-    box-shadow: none !important;
-}

package/components/crm/styles/Autocomplete.module.css

@@ -1,44 +0,0 @@
-.AutocompletePlace-results {
-    z-index: 999;
-}
-
-.AutocompletePlace {
-    position: relative;
-
-    > svg {
-        position: absolute;
-        right: 0.5em;
-        top: 0.5em;
-        color: var(--primary-color);
-        cursor: pointer;
-    }
-}
-
-.AutocompletePlace.toggleActive {
-    color: var(--highlight-color);
-}
-
-.AutocompletePlace-input {
-    padding: 0.65rem 3rem 0.65rem 0.95rem !important;
-}
-
-.AutocompletePlace-results {
-    position: absolute;
-    background-color: white;
-    padding: 0;
-    margin: 0;
-    border: 1px solid rgba(var(--primary-color-rgb), 0.25);
-    border-radius: var(--br);
-    overflow: hidden;
-}
-
-.AutocompletePlace-items {
-    list-style: none;
-    border-bottom: 1px solid rgba(var(--primary-color-rgb), 0.1);
-    cursor: pointer;
-    padding: 10px 10px;
-}
-
-.AutocompletePlace-items:hover {
-    background-color: rgba(var(--primary-color-rgb), 0.065);
-}

package/components/crm/styles/DataGrid.module.css

@@ -1,210 +0,0 @@
-.btn {
-    width: max-content;
-    display: inline-block;
-    position: relative;
-    padding: 0.65rem 1rem;
-    cursor: pointer;
-    font-size: 1rem;
-    color: var(--tertiary-color);
-    text-decoration: none;
-    overflow: hidden;
-    background: var(--primary-color);
-    border: 1px solid rgba(var(--primary-color--rgb), 1.1);
-    border-radius: var(--br);
-    outline: none;
-    transition: all 0.2s cubic-bezier(0.85, 0, 0.15, 1) 0s;
-    font-size: 1.25em;
-}
-
-.btn:hover {
-    color: var(--primary-color);
-    background: var(--highlight-color);
-    border: 1px solid rgba(var(--highlight-color-rgb), 1.05);
-}
-
-.vs-datagrid--row:hover {
-    .InovuaReactDataGrid__row-cell-wrap {
-        background: rgb(240, 240, 240) !important;
-        cursor: pointer;
-    }
-}
-
-.InovuaReactDataGrid {
-    letter-spacing: 0.015rem !important;
-    color: black !important;
-}
-
-.InovuaReactDataGrid__header {
-    color: var(--primary-color) !important;
-}
-
-.InovuaReactDataGrid__row-hover-target:hover {
-    color: black !important;
-    background: rgb(240, 240, 240) !important;
-}
-
-.InovuaReactDataGrid__row:hover {
-    cursor: pointer;
-}
-
-#smartTableSearchInput {
-    background: #eeeeee;
-    border: 1px solid rgba(var(--table-color-rgb), 1.1);
-    border-radius: var(--br);
-    color: var(--paragraph-color);
-    padding: 10px 10px 10px 35px;
-}
-
-#smartTableSearchInput:focus {
-    border: 1px solid lighten(#474747, 10%);
-    box-shadow: none;
-    transform: translateY(0);
-}
-
-#smartTableSearchInput:hover {
-    box-shadow: none;
-    transform: translateY(0);
-}
-
-.filterInput--alt {
-    position: relative;
-    display: flex;
-    align-items: center;
-
-    input {
-        padding-left: 3rem !important;
-    }
-}
-
-.icon-search {
-    width: max-content;
-    height: auto;
-    position: absolute;
-    z-index: 500;
-    padding-top: 4px;
-    padding-left: 20px;
-}
-
-.filterAction--alt {
-    position: absolute;
-    right: 8px;
-    top: 8px;
-    gap: 5px;
-    display: flex;
-
-    > .btn {
-        padding: 10px 70px;
-    }
-}
-
-.icon-search {
-    width: max-content;
-    height: auto;
-    position: absolute;
-    z-index: 500;
-    padding-top: 4px;
-    padding-left: 20px;
-}
-
-.tdactions {
-    width: 100%;
-    display: flex;
-    flex-wrap: nowrap;
-    justify-content: flex-start;
-    align-items: center;
-    gap: 0.1rem;
-
-    span {
-        display: flex;
-        align-items: center;
-        position: relative;
-        width: 18px;
-        height: 18px;
-
-        svg {
-            width: 18px;
-            height: 18px;
-        }
-    }
-}
-
-.formcontainer {
-    width: 100%;
-}
-
-.modalwrap {
-    background: var(--tertiary-color);
-    border-radius: 3px;
-    overflow: visible;
-    border-top-left-radius: var(--br);
-    border-top-right-radius: var(--br);
-}
-
-.modalwrap .modal {
-    width: 100%;
-    position: relative;
-}
-
-.modalwrap .modal__header {
-    width: 100%;
-    background: var(--primary-color);
-    border: 2px solid rgba(var(--primary-color-rgb), 1.05);
-    border-top-left-radius: var(--br);
-    border-top-right-radius: var(--br);
-    box-sizing: border-box;
-}
-
-.modalwrap .modal__header h1 {
-    color: var(--tertiary-color);
-    margin: 0;
-    padding: 0.75em 0.75em;
-    font-size: 1.15em;
-}
-
-.modalwrap .modal__header .modal__close {
-    width: max-content;
-    position: absolute;
-    right: 5px;
-    top: 5px;
-    box-sizing: border-box;
-    background: rgba(var(--primary-color-rgb), 1.08);
-    cursor: pointer;
-    padding: 8px 8px;
-    margin: 0;
-    outline: none;
-    border: none;
-    border-radius: var(--br);
-    display: block;
-    line-height: 1;
-}
-
-.modalwrap .modal__header .modal__close svg {
-    color: white;
-    display: block;
-}
-
-.modalwrap .modal__content {
-    width: 100%;
-    position: relative;
-    padding: 0.25rem;
-    box-sizing: border-box;
-    border-top-left-radius: var(--br);
-    border-top-right-radius: var(--br);
-}
-
-.modalwrap .modal__content .btn {
-    background: var(--primary-color);
-    border: 1px solid rgba(var(--primary-color-rgb), 1.05);
-}
-
-.modalwrap .modal__content .btn:hover {
-    background: var(--highlight-color);
-    color: var(--primary-color);
-}
-
-.top--modal {
-    width: 100%;
-    max-width: 1000px !important;
-    height: auto;
-    padding: 0 !important;
-}

package/components/crm/styles/Field.module.css

@@ -1,311 +0,0 @@
-/* Form Styling */
-
-.formItem {
-    width: 50%;
-    padding: 0.35em;
-    position: relative;
-    box-sizing: border-box;
-}
-
-.dropdownContainer {
-    position: relative;
-    width: 100%;
-}
-
-.selectFullWidth {
-    width: 90%;
-}
-
-.buttonRight {
-    position: absolute;
-    right: 0;
-    top: 50%;
-    transform: translateY(-50%);
-    z-index: 1;
-    background: var(--primary-color);
-    color: var(--secondary-color);
-    padding: 1rem 0.5rem;
-    border: none;
-    border-radius: var(--br);
-    cursor: pointer;
-    transition: background 0.3s;
-}
-
-.buttonRight:hover {
-    background: var(--secondary-color);
-    color: var(--primary-color);
-}
-
-.formItem {
-    width: 50%;
-    padding: 0.5em;
-    position: relative;
-    box-sizing: border-box;
-}
-
-.formItem .fi__label {
-    position: relative;
-    display: block;
-
-    > svg {
-        position: absolute;
-        right: 0.5em;
-        top: 1em;
-        color: var(--paragraph-color);
-        cursor: pointer;
-    }
-}
-
-.fi__span {
-    position: absolute;
-    transition: all 200ms;
-    opacity: 0.8;
-    left: 0;
-    padding: 19px 20px;
-    transform-origin: top left;
-    cursor: text;
-}
-
-.fi__span::before {
-    content: '';
-    display: block;
-    height: 0;
-    width: 0;
-    margin-top: calc((1 - 1.25) * 0.5em);
-}
-
-.fi__toggletxt {
-    position: relative;
-    left: 5px;
-    font-size: 0.95em;
-    top: -5px;
-}
-
-input:not(:placeholder-shown) + .fi__span,
-textarea:not(:placeholder-shown) + .fi__span,
-select:not(:placeholder-shown) + .fi__span {
-    transform: translateY(-40%) translateX(10px) scale(0.75);
-    opacity: 1;
-    padding: 0 4px;
-    background: var(--tertiary-color);
-    font-weight: 300;
-    border-radius: var(--br);
-}
-
-.prefocus {
-    transform: translateY(-40%) translateX(10px) scale(0.75) !important;
-    opacity: 1 !important;
-    padding: 0 4px !important;
-    background: var(--tertiary-color) !important;
-    z-index: 500;
-    font-weight: 300;
-    border-radius: var(--br);
-    top: 0;
-}
-
-.fwItem {
-    flex-basis: 100%;
-}
-
-.lastItem {
-    .btn {
-        width: 100%;
-    }
-}
-
-.fi__button--right {
-    position: absolute;
-    right: 50px;
-    top: 20px;
-    z-index: 500;
-    background: var(--primary-color);
-    color: var(--item-color);
-    padding: 0.2rem 0.4rem;
-    border: none;
-    border-radius: var(--br);
-    cursor: pointer;
-    transition: background 0.3s;
-}
-
-.fi__button--right:hover {
-    background: var(--secondary-color);
-    color: var(--primary-color);
-}
-
-.formItem textarea,
-.formItem select,
-.formItem
-    input[type]:not([type='search']):not([type='url']):not([type='hidden']):not(
-        [type='checkbox']
-    ):not(.inovua-react-toolkit-combo-box__input):not(
-        .inovua-react-toolkit-date-input__input
-    ):not(.inovua-react-toolkit-text-input__input):not(
-        .inovua-react-toolkit-numeric-input__input
-    ) {
-    background: var(--item-color);
-    border-radius: var(--br);
-    padding: 1rem;
-    outline: none;
-    width: 100%;
-    box-sizing: border-box;
-    color: var(--paragraph-color);
-    transition: box-shadow 0.15s linear;
-}
-
-.formItem textarea:hover,
-.formItem select:hover,
-.formItem
-    input[type]:not([type='search']):not([type='url']):not([type='hidden']):not(
-        [type='checkbox']
-    ):not(.inovua-react-toolkit-combo-box__input):not(
-        .inovua-react-toolkit-date-input__input
-    ):not(.inovua-react-toolkit-numeric-input__input):hover {
-    border: 1px solid rgba(var(--paragraph-color-rgb), 0.85);
-    transition: border 0.15s linear;
-}
-
-.formItem textarea:focus,
-.formItem select:focus,
-.formItem
-    input[type]:not([type='search']):not([type='url']):not([type='hidden']):not(
-        [type='checkbox']
-    ):not(.inovua-react-toolkit-combo-box__input):not(
-        .inovua-react-toolkit-date-input__input
-    ):not(.inovua-react-toolkit-numeric-input__input):focus {
-    border: 1px solid rgba(var(--paragraph-color-rgb), 0.85);
-}
-
-input[type='file'] {
-    background: var(--item-color) !important;
-    border-radius: var (--br) !important;
-    border: 1px solid transparent !important;
-    padding: 0.8rem !important;
-    outline: none !important;
-    width: 100% !important;
-    box-sizing: border-box !important;
-    color: var(--paragraph-color) !important;
-    transition: box-shadow 0.15s linear !important;
-}
-
-input[type='file']:focus {
-    border: 1px solid var(--highlight-color);
-}
-
-input[type='file']:hover {
-    border: 1px solid var(--highlight-color);
-}
-
-/* Signature styling */
-.signaturePlaceholder {
-    border: 1px solid #ccc;
-    border-radius: var(--br);
-    padding: 10px;
-    background: var(--item-color);
-    text-align: center;
-}
-
-.signatureImage {
-    max-width: 100%;
-    max-height: 50px;
-    margin-bottom: 10px;
-}
-
-.signButton {
-    background: var(--primary-color);
-    color: var(--secondary-color);
-    padding: 0.5rem 1rem;
-    border: none;
-    border-radius: var(--br);
-    cursor: pointer;
-    transition: background 0.3s;
-}
-
-.signButton:hover {
-    background: var(--secondary-color);
-    color: var(--primary-color);
-}
-
-/* Table Styles */
-
-.contentTable {
-    width: 100%;
-    border-collapse: collapse;
-    margin: 0 auto;
-    font-size: 1em;
-    border-radius: var(--br) var(--br) 0 0;
-    overflow: hidden;
-    border: none;
-    border-spacing: 0;
-    box-sizing: border-box;
-}
-
-.contentTable thead {
-    display: table-row-group;
-}
-
-.contentTable thead tr {
-    background: var(--table-color);
-    color: var(--primary-color);
-    text-align: left;
-    font-weight: 700;
-    text-transform: capitalize;
-    font-size: 1em;
-}
-
-.contentTable .filterRow th {
-    padding: 0;
-}
-
-.contentTable th {
-    font-size: 0.95em;
-    padding: 8px 15px;
-    color: var(--table-text-color, var(--paragraph-color));
-    border-right: 1px solid var(--table-border);
-    line-height: 1;
-    border-spacing: 0;
-    border-collapse: collapse;
-}
-
-.contentTable td {
-    font-size: 0.95em;
-    padding: 8px 15px;
-    color: var(--paragraph-color);
-    border-right: 1px solid var(--table-border);
-    line-height: 1;
-    border-spacing: 0;
-    border-collapse: collapse;
-}
-
-.contentTable th:last-of-type,
-.contentTable td:last-of-type,
-.contentTable th:last-child,
-.contentTable td:last-child {
-    border-right: none;
-}
-
-.contentTable td .tdActions {
-    width: 100%;
-    display: flex;
-    flex-wrap: nowrap;
-    justify-content: flex-start;
-    align-items: center;
-}
-
-.contentTable td .tdAction {
-    background: #f0f0f0;
-    display: block;
-    line-height: 1;
-    padding: 0.05rem;
-    border-radius: var(--br);
-    margin: 0 0.25rem;
-}
-
-.contentTable tbody tr {
-    border-bottom: 1px solid var(--table-border);
-    cursor: pointer;
-    background: var(--tertiary-color);
-}
-
-.contentTable tbody tr:nth-of-type(even) {
-    background: darken(var(--secondary-color), 2%);
-}