@ihk-gfi/lux-components-theme 21.5.0 → 21.6.0

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.
@@ -38942,7 +38942,7 @@ lux-filter-load-dialog lux-dialog-actions.lux-filter-dialog-action {
38942
38942
  max-width: 100%;
38943
38943
  box-sizing: border-box;
38944
38944
  gap: 12px;
38945
- place-content: center end;
38945
+ place-content: center center;
38946
38946
  align-items: center;
38947
38947
  }
38948
38948
 
@@ -39327,6 +39327,44 @@ lux-input-ac lux-input-ac-suffix {
39327
39327
  white-space: nowrap;
39328
39328
  }
39329
39329
 
39330
+ lux-button.lux-icon-button.lux-input-clear-btn {
39331
+ display: flex;
39332
+ --mat-icon-button-container-shape: var(--lux-theme-button-icon-container-shape);
39333
+ --mat-icon-button-icon-color: var(--lux-theme-primary-color);
39334
+ --mat-icon-button-icon-size: var(--mat-icon-button-icon-size);
39335
+ --mat-icon-button-state-layer-size: 40px;
39336
+ --mat-icon-button-state-layer-color: var(--mat-sys-on-surface-variant);
39337
+ --mat-icon-button-touch-target-size: calc(var(--lux-theme-form-min-height) - 2 * var(--lux-theme-form-border-width));
39338
+ }
39339
+ lux-button.lux-icon-button.lux-input-clear-btn lux-icon,
39340
+ lux-button.lux-icon-button.lux-input-clear-btn .lux-icon {
39341
+ width: var(--mat-icon-button-icon-size);
39342
+ height: var(--mat-icon-button-icon-size);
39343
+ }
39344
+ lux-button.lux-icon-button.lux-input-clear-btn button:not([disabled]):focus,
39345
+ lux-button.lux-icon-button.lux-input-clear-btn button:not([disabled]):focus-visible {
39346
+ outline-color: transparent !important;
39347
+ }
39348
+
39349
+ .lux-dense-authentic lux-button.lux-icon-button.lux-input-clear-btn {
39350
+ display: flex;
39351
+ --mat-icon-button-container-shape: var(--lux-theme-button-icon-container-shape);
39352
+ --mat-icon-button-icon-color: var(--lux-theme-primary-color);
39353
+ --mat-icon-button-icon-size: var(--mat-icon-button-icon-size);
39354
+ --mat-icon-button-state-layer-size: 36px;
39355
+ --mat-icon-button-state-layer-color: var(--mat-sys-on-surface-variant);
39356
+ --mat-icon-button-touch-target-size: calc(var(--lux-theme-form-dense-min-height) - 2 * var(--lux-theme-form-border-width));
39357
+ }
39358
+ .lux-dense-authentic lux-button.lux-icon-button.lux-input-clear-btn lux-icon,
39359
+ .lux-dense-authentic lux-button.lux-icon-button.lux-input-clear-btn .lux-icon {
39360
+ width: var(--mat-icon-button-icon-size);
39361
+ height: var(--mat-icon-button-icon-size);
39362
+ }
39363
+ .lux-dense-authentic lux-button.lux-icon-button.lux-input-clear-btn button:not([disabled]):focus,
39364
+ .lux-dense-authentic lux-button.lux-icon-button.lux-input-clear-btn button:not([disabled]):focus-visible {
39365
+ outline-color: transparent !important;
39366
+ }
39367
+
39330
39368
  lux-link-plain {
39331
39369
  display: inline-flex;
39332
39370
  align-items: baseline;
@@ -39804,7 +39842,9 @@ lux-menu .lux-menu-trigger > lux-button button {
39804
39842
  letter-spacing: 1.25px;
39805
39843
  }
39806
39844
  .lux-menu-panel .lux-menu-item-icon {
39807
- display: inline-block;
39845
+ display: inline-flex;
39846
+ align-items: center;
39847
+ justify-content: center;
39808
39848
  align-self: center;
39809
39849
  vertical-align: middle;
39810
39850
  width: var(--lux-theme-menu-item-icon-size);
@@ -39812,13 +39852,24 @@ lux-menu .lux-menu-trigger > lux-button button {
39812
39852
  }
39813
39853
  .lux-menu-panel .lux-menu-item-icon .lux-icon,
39814
39854
  .lux-menu-panel .lux-menu-item-icon mat-icon {
39855
+ display: inline-flex;
39856
+ align-items: center;
39857
+ justify-content: center;
39815
39858
  width: 100%;
39816
39859
  height: 100%;
39860
+ max-width: var(--lux-theme-menu-item-icon-size);
39861
+ max-height: var(--lux-theme-menu-item-icon-size);
39817
39862
  font-size: var(--lux-theme-menu-item-icon-size);
39818
39863
  }
39819
39864
  .lux-menu-panel .lux-menu-item-icon mat-icon {
39820
39865
  margin: 0;
39821
39866
  }
39867
+ .lux-menu-panel .lux-menu-item-icon mat-icon svg {
39868
+ width: 100%;
39869
+ height: 100%;
39870
+ max-width: var(--lux-theme-menu-item-icon-size);
39871
+ max-height: var(--lux-theme-menu-item-icon-size);
39872
+ }
39822
39873
 
39823
39874
  .lux-menu-section-panel,
39824
39875
  .lux-menu-section-panel:not(.lux-menu-panel-large) {
@@ -39935,8 +39986,14 @@ lux-menu .lux-menu-trigger > lux-button button {
39935
39986
  }
39936
39987
  .lux-menu-section-panel.lux-menu-panel-large .lux-menu-item-icon .lux-icon,
39937
39988
  .lux-menu-section-panel.lux-menu-panel-large .lux-menu-item-icon mat-icon {
39989
+ max-width: var(--lux-theme-menu-item-icon-size-large);
39990
+ max-height: var(--lux-theme-menu-item-icon-size-large);
39938
39991
  font-size: var(--lux-theme-menu-item-icon-size-large);
39939
39992
  }
39993
+ .lux-menu-section-panel.lux-menu-panel-large .lux-menu-item-icon mat-icon svg {
39994
+ max-width: var(--lux-theme-menu-item-icon-size-large);
39995
+ max-height: var(--lux-theme-menu-item-icon-size-large);
39996
+ }
39940
39997
 
39941
39998
  lux-message-box {
39942
39999
  display: block;
@@ -40080,8 +40137,22 @@ lux-message-box div.lux-message-box-content .lux-message-container:not(.lux-mess
40080
40137
  line-height: normal;
40081
40138
  }
40082
40139
  }
40083
- :root {
40140
+ lux-paginator {
40084
40141
  --mat-paginator-container-background-color: transparent;
40142
+ --mat-form-field-filled-container-color: transparent;
40143
+ }
40144
+ lux-paginator mat-paginator.lux-no-wrap .mat-mdc-paginator-container {
40145
+ flex-wrap: nowrap;
40146
+ }
40147
+ lux-paginator mat-paginator .mat-mdc-paginator-range-label {
40148
+ margin-left: 0.25rem;
40149
+ margin-right: 0.25rem;
40150
+ }
40151
+ lux-paginator mat-paginator.lux-dense {
40152
+ --mat-form-field-container-vertical-padding: 4px;
40153
+ }
40154
+ lux-paginator mat-paginator.lux-dense .mat-mdc-form-field-infix {
40155
+ min-height: 0;
40085
40156
  }
40086
40157
 
40087
40158
  lux-progress {