With the new Enact UI version 4.7.4 margins are overridden to 0 by enact UI marquue class . Is there way to not let margin overridden by enact?

1

is there any way to fix this or overide this globally, since in 4.7.2 it was taking values as given ,

2

Hi @Darshan_Giri,

Marquee component is composed as below.

<div class="enact_ui_Marquee_Marquee_marquee">

    <div class="enact_ui_Marquee_Marquee_text">MARQUEE TEXT</div>

</div>

And in enact 4.7.4, we set margin of enact_ui_Marquee_Marquee_text to be zero.

Because the marquee is implemented under the assumption that both widths are the same, so enact_ui_Marquee_Marquee_text margin needs to be set to 0 to marquee contents properly.

Thanks

3

anyway to overide it

4

hi, anyway to overide it globally

5

There are two ways to override margin values:

First, you can use the inline style as below.

<Marquee
    style={{margin: '100px'}}
>
    {'marquee'}
</Marquee>

Second, you can use CSS and MarqueeDecorator to override the margin value.

// Marquee.module.less
.marquee {
    margin: 100px;
    .text {

    }
}

// App.js
import {MarqueeDecorator} from '@enact/sandstone/Marquee';
import css from './Marquee.module.less';


const NewMarquee = MarqueeDecorator({css: css}, 'div');

<NewMarquee>
    {'marquee'}
</NewMarquee>

Thanks

6

Screenshot 2023-09-21 121651
Screenshot 2023-09-21 121651947×267 107 KB

Hi, we havent used marquee explicitly , its implicitly getting masked for the componets, anyway to overide this globally

7

We may be able to support you better if you tell us your case(code snippet) that you need to override the marquee text's margin. Which component of the Moonstone library do you use?

8

image
image1537×188 8.04 KB

we are giving margin here but marquee margin is getting used here which is 0 currently (marquee is overrriding our margins)