CSS for modifying embedded content does not appear on ios/mobile

Things I have tried

  • I have tried using the below, which works well on desktop, but not on the ipad/ios
  • I have also tried using the is-mobile class
.internal-embed,
.is-mobile .internal-embed {
    padding-left: 5px !important;
    border-left-color: rgba(125, 91, 237, 0.4) !important;
    border-left-width: 8px !important;
    border-top-left-radius: 4px !important;
    border-bottom-left-radius: 4px !important;
}

  • Please note that the below (for blockquote) works just fine on the ipad/ios
blockquote {
    padding-left: 3px !important;
    border-left-color:  rgba(255, 255, 255, 0.4) !important;
    border-left-width: 3px !important;
    border-top-left-radius: 2px !important;
    border-bottom-left-radius: 2px !important;
}

Is there something I am missing?

Thanks in advance,
George the Squirrel

This works on desktop and iOS for me. No need to target .is-mobile

.internal-embed {
    padding-left: 5px !important;
    border-left-color: rgba(125, 91, 237, 0.4) !important;
    border-left-width: 8px !important;
    border-top-left-radius: 4px !important;
    border-bottom-left-radius: 4px !important;
}

Here I’m changing the border-left-width from 8 to 80 and then back to 8 (in my desktop editor). How are you syncing your snippets to iOS/iPad OS? Maybe they aren’t syncing over correctly? Not enabled?

https://imgur.com/a/tuF4rxL

3 Likes

@ariehen thanks for the reply, and for making the gif.

I am syncing with iCloud, which I hate, but it works well.
I do small test to verify that indeed changes are synced (eg changing color).

I figured out a way of doing it with .markdown-embed and .markdown-embed-content but it’s not clean and I don’t like it. So, I’ll have a closer look at it, some time in the future.

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