cronapp-framework-js/css/themes/custom/theme-general/table-grid.css

Javascript library for CronApp's projects

.k-grid table .k-button {
    border-radius: var(--borderRadiusFull, 99999px);
    min-width: 32px;
    height: 32px;
    padding: 6px;
    line-height: 1.3;
}

.k-grid table .k-header .k-button {
    border-radius: 0;
    padding: 8px 16px;
}

.k-grid table {
    color: var(--textColor70, #1f1f1f);
}

.k-grid tr td {
    border-bottom: 1px solid rgba(0, 0, 0, .12);
    word-break: break-all;
}

form.k-filter-menu .k-textbox {
    border: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.42);
    border-radius: var(--borderRadiusNone, 0);
}

.k-icon,
.k-tool-icon {
    font-size: var(--textNormalSize, 14px);
    color: var(--textColor40, #393939);
}

.k-grid-header th.k-header,
.k-grid-header th.k-header .k-link,
.k-grid-header th.k-header a,
.k-grid-header th.k-header .k-icon,
.k-grid-header th.k-header .k-tool-icon {
    color: var(--textColor40, #393939);
}

.k-grid-header th.k-header:focus,
.k-grid-header th.k-header:hover,
.k-grid-header th.k-header:focus .k-link,
.k-grid-header th.k-header:focus a,
.k-grid-header th.k-header:focus .k-icon,
.k-grid-header th.k-header:focus .k-tool-icon,
.k-grid-header th.k-header:hover .k-link,
.k-grid-header th.k-header:hover a,
.k-grid-header th.k-header:hover .k-icon,
.k-grid-header th.k-header:hover .k-tool-icon {
    color: var(--colorPrimary40, #5665be);
}

.k-action-buttons {
    display: flex;
}

.k-grid-toolbar .k-button {
    padding: 8px 16px;
}


.k-state-selected,
.k-state-selected:link,
.k-state-selected:visited,
.k-tool.k-state-selected,
.k-grid td.k-state-selected:hover,
.k-grid tr.k-state-selected:hover td,
.k-grid tr td,
.k-header,
.k-pager-wrap,
.k-grid {
    border-color: var(--colorDark10, #d9d9d9);
}

.k-grid-header th.k-header {
    padding: var(--distanceSmall, 15px) var(--distanceMedium, 20px);
}

.k-grid-header th.k-with-icon .k-link {
    float: left;
}

.k-state-selected,
.k-state-selected:link,
.k-state-selected:visited,
.k-tool.k-state-selected,
.k-grid td.k-state-selected:hover,
.k-grid tr.k-state-selected:hover td {
    background: var(--colorDefault40, #3b448e);
}

.k-listbox .k-item,
.k-popup .k-list .k-item,
.k-grid .k-widget select,
.k-list>.k-state-hover,
.k-pager-sizes .k-dropdown-wrap .k-input,
.k-grid .k-widget,
.k-state-hover:hover {
    color: var(--textColor70, #1f1f1f);
}

.k-list>.k-state-hover,
.k-popup .k-list .k-state-focused {
    box-shadow: inset 0 0 2px 0 var(--colorDefault30, #8689af), inset 0 0 7px 0 var(--colorDefault40, #3b448e);
}

.k-grid tbody td>.k-grid-delete {
    margin: 0;
}

.k-list .k-item.k-state-hover.k-state-selected,
.k-list .k-item:hover.k-state-selected,
.k-list-optionlabel:hover.k-state-selected {
    color: var(--colorDefault40, #3b448e);
    background: var(--colorDefault10, #d8d9e3);
}

.k-grid tr td {
    padding: var(--distanceExtraSmall, 10px) var(--distanceMedium, 20px);
}

.k-grid-toolbar .k-button,
.k-grid-header th.k-header>.k-link,
.k-grid tr td {
    font-size: var(--textNormalSize, 14px);
    font-family: var(--fontFamily, "Roboto", "Helvetica Neue", "Arial", sans-serif);
}

.crn-grid-title {
    font-family: var(--fontFamily, "Roboto", "Helvetica Neue", "Arial", sans-serif);
}

.k-grid table tbody tr:hover {
    background: var(--colorDefault10, #d8d9e3);
}

.k-alt,
.k-pivot-layout>tbody>tr:first-child>td:first-child,
.k-resource.k-alt,
.k-separator {
    background: inherit;
}

.k-grid-content {
    overflow: auto;
    overflow-x: auto;
    overflow-y: auto;
}

.k-grid-header th.k-header {
    vertical-align: inherit;
}

.k-autocomplete.k-state-default,
.k-dropdown-wrap,
.k-dropdown-wrap.k-state-default,
.k-multiselect-wrap,
.k-numeric-wrap.k-state-default,
.k-picker-wrap.k-state-default {
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid var(--textColor30, #858585);
    box-shadow: none;
}

/* Pagination - Grid */

.k-pager-wrap .k-link.k-pager-last,
.k-pager-nav.k-pager-first+.k-link,
.k-pager-wrap .k-link {
    border-color: var(--colorDefault20, #b3b5ca);
}

.k-grid .k-pager-numbers .k-link:link,
.k-grid .k-pager-numbers .k-link:visited,
.k-grid .k-pager-numbers .k-nav-current.k-state-hover .k-link,
.k-pager-wrap>.k-link>.k-icon {
    color: var(--colorDefault40, #3b448e);
}

.k-grid .k-pager-numbers .k-state-selected {
    background: var(--colorDefault10, #d8d9e3);
    color: var(--colorDefault70, #20254e);
    box-shadow: none;
    border-color: var(--colorDefault20, #b3b5ca);
    border-width: 1px 0 1px 0;
}

.k-grid-toolbar .k-button-icontext .k-icon{
    margin-top: -3px;
}

.k-grid table .k-button {
    min-width: 32px;
    min-height: 32px;
    padding: 6px;
    line-height: 1.3;
}