@genexus/mercury 0.18.0 → 0.19.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.
|
@@ -1 +1 @@
|
|
|
1
|
-
export const bundle = `.accordion-outlined::part(header),.accordion-filled::part(header){font-family:var(--font-family-header)}.accordion-outlined::part(header),.accordion-filled::part(header){font-size:var(--font-size-subtitle-xs);line-height:var(--line-height-tight)}.accordion-outlined::part(header),.accordion-filled::part(header){font-weight:var(--font-weight-semi-bold)}.accordion-outlined,.accordion-filled{--ch-accordion__header-image-size: var(--mer-icon__box--sm);--ch-accordion__chevron-size: var(--mer-icon__box--sm);--ch-accordion-expand-collapse-duration: var(--mer-timing--fast);--ch-accordion-expand-collapse-timing-function: ease-in-out;--spacing-body-block-start: var(--mer-spacing--sm);--spacing-body-block-end: var(--mer-spacing--sm);--spacing-body-inline-start: var(--mer-spacing--sm);--spacing-body-inline-end: var(--mer-spacing--sm);--accordion-panel__border-radius: var(--mer-border__radius--sm);--accordion-panel__border-color: transparent;--accordion-panel__bg-color: transparent;--accordion-header__outline-color: transparent;background-color:rgba(0,0,0,0) !important}.accordion-outlined::part(header),.accordion-filled::part(header){
|
|
1
|
+
export const bundle = `.accordion-outlined::part(header),.accordion-filled-header::part(header),.accordion-filled::part(header){font-family:var(--font-family-header)}.accordion-outlined::part(header),.accordion-filled-header::part(header),.accordion-filled::part(header){font-size:var(--font-size-subtitle-xs);line-height:var(--line-height-tight)}.accordion-outlined::part(header),.accordion-filled-header::part(header),.accordion-filled::part(header){font-weight:var(--font-weight-semi-bold)}.accordion-outlined,.accordion-filled-header,.accordion-filled{--ch-accordion__header-image-size: var(--mer-icon__box--sm);--ch-accordion__chevron-size: var(--mer-icon__box--sm);--ch-accordion-expand-collapse-duration: var(--mer-timing--fast);--ch-accordion-expand-collapse-timing-function: ease-in-out;--spacing-body-block-start: var(--mer-spacing--sm);--spacing-body-block-end: var(--mer-spacing--sm);--spacing-body-inline-start: var(--mer-spacing--sm);--spacing-body-inline-end: var(--mer-spacing--sm);--accordion-panel__border-radius: var(--mer-border__radius--sm);--accordion-panel__border-color: transparent;--accordion-panel__bg-color: transparent;--accordion-header__outline-color: transparent;background-color:rgba(0,0,0,0) !important;gap:var(--mer-spacing--sm)}.accordion-outlined::part(header),.accordion-filled-header::part(header),.accordion-filled::part(header){color:var(--accordion-header__color);gap:var(--mer-spacing--sm);padding:var(--mer-spacing--sm);--outline-width: var(--mer-border__width--sm);outline:var(--mer-border__width--sm) solid var(--accordion-header__outline-color);border-radius:var(--accordion-panel__border-radius)}.accordion-filled-header::part(header){--accordion-header__color: var(--elevation-color, --mer-text__on-elevation);outline-offset:calc(var(--outline-width)*-1);background-color:var(--header__bg-color);--header__bg-color: var( --elevation-background-color, var(--mer-surface__elevation--01) )}.accordion-filled-header::part(header disabled){--header__bg-color: var(--mer-surface__elevation--02);--accordion-header__color: var(--mer-accent__primary--disabled)}.accordion-outlined::part(header):hover,.accordion-filled-header::part(header):hover,.accordion-filled::part(header):hover{--accordion-header__outline-color: var(--mer-border-color__primary--hover)}.accordion-outlined::part(header):active,.accordion-filled-header::part(header):active,.accordion-filled::part(header):active{--accordion-header__outline-color: var(--mer-border-color__primary--active)}.accordion-outlined::part(header):focus-visible,.accordion-filled-header::part(header):focus-visible,.accordion-filled::part(header):focus-visible{outline:var(--focus__outline-width) var(--focus__outline-style) var(--focus__outline-color);outline-offset:var(--focus__outline-offset)}.accordion-outlined::part(header disabled),.accordion-filled::part(header disabled){--accordion-header__color: var(--mer-accent__primary--disabled)}.accordion-outlined::part(panel),.accordion-filled-header::part(panel),.accordion-filled::part(panel){border-radius:var(--accordion-panel__border-radius)}.accordion-filled::part(panel),.accordion-outlined::part(panel){--panel-border-color: transparent;border:var(--mer-border__width--sm) solid var(--panel-border-color)}.accordion-filled::part(panel){--accordion-panel__bg-color: var( --elevation-background-color, var(--mer-surface__elevation--01) );--panel-border-color: var(--accordion-panel__bg-color);background-color:var(--accordion-panel__bg-color);color:var(--elevation-color, --mer-text__on-elevation)}.accordion-filled::part(panel disabled){--accordion-panel__bg-color: var(--mer-surface__elevation--02)}.accordion-outlined::part(panel){--accordion-panel__bg-color: var(--elevation-background-color, transparent);--panel-border-color: var( --elevation-border-color, var(--mer-border-color__on-surface) )}.accordion-outlined::part(panel disabled){--panel-border-color: var(--mer-border-color__primary--disabled)}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}`;
|
package/dist/mercury.scss
CHANGED
|
@@ -3771,21 +3771,36 @@
|
|
|
3771
3771
|
@include accordion-tokens();
|
|
3772
3772
|
|
|
3773
3773
|
background-color: transparent !important;
|
|
3774
|
+
gap: var(--mer-spacing--sm);
|
|
3774
3775
|
// force elevation-* class not applying on the host
|
|
3775
3776
|
}
|
|
3776
3777
|
|
|
3777
3778
|
%accordion-header {
|
|
3778
3779
|
@extend %subtitle-semi-bold-xs;
|
|
3779
|
-
padding: var(--mer-spacing--sm);
|
|
3780
|
-
gap: var(--mer-spacing--sm);
|
|
3781
3780
|
color: var(--accordion-header__color);
|
|
3782
|
-
|
|
3783
|
-
|
|
3784
|
-
outline-width: var(--mer-border__width--sm);
|
|
3785
|
-
outline
|
|
3786
|
-
|
|
3781
|
+
gap: var(--mer-spacing--sm);
|
|
3782
|
+
padding: var(--mer-spacing--sm);
|
|
3783
|
+
--outline-width: var(--mer-border__width--sm);
|
|
3784
|
+
outline: var(--mer-border__width--sm) solid
|
|
3785
|
+
var(--accordion-header__outline-color);
|
|
3787
3786
|
border-radius: var(--accordion-panel__border-radius);
|
|
3788
3787
|
|
|
3788
|
+
&-filled {
|
|
3789
|
+
--accordion-header__color: var(--elevation-color, --mer-text__on-elevation);
|
|
3790
|
+
|
|
3791
|
+
outline-offset: calc(var(--outline-width) * -1);
|
|
3792
|
+
background-color: var(--header__bg-color);
|
|
3793
|
+
|
|
3794
|
+
--header__bg-color: var(
|
|
3795
|
+
--elevation-background-color,
|
|
3796
|
+
var(--mer-surface__elevation--01)
|
|
3797
|
+
);
|
|
3798
|
+
&--disabled {
|
|
3799
|
+
--header__bg-color: var(--mer-surface__elevation--02);
|
|
3800
|
+
--accordion-header__color: var(--mer-accent__primary--disabled);
|
|
3801
|
+
}
|
|
3802
|
+
}
|
|
3803
|
+
|
|
3789
3804
|
&--hover {
|
|
3790
3805
|
--accordion-header__outline-color: var(--mer-border-color__primary--hover);
|
|
3791
3806
|
}
|
|
@@ -3801,34 +3816,38 @@
|
|
|
3801
3816
|
}
|
|
3802
3817
|
|
|
3803
3818
|
%accordion-panel {
|
|
3804
|
-
background-color: var(--accordion-panel__bg-color);
|
|
3805
|
-
border: var(--mer-border__width--sm) solid
|
|
3806
|
-
var(--accordion-panel__border-color);
|
|
3807
|
-
border-style: solid;
|
|
3808
3819
|
border-radius: var(--accordion-panel__border-radius);
|
|
3809
|
-
|
|
3820
|
+
|
|
3821
|
+
&-filled,
|
|
3822
|
+
&-outlined {
|
|
3823
|
+
--panel-border-color: transparent;
|
|
3824
|
+
border: var(--mer-border__width--sm) solid var(--panel-border-color);
|
|
3825
|
+
}
|
|
3810
3826
|
|
|
3811
3827
|
&-filled {
|
|
3812
3828
|
--accordion-panel__bg-color: var(
|
|
3813
3829
|
--elevation-background-color,
|
|
3814
3830
|
var(--mer-surface__elevation--01)
|
|
3815
3831
|
);
|
|
3816
|
-
--
|
|
3832
|
+
--panel-border-color: var(--accordion-panel__bg-color);
|
|
3817
3833
|
|
|
3818
3834
|
&--disabled {
|
|
3819
3835
|
--accordion-panel__bg-color: var(--mer-surface__elevation--02);
|
|
3820
3836
|
}
|
|
3837
|
+
|
|
3838
|
+
background-color: var(--accordion-panel__bg-color);
|
|
3839
|
+
color: var(--elevation-color, --mer-text__on-elevation);
|
|
3821
3840
|
}
|
|
3822
3841
|
|
|
3823
3842
|
&-outlined {
|
|
3824
3843
|
--accordion-panel__bg-color: var(--elevation-background-color, transparent);
|
|
3825
|
-
--
|
|
3844
|
+
--panel-border-color: var(
|
|
3826
3845
|
--elevation-border-color,
|
|
3827
3846
|
var(--mer-border-color__on-surface)
|
|
3828
3847
|
);
|
|
3829
3848
|
|
|
3830
3849
|
&--disabled {
|
|
3831
|
-
border-color: var(--mer-border-color__primary--disabled);
|
|
3850
|
+
--panel-border-color: var(--mer-border-color__primary--disabled);
|
|
3832
3851
|
}
|
|
3833
3852
|
}
|
|
3834
3853
|
}
|
|
@@ -3875,6 +3894,41 @@
|
|
|
3875
3894
|
}
|
|
3876
3895
|
}
|
|
3877
3896
|
|
|
3897
|
+
@mixin accordion-filled-header(
|
|
3898
|
+
$accordion-selector: ".accordion-filled-header",
|
|
3899
|
+
$panel-selector: ".accordion-filled-header::part(panel)",
|
|
3900
|
+
$panel-disabled-selector: ".accordion-filled-header::part(panel disabled)",
|
|
3901
|
+
$header-selector: ".accordion-filled-header::part(header)",
|
|
3902
|
+
$header-disabled-selector: ".accordion-filled-header::part(header disabled)"
|
|
3903
|
+
) {
|
|
3904
|
+
#{$accordion-selector} {
|
|
3905
|
+
@extend %accordion;
|
|
3906
|
+
}
|
|
3907
|
+
|
|
3908
|
+
#{$panel-selector} {
|
|
3909
|
+
@extend %accordion-panel;
|
|
3910
|
+
}
|
|
3911
|
+
|
|
3912
|
+
#{$header-selector} {
|
|
3913
|
+
@extend %accordion-header;
|
|
3914
|
+
@extend %accordion-header-filled;
|
|
3915
|
+
|
|
3916
|
+
&:hover {
|
|
3917
|
+
@extend %accordion-header--hover;
|
|
3918
|
+
}
|
|
3919
|
+
&:active {
|
|
3920
|
+
@extend %accordion-header--active;
|
|
3921
|
+
}
|
|
3922
|
+
&:focus-visible {
|
|
3923
|
+
@extend %accordion-header--focus-visible;
|
|
3924
|
+
}
|
|
3925
|
+
}
|
|
3926
|
+
|
|
3927
|
+
#{$header-disabled-selector} {
|
|
3928
|
+
@extend %accordion-header-filled--disabled;
|
|
3929
|
+
}
|
|
3930
|
+
}
|
|
3931
|
+
|
|
3878
3932
|
@mixin accordion-outlined(
|
|
3879
3933
|
$accordion-selector: ".accordion-outlined",
|
|
3880
3934
|
$panel-selector: ".accordion-outlined::part(panel)",
|
|
@@ -24474,6 +24528,7 @@ $tabular-grid-controls: ($combo-box-selector, $input-selector);
|
|
|
24474
24528
|
// - - - - - - - - - - - - - - - - - - -
|
|
24475
24529
|
@if $accordion {
|
|
24476
24530
|
@include accordion-filled();
|
|
24531
|
+
@include accordion-filled-header();
|
|
24477
24532
|
@include accordion-outlined();
|
|
24478
24533
|
}
|
|
24479
24534
|
|
package/package.json
CHANGED