Home>Support>Button Widget doesn’t display the shading for the option Flat

Button Widget doesn’t display the shading for the option Flat

By metier, 10 years ago. Last reply by Andrew Misplon, 10 years ago.
Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

Hi,

I am a Vantage premium user and i have a problem with the widget bundle. Since yesterday the flat option for the SiteOrigin Button Widget doesn’t show the shading.

I have no idea where to start looking. Has there been an update?

Example http://www.metieracademy.nl

URL: http://www.metieracademy.nl

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 10 years, 1 month ago Andrew Misplon
    Hi, I Work Here

    Hi Metier

    Can you perhaps confirm a page on your site where the button in question is being used?

    Thanks

  2. 10 years, 1 month ago metier

    Hi Andrew,
    On the homepage there are three buttons. These are made with the plugin.

    text in the buttons = Onze trainingen, Opleiden op maat and LMS and hosting.

  3. 10 years, 1 month ago Andrew Misplon
    Hi, I Work Here

    Apologies for the hassle. I chatted with the guys. That button layout was unfortunately updated to be more in line with its title “flat”. I’ll do my best to get things back to the way they were using Custom CSS:

    .so-widget-sow-button-flat-00c43d81162e .ow-button-base a {
	border-bottom: 2px solid #b64900;
  	text-shadow: 0 1px 0 rgba(0,0,0,0.05);
}

.so-widget-sow-button-flat-00c43d81162e .ow-button-base a.ow-button-hover:hover {
	border-bottom-color: #cf5400;
}

    Please try inserting the above at Appearance > Custom CSS. Let me know it looks. We can always make adjustments from there.

  4. 10 years, 1 month ago metier

    Hi I inserted the code, it does work.

    Unfortunately we liked the “flat” button so we used it in multiple pages, can i make the css statement more generic so it will work for all?

    We are using the button in different colors. Can i update a bit of code so it does the magic of selecting the correct color based on the selected color?

    Thanks.

  5. 10 years, 1 month ago Andrew Misplon
    Hi, I Work Here

    Changing the above Custom CSS to the following would make it applicable site wide:

    div[class*="so-widget-sow-button-flat"] .ow-button-base a {
	border-bottom: 2px solid #b64900;
  	text-shadow: 0 1px 0 rgba(0,0,0,0.05);
}

div[class*="so-widget-sow-button-flat"] .ow-button-base a.ow-button-hover:hover {
	border-bottom-color: #cf5400;
}

    We could then repeat these classes with a page prefix to change the colors.

    This is unfortunately the only way I can think of reverting the buttons.

  6. 10 years, 1 month ago metier

    Hi,

    I see. It is slightly disappointing that i need to specify per color. Is there a possibility that the widget gets an extra option (e.g. raised) which has the same features as the flat button had.

  7. 10 years, 1 month ago Andrew Misplon
    Hi, I Work Here

    I completely understand, so sorry you were negatively impacted by this style adjustment.

    I’ll chat with the guys and see if there is anything further we can do to assist.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More