Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • December 20, 2019 at 9:42 pm #1168336
    algkent

    Hi,

    I have a code to put in to make PDFs have a shadow effect on my site. However, when I put it into the CSS area in the Enfold, it didn’t work.

    box-shadow: 0px 10px 75px 0px rgba(0,0,0,0.10), 0px 10px 50px 0px rgba(0,0,0,0.15);

    Can you suggest how to make this work?

    Thanks,
    Amanda

    December 21, 2019 at 1:20 am #1168363
    Mike

    Hey algkent,
    Here is the effect your css is giving me (bottom one)
    2019-12-20-181154
    So if you are adding this into your Quick CSS then perhaps you are not targeting the element correctly, if you are adding it into your stylesheet directly, then you need to save your theme settings to update the compresed css file that was built with the Enfold Theme Options > Performance > JS & CSS file merging and compression setting, if you have it turned on.
    Otherwise please post the full css code and link to the element page so we can check.

    Best regards,
    Mike

    December 21, 2019 at 5:32 pm #1168471
    algkent

    Hi Mike!

    Thanks for checking that code.

    So, I’m pasting it into here: https://prnt.sc/qdzv6t

    And there here would be a page I think it should show up with the shadowing (the optin, if you scroll down): https://www.moneyprodigy.com

    Thanks for your time,
    Amanda

    December 21, 2019 at 6:22 pm #1168483
    Guenni007

    on your screenshot we do not see the selector (the element ) to what the box-shadow should go.
    I suppose there is no-one.

    something like 

    .flex_column.av_one_third {
      box-shadow: 0px 10px 75px 0px rgba(0,0,0,0.10), 0px 10px 50px 0px rgba(0,0,0,0.15);
}

    _________________________

    By the way – but Off Topic – if you have found a way to show on a page a pdf – ;) i’m interesting too

    the only way i know is via javascript to render a pdf on websites.
    or to embed them like this:
    <embed src="https://example.com/the.pdf" width="100%" height="800" type="application/pdf">

    but chrome and android do not support this anymore.
    Edit: it seems that this is still supported by chrome
    Alternative you can use the google pdf viewer to show pdfs on website:
    <embed src="https://drive.google.com/viewerng/viewer?embedded=true&url=https://example.com/the.pdf" width="100%" height="800">

    December 21, 2019 at 7:49 pm #1168505
    algkent

    Ahh–sorry, I’m not a tech person at all:).

    I just saw this box shadow on someone’s website and asked them for the code, which they gladly sent.

    If I put that code beforehand that you provided above, which part of my site would get the shadow? How can I get a shadow on my optin boxes? Those are through Thrive Leads plugin.

    I appreciate your help!

    December 22, 2019 at 9:46 am #1168556
    Guenni007

    ok now i see.

    but maybe you make the shadow a bit more intense for it:

    .popup_content--2JBXA {
    box-shadow: 0px 10px 75px 0px rgba(0,0,0,0.50), 0px 10px 50px 0px rgba(0,0,0,0.5);
}
    December 22, 2019 at 8:52 pm #1168621
    Mike

    Hi,

    @Guenni007     thank you. It’s odd I didn’t find a Thrive Leads popup on the page?

    @algkent     were you able to sort this out now?

    Best regards,
    Mike

    December 22, 2019 at 9:41 pm #1168625
    Guenni007

    @Mike : yes that was my first looking too – maybe i was on that page before and have something in my cache.
    Erasing my cache was the solution.

    December 23, 2019 at 4:35 pm #1168760
    algkent

    Morning!

    Thanks for looking at this.

    It’s an optin, not a pop-up.

    Here’s a screenshot: https://prnt.sc/qequ92

    This is just an example one; I have thrive optin boxes like these all over my site.

    December 26, 2019 at 1:34 pm #1169022
    Mike

    Hi,
    Thank you for the screenshot, I see that this is from your homepage but I’m not able to find this on your page, I did find it on the page at the url in the Private Content area. So the class for the thrive optin boxes is .thrv-leads-form-box
    So please try this css:

    .thrv-leads-form-box {
    box-shadow: 0px 10px 75px 0px rgba(0,0,0,0.50), 0px 10px 50px 0px rgba(0,0,0,0.5);
}

    Best regards,
    Mike

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.