💁‍♂️ Add Info to Native User Menu with CSS

My main issue is that you were able to solve it but I can’t use your solution! All of my CSS works exactly as I intended but with Compiled turned ON. To turn it OFF and redevelop could cost me 40 hrs. (Just guessing)

Let me ask is there a way we could modify your code to work with Compiled turned ON?

The media queries work as planned. I’m specifically targeting desktop users who may resize the screen while using the site… it also covers different screen sizes at the same time. In that case I think the media query is the way. We could come back to this later :wink:

You know him, don’t you? :smile:

1 Like

Of course I know Robert Petitto… he’s the reason we’re all here :nerd_face:

1 Like

You can use The W3C CSS Validation Service to validate your code. The results show that you are using invalid properties: scale and rotate.

After I observed it in more detail, I noticed different behavior compared to my earlier tests since I first started using this new Glide app. Today, after replacing all of my code with yours, I found that when the switch is turned on, some code actually works. @ThinhDinh, what is your view on the meaning of this button? I recall that you also asked about it before.

Out of curiosity, I tested it further, and when the switch is turned on, you must write your code perfectly. The comment // added in front of a selector is not allowed to deactivate a block of code. You need to fully close a block of code using /*Code*/. It seems like there’s some validation here ensuring your code is written correctly.
Additionally, I found that there are code restrictions at the #root level that don’t work when the switch is on.

/*Make the fly-out transparent*/
#root:has(#app-modal-root li) #app-modal-root:not(:has(.mobile-layer)):not(:has([data-testid="wc-item"])) > * {
  background: rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.3);
}

It looks like my understanding of the ‘use compiled CSS’ feature needs revision.

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.