4 @import '~primeng/resources/primeng.css';
5 @import '~primeng/resources/themes/bootstrap/theme.css';
7 @mixin glyphicon-light {
8 font-family: 'Glyphicons Halflings';
9 text-decoration: none !important;
10 color: var(--mainForegroundColor) !important;
13 // data table customizations
15 font-size: 15px !important;
28 padding-left: 15px !important;
31 overflow: hidden !important;
32 text-overflow: ellipsis !important;
33 white-space: nowrap !important;
38 background-color: var(--mainBackgroundColor) !important;
41 &.ui-state-highlight {
42 background-color:var(--submenuColor) !important;
43 color:var(--mainForegroundColor) !important;
50 background-color: var(--submenuColor) !important;
55 display: none !important;
60 border-top: none !important;
64 border-bottom: none !important;
76 border: none !important;
77 border-bottom: 1px solid !important;
78 border-color: var(--submenuColor) !important;
79 text-align: left !important;
80 padding: 5px 0 5px 15px !important;
81 font-weight: $font-semibold !important;
82 color: var(--mainForegroundColor) !important;
84 &.ui-sortable-column:hover {
85 background-color: var(--submenuColor) !important;
86 border: 1px solid !important;
87 border-color: var(--submenuColor) !important;
88 border-width: 0 1px !important;
91 border-width: 0 1px 0 0 !important;
95 &.ui-state-highlight {
96 background-color:var(--submenuColor) !important;
106 @extend .glyphicon-triangle-top;
110 @extend .glyphicon-triangle-bottom;
117 width: 250px !important;
118 padding: 0 !important;
121 my-edit-button + my-delete-button {
127 .ui-paginator-bottom {
128 background-color: var(--mainBackgroundColor) !important;
131 border-top: 1px solid !important;
132 border-color: var(--submenuColor) !important;
135 justify-content: center;
142 @include glyphicon-light;
149 &.ui-state-disabled:hover {
150 background-color: #fff !important;
153 &.ui-paginator-first {
154 @extend .glyphicon-step-backward;
157 &.ui-paginator-prev {
158 @extend .glyphicon-chevron-left;
163 &.ui-paginator-next {
164 @extend .glyphicon-chevron-right;
169 &.ui-paginator-last {
170 @extend .glyphicon-step-forward;
174 .ui-paginator-pages {
175 height: auto !important;
178 color: #000 !important;
179 font-weight: $font-semibold !important;
180 margin: 0 10px !important;
181 outline: 0 !important;
182 border-radius: 3px !important;
183 padding: 5px 2px !important;
184 height: auto !important;
187 &, &:hover, &:active, &:focus {
188 color: #fff !important;
189 background-color: var(--mainColor) !important;
198 // PrimeNG calendar tweaks
199 p-calendar .ui-datepicker {
201 @include disable-default-a-behaviour;
204 .ui-datepicker-header {
206 .ui-datepicker-year {
210 .ui-datepicker-next {
211 @extend .glyphicon-chevron-right;
212 @include glyphicon-light;
215 .ui-datepicker-prev {
216 @extend .glyphicon-chevron-left;
217 @include glyphicon-light;
224 @extend .glyphicon-chevron-up;
225 @include glyphicon-light;
228 .pi.pi-chevron-down {
229 @extend .glyphicon-chevron-down;
230 @include glyphicon-light;
237 border-color: var(--mainColor) !important;
238 background-color: var(--mainColor) !important;
251 transform: rotate(45deg) scale(0);
252 border-right: 2px solid var(--mainBackgroundColor);
253 border-bottom: 2px solid var(--mainBackgroundColor);
258 transform: rotate(45deg) scale(1);