Paginator - active page

Ask us anything
1

Hello, sorry for the noob question, but there must be a simple way to highlight an active site, right? :slight_smile:

image

2

Hey @Cichy ,
you need to add an “active” state to the Text, then select this state and add your style.

Create the active state on top of the sidepanel (the pencil)
Capture

Select it, and add your style. Style under this state will have a green dot.
Capture2

3 Likes
3

Hello Aurelie, thank you :slight_smile: Is there any tutorial on states? What other states can be added?

My paginator is at the bottom of the list. Is there a simple way to make the next page open at the top of the list?

4

Hi @Cichy!

We’re working on adding states to the product. In the meantime, documentation is a little bit limited but you can use the hover state. Here’s a tutorial on how you might use it.

Re the Paginator, here’s how you could do it:

Step 1 – add a CSS id to the container where you want it to scroll back to

In the example below, we want to scroll back to the top of the article on the page:

add css id
add css id1920Ă—974 113 KB

Step 2 – add a workflow on the Paginator that triggers On click

with the following custom code in a Custom JavaScript action:

const target = document.getElementById("article");

target.scrollIntoView({behavior: "smooth",block:"start",inline:"nearest"});

You can replace “article” by any other string of course. Just make sure it matches the CSS id you chose in step 1 :slight_smile:

2 Likes
5

Well, it works very well. Thank you Joyce!

1 Like
7

Hi @aurelie @Joyce , following this question, do you have the list of the supported states we can add this way ?

8

Hi Maxence :wave:

Not really. At the moment the hover state is the only one that’s 100% reliable. We’ve been having issues with the active state mentioned above recently.

Making more standard states available (like active link and focus) are one of the current priorities for the tech team but we don’t have a clear timeline yet on when those states will be available in the product.

Was there a specific use case you were trying to set up?

2 Likes
9

Thanks for your answer :slight_smile:
Yes I wanted to integrate an active state but I was also wondering about other possibilities since Aurelie’s screen has 5 states on her picture above

2 Likes