Next.js Discord

Discord Forum

react shadow

Unanswered
Giant Chinchilla posted this in #help-forum
Open in Discord
Avatar
Giant ChinchillaOP
Is there any way to leverage shadow in react or next js to encapsulate style of parent...
because i am using inner html how i able to achieve

21 Replies

Avatar
what effect are you trying to achieve?
Avatar
Giant ChinchillaOP
@Alfonsus Ardani basically I have user emails and i want to show exactly in innerhtml ...
<div
dangerouslySetInnerHTML={{
__html: content.html,
}}
></div>
Avatar
soo? you want to show shadow where?
where do you want to show the shadow?
Avatar
Giant ChinchillaOP
Basically this div should render in shadow wherever I use i want div in shadow dom
Avatar
you want it like this?

<
  dangerouslySetInnerHTML={{
    __html: content.html,
  }}
></>
no div?
or do you want a CSS shadow?
i dont quite get what you meant sorry
Avatar
Giant ChinchillaOP
Yes I want css shadow ....
Avatar
where? on the <div>? or inside the HTML content?
Avatar
Giant ChinchillaOP
Inside html content
Avatar
you can use CSS selectors for that
does the particular element on the inside HTML content have a particular id/classname?
Avatar
Giant ChinchillaOP
Basically it's email content so Id and class name not permanent....
Avatar
yes you could still do it with css selectors
using :nth-child
Avatar
Giant ChinchillaOP
Okay means I will provide some default css to override using css selector rather than shadow dom i will try ....
Avatar
shadow dom sounds complicated especially when you can't know the content for sure ahead of time
Avatar
Giant ChinchillaOP
@Alfonsus Ardani Yes I checked some packages but they are hard to replicate in the nextjs . I will try the css way only because the main think effect template is css only....