@sankhyalabs/ez-design 2.1.0 → 2.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -100,31 +100,45 @@
100
100
  --most-visible: 3;
101
101
  --hover--inverted: #333333;
102
102
  --icon--color: #626e82;
103
- --scrollbar--primary: var(--title--primary);
104
- --scrollbar--secondary: var(--color--disable-primary); }
103
+ --scrollbar--default: #626e82;
104
+ --scrollbar--background: #e5eaf0;
105
+ --scrollbar--hover: #2b3a54;
106
+ --scrollbar--clicked: #a2abb9; }
105
107
 
106
108
  html,
107
109
  body,
108
110
  body * {
109
111
  scrollbar-width: thin;
110
- scrollbar-color: var(--scrollbar--primary) var(--scrollbar--secondary); }
112
+ scrollbar-color: var(--scrollbar--clicked) var(--scrollbar--background); }
113
+ html::-webkit-scrollbar,
114
+ body::-webkit-scrollbar,
115
+ body *::-webkit-scrollbar {
116
+ background-color: var(--scrollbar--background);
117
+ width: var(--space--medium);
118
+ max-width: var(--space--medium);
119
+ min-width: var(--space--medium); }
111
120
  html::-webkit-scrollbar-track,
112
121
  body::-webkit-scrollbar-track,
113
122
  body *::-webkit-scrollbar-track {
114
- background-color: var(--scrollbar--secondary);
123
+ background-color: var(--scrollbar--background);
115
124
  border-radius: var(--border--radius-small); }
116
125
  html::-webkit-scrollbar-thumb,
117
126
  body::-webkit-scrollbar-thumb,
118
127
  body *::-webkit-scrollbar-thumb {
119
- background-color: var(--scrollbar--primary);
128
+ background-color: var(--scrollbar--default);
120
129
  border-radius: var(--border--radius-small); }
121
- html::-webkit-scrollbar,
122
- body::-webkit-scrollbar,
123
- body *::-webkit-scrollbar {
124
- background-color: var(--scrollbar--secondary);
125
- width: var(--space--medium);
126
- max-width: var(--space--medium);
127
- min-width: var(--space--medium); }
130
+ html::-webkit-scrollbar-thumb:vertical:hover, html::-webkit-scrollbar-thumb:horizontal:hover,
131
+ body::-webkit-scrollbar-thumb:vertical:hover,
132
+ body::-webkit-scrollbar-thumb:horizontal:hover,
133
+ body *::-webkit-scrollbar-thumb:vertical:hover,
134
+ body *::-webkit-scrollbar-thumb:horizontal:hover {
135
+ background-color: var(--scrollbar--hover); }
136
+ html::-webkit-scrollbar-thumb:vertical:active, html::-webkit-scrollbar-thumb:horizontal:active,
137
+ body::-webkit-scrollbar-thumb:vertical:active,
138
+ body::-webkit-scrollbar-thumb:horizontal:active,
139
+ body *::-webkit-scrollbar-thumb:vertical:active,
140
+ body *::-webkit-scrollbar-thumb:horizontal:active {
141
+ background-color: var(--scrollbar--clicked); }
128
142
 
129
143
  /*Medias*/
130
144
  body {
@@ -8669,58 +8683,78 @@ ag-grid, ag-grid-angular, ag-grid-ng2, ag-grid-polymer, ag-grid-aurelia {
8669
8683
  max-height: 150px; }
8670
8684
  .ez-grid .ag-tabs.ag-menu.ag-focus-managed.ag-ltr.ag-popup-child {
8671
8685
  scrollbar-width: thin;
8672
- scrollbar-color: var(--scrollbar--primary) var(--scrollbar--secondary); }
8673
- .ez-grid .ag-tabs.ag-menu.ag-focus-managed.ag-ltr.ag-popup-child::-webkit-scrollbar-track {
8674
- background-color: var(--scrollbar--secondary); }
8675
- .ez-grid .ag-tabs.ag-menu.ag-focus-managed.ag-ltr.ag-popup-child::-webkit-scrollbar-thumb {
8676
- background-color: var(--scrollbar--primary);
8677
- border-radius: var(--border--radius-small); }
8686
+ scrollbar-color: var(--scrollbar--clicked) var(--scrollbar--background); }
8678
8687
  .ez-grid .ag-tabs.ag-menu.ag-focus-managed.ag-ltr.ag-popup-child::-webkit-scrollbar {
8679
- background-color: var(--scrollbar--secondary);
8688
+ background-color: var(--scrollbar--background);
8680
8689
  width: var(--space--medium);
8681
8690
  max-width: var(--space--medium);
8682
8691
  min-width: var(--space--medium); }
8692
+ .ez-grid .ag-tabs.ag-menu.ag-focus-managed.ag-ltr.ag-popup-child::-webkit-scrollbar-track {
8693
+ background-color: var(--scrollbar--background);
8694
+ border-radius: var(--border--radius-small); }
8695
+ .ez-grid .ag-tabs.ag-menu.ag-focus-managed.ag-ltr.ag-popup-child::-webkit-scrollbar-thumb {
8696
+ background-color: var(--scrollbar--default);
8697
+ border-radius: var(--border--radius-small); }
8698
+ .ez-grid .ag-tabs.ag-menu.ag-focus-managed.ag-ltr.ag-popup-child::-webkit-scrollbar-thumb:vertical:hover, .ez-grid .ag-tabs.ag-menu.ag-focus-managed.ag-ltr.ag-popup-child::-webkit-scrollbar-thumb:horizontal:hover {
8699
+ background-color: var(--scrollbar--hover); }
8700
+ .ez-grid .ag-tabs.ag-menu.ag-focus-managed.ag-ltr.ag-popup-child::-webkit-scrollbar-thumb:vertical:active, .ez-grid .ag-tabs.ag-menu.ag-focus-managed.ag-ltr.ag-popup-child::-webkit-scrollbar-thumb:horizontal:active {
8701
+ background-color: var(--scrollbar--clicked); }
8683
8702
  .ez-grid .ag-virtual-list-viewport.ag-column-select-virtual-list-viewport.ag-focus-managed {
8684
8703
  scrollbar-width: thin;
8685
- scrollbar-color: var(--scrollbar--primary) var(--scrollbar--secondary); }
8704
+ scrollbar-color: var(--scrollbar--clicked) var(--scrollbar--background); }
8686
8705
  .ez-grid .ag-virtual-list-viewport.ag-column-select-virtual-list-viewport.ag-focus-managed::-webkit-scrollbar {
8687
- background-color: var(--scrollbar--secondary);
8706
+ background-color: var(--scrollbar--background);
8688
8707
  width: var(--space--medium);
8689
8708
  max-width: var(--space--medium);
8690
8709
  min-width: var(--space--medium); }
8691
8710
  .ez-grid .ag-virtual-list-viewport.ag-column-select-virtual-list-viewport.ag-focus-managed::-webkit-scrollbar-track {
8692
- background-color: var(--scrollbar--secondary); }
8711
+ background-color: var(--scrollbar--background);
8712
+ border-radius: var(--border--radius-small); }
8693
8713
  .ez-grid .ag-virtual-list-viewport.ag-column-select-virtual-list-viewport.ag-focus-managed::-webkit-scrollbar-thumb {
8694
- background-color: var(--scrollbar--primary);
8714
+ background-color: var(--scrollbar--default);
8695
8715
  border-radius: var(--border--radius-small); }
8716
+ .ez-grid .ag-virtual-list-viewport.ag-column-select-virtual-list-viewport.ag-focus-managed::-webkit-scrollbar-thumb:vertical:hover, .ez-grid .ag-virtual-list-viewport.ag-column-select-virtual-list-viewport.ag-focus-managed::-webkit-scrollbar-thumb:horizontal:hover {
8717
+ background-color: var(--scrollbar--hover); }
8718
+ .ez-grid .ag-virtual-list-viewport.ag-column-select-virtual-list-viewport.ag-focus-managed::-webkit-scrollbar-thumb:vertical:active, .ez-grid .ag-virtual-list-viewport.ag-column-select-virtual-list-viewport.ag-focus-managed::-webkit-scrollbar-thumb:horizontal:active {
8719
+ background-color: var(--scrollbar--clicked); }
8696
8720
  .ez-grid .ag-virtual-list-viewport.ag-filter-virtual-list-viewport.ag-focus-managed {
8697
8721
  scrollbar-width: thin;
8698
- scrollbar-color: var(--scrollbar--primary) var(--scrollbar--secondary); }
8722
+ scrollbar-color: var(--scrollbar--clicked) var(--scrollbar--background); }
8699
8723
  .ez-grid .ag-virtual-list-viewport.ag-filter-virtual-list-viewport.ag-focus-managed::-webkit-scrollbar {
8700
- background-color: var(--scrollbar--secondary);
8724
+ background-color: var(--scrollbar--background);
8701
8725
  width: var(--space--medium);
8702
8726
  max-width: var(--space--medium);
8703
8727
  min-width: var(--space--medium); }
8704
8728
  .ez-grid .ag-virtual-list-viewport.ag-filter-virtual-list-viewport.ag-focus-managed::-webkit-scrollbar-track {
8705
- background-color: var(--scrollbar--secondary); }
8729
+ background-color: var(--scrollbar--background);
8730
+ border-radius: var(--border--radius-small); }
8706
8731
  .ez-grid .ag-virtual-list-viewport.ag-filter-virtual-list-viewport.ag-focus-managed::-webkit-scrollbar-thumb {
8707
- background-color: var(--scrollbar--primary);
8732
+ background-color: var(--scrollbar--default);
8708
8733
  border-radius: var(--border--radius-small); }
8734
+ .ez-grid .ag-virtual-list-viewport.ag-filter-virtual-list-viewport.ag-focus-managed::-webkit-scrollbar-thumb:vertical:hover, .ez-grid .ag-virtual-list-viewport.ag-filter-virtual-list-viewport.ag-focus-managed::-webkit-scrollbar-thumb:horizontal:hover {
8735
+ background-color: var(--scrollbar--hover); }
8736
+ .ez-grid .ag-virtual-list-viewport.ag-filter-virtual-list-viewport.ag-focus-managed::-webkit-scrollbar-thumb:vertical:active, .ez-grid .ag-virtual-list-viewport.ag-filter-virtual-list-viewport.ag-focus-managed::-webkit-scrollbar-thumb:horizontal:active {
8737
+ background-color: var(--scrollbar--clicked); }
8709
8738
  .ez-grid .ag-body-viewport {
8710
8739
  scrollbar-width: thin;
8711
- scrollbar-color: var(--scrollbar--primary) var(--scrollbar--secondary); }
8740
+ scrollbar-color: var(--scrollbar--clicked) var(--scrollbar--background); }
8712
8741
  .ez-grid .ag-center-cols-viewport {
8713
8742
  overflow-x: hidden; }
8714
8743
  .ez-grid .ag-body-viewport::-webkit-scrollbar {
8715
- background-color: var(--scrollbar--secondary);
8744
+ background-color: var(--scrollbar--background);
8716
8745
  width: var(--space--medium);
8717
8746
  max-width: var(--space--medium);
8718
8747
  min-width: var(--space--medium); }
8719
8748
  .ez-grid .ag-body-viewport::-webkit-scrollbar-track {
8720
- background-color: var(--scrollbar--secondary); }
8749
+ background-color: var(--scrollbar--background);
8750
+ border-radius: var(--border--radius-small); }
8721
8751
  .ez-grid .ag-body-viewport::-webkit-scrollbar-thumb {
8722
- background-color: var(--scrollbar--primary);
8752
+ background-color: var(--scrollbar--default);
8723
8753
  border-radius: var(--border--radius-small); }
8754
+ .ez-grid .ag-body-viewport::-webkit-scrollbar-thumb:vertical:hover, .ez-grid .ag-body-viewport::-webkit-scrollbar-thumb:horizontal:hover {
8755
+ background-color: var(--scrollbar--hover); }
8756
+ .ez-grid .ag-body-viewport::-webkit-scrollbar-thumb:vertical:active, .ez-grid .ag-body-viewport::-webkit-scrollbar-thumb:horizontal:active {
8757
+ background-color: var(--scrollbar--clicked); }
8724
8758
  .ez-grid .ag-virtual-list-viewport.ag-column-select-virtual-list-viewport.ag-focus-managed {
8725
8759
  padding: 0; }
8726
8760
  .ez-grid .ag-virtual-list-item.ag-column-select-virtual-list-item {
@@ -8735,17 +8769,22 @@ ag-grid, ag-grid-angular, ag-grid-ng2, ag-grid-polymer, ag-grid-aurelia {
8735
8769
  margin: 0; }
8736
8770
  .ez-grid .ag-body-horizontal-scroll-viewport {
8737
8771
  scrollbar-width: thin;
8738
- scrollbar-color: var(--scrollbar--primary) var(--scrollbar--secondary); }
8772
+ scrollbar-color: var(--scrollbar--clicked) var(--scrollbar--background); }
8739
8773
  .ez-grid .ag-body-horizontal-scroll-viewport::-webkit-scrollbar {
8740
- background-color: var(--scrollbar--secondary);
8774
+ background-color: var(--scrollbar--background);
8741
8775
  height: var(--space--medium);
8742
8776
  max-height: var(--space--medium);
8743
8777
  min-height: var(--space--medium); }
8744
8778
  .ez-grid .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-track {
8745
- background-color: var(--scrollbar--secondary); }
8779
+ background-color: var(--scrollbar--background);
8780
+ border-radius: var(--border--radius-small); }
8746
8781
  .ez-grid .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb {
8747
- background-color: var(--scrollbar--primary);
8782
+ background-color: var(--scrollbar--default);
8748
8783
  border-radius: var(--border--radius-small); }
8784
+ .ez-grid .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb:vertical:hover, .ez-grid .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb:horizontal:hover {
8785
+ background-color: var(--scrollbar--hover); }
8786
+ .ez-grid .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb:vertical:active, .ez-grid .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb:horizontal:active {
8787
+ background-color: var(--scrollbar--clicked); }
8749
8788
  .ez-grid .ag-checkbox-input-wrapper.ag-checked > input[type="checkbox"]:before {
8750
8789
  border: var(--border--medium) var(--color--primary); }
8751
8790
  .ez-grid .ag-header__selection-checkbox {