Having hydration issues with Next.js

Running into some hydration issues with Next.js

Warning: Prop `dangerouslySetInnerHTML` did not match. Server: "\n    @import url('<https://fonts.googleapis.com/css2?family=Inter%3Aital%2Cwght%400%2C400%3B0%2C600%3B0%2C700%3B0%2C900&family=Inconsolata%3Aital%2Cwght%400%2C400%3B0%2C600%3B0%2C700%3B0%2C900&display=swap>');\n@import url('<https://fonts.googleapis.com/css2?family=Inter%3Aital%2Cwght%400%2C400%3B0%2C600%3B0%2C700%3B0%2C900&family=Inconsolata%3Aital%2Cwght%400%2C400%3B0%2C600%3B0%2C700%3B0%2C900&display=swap>');\n@import url('<https://fonts.googleapis.com/css2?family=Inter%3Aital%2Cwght%400%2C400%3B0%2C600%3B0%2C700%3B0%2C900&family=Inconsolata%3Aital%2Cwght%400%2C400%3B0%2C600%3B0%2C700%3B0%2C900&display=swap>');\n@import url('<https://fonts.googleapis.com/css2?family=Inter%3Aital%2Cwght%400%2C400%3B0%2C500%3B0%2C600%3B0%2C700&family=Inconsolata%3Aital%2Cwght%400%2C400%3B0%2C500%3B0%2C600%3B0%2C700&display=swap>');\n@import url('<https://fonts.googleapis.com/css2?family=Inter%3Aital%2Cwght%400%2C400%3B0%2C600%3B0%2C700%3B0%2C900&family=Inconsolata%3Aital%2Cwght%400%2C400%3B0%2C600%3B0%2C700%3B0%2C900&display=swap>');\n    .__wab_flex-container{display:flex;flex:1;align-self:stretch;pointer-events:none}.__wab_flex-container>*{pointer-events:auto}.__wab_slot{display:contents}.__wab_slot-string-wrapper{position:relative}.__wab_passthrough{display:contents}.__wab_img-wrapper{position:relative;display:inherit;flex-direction:column;overflow:hidden;flex-shrink:0}.__wab_slot>.__wab_img-wrapper{display:block}.__wab_passthrough>.__wab_img-wrapper{display:block}.__wab_img-spacer-svg{display:block;margin:0;border:0;padding:0}.__wab_img{position:absolute;top:0;left:0;bottom:0;right:0;margin:0;padding:0;border:0;display:block;width:100%;min-width:100%;max-width:100%;min-height:100%;max-height:100%;box-sizing:border-box}.__wab_picture{display:contents}\n:where(.plasmic_default__all){display:block;white-space:inherit;grid-row:auto;grid-column:auto;position:relative;background:0 0;background-size:100% 100%;background-repeat:no-repeat;box-shadow:none;box-sizing:border-box;text-decoration-line:none;margin:0;border-width:0}:where(.__wab_rich_text *),:where(.__wab_text *){white-space:inherit;grid-row:auto;grid-column:auto;background:0 0;background-size:100% 100%;background-repeat:no-repeat;box-shadow:none;box-sizing:border-box;text-decoration-line:none;margin:0;border-width:0}:where(.plasmic_default__img){display:inline-block}:where(.plasmic_default__li){display:list-item}:where(.plasmic_default__span){display:inline;position:static;font-family:inherit;line-height:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-transform:inherit}:where(.__wab_rich_text span),:where(.__wab_text span){font-family:inherit;line-height:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-transform:inherit}:where(.plasmic_default__input){font-family:inherit;line-height:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-transform:inherit;background-image:linear-gradient(#fff,#fff);padding:2px;border:1px solid #d3d3d3}:where(.__wab_rich_text input),:where(.__wab_text input){font-family:inherit;line-height:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-transform:inherit;background-image:linear-gradient(#fff,#fff);padding:2px;border:1px solid #d3d3d3}:where(.plasmic_default__textarea){font-family:inherit;line-height:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-transform:inherit;padding:2px;border:1px solid #d3d3d3}:where(.__wab_rich_text textarea),:where(.__wab_text textarea){font-family:inherit;line-height:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-transform:inherit;padding:2px;border:1px solid #d3d3d3}:where(.plasmic_default__button){font-family:inherit;line-height:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-transform:inherit;background-image:none;align-items:flex-start;text-align:center;padding:2px 6px;border:1px solid #d3d3d3}:where(.__wab_rich_text button),:where(.__wab_text button){font-family:inherit;line-height:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-transform:inherit;background-image:none;align-items:flex-start;text-align:center;padding:2px 6px;border:1px solid #d3d3d3}:where(.plasmic_default__code){font-family:inherit;line-height:inherit}:where(.__wab_rich_text code),:where(.__wab_text code){font-family:inherit;line-height:inherit}:where(.plasmic_default__pre){font-family:inherit;line-height:inherit}:where(.__wab_rich_text pre),:where(.__wab_text pre){font-family:inherit;line-height:inherit}:where(.plasmic_default__p){font-family:inherit;line-height:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-transform:inherit}:where(.__wab_rich_text p),:where(.__wab_text p){font-family:inherit;line-height:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;c 

hmm do you have the full error message? (seems to be cut off there)

Hmmm can you share any source related to this?

here’s the full error message

Untitled.txt

hmm is this deployed somewhere I could take a look? :sweat_smile:

https://website-git-plasmic-air-inc.vercel.app/ this is the deployment url

which page was throwing the error pasted above?

most of the pages are throwing the error but this one is one that bugs out on prod https://website-git-plasmic-air-inc.vercel.app/department/marketing

We have identified the issue, testing the fix; thanks for bearing with us!

Could you try publishing from Plasmic again?

Still getting a mismatch warning, but it’s not as srs as before!

Looks like the pages are rendering correctly rn