[MBParticipant]

Hi,

The default position of icons inside buttons is left. Can we move that to right?

Thanks, MB
https://mbguiding.ca/

[RadModerator]

Hi MB,

Thanks for writing in.

Which button? The one in the slider? It’s already positioned to the right. Unless there are other buttons, and I can’t find them.

Thanks!

[MBParticipant]

More specifically, I want the buttons site wide to be the same as the ones in the front page slider.

[RupokMember]

Hi there,

Would you please describe a bit what you are trying to accomplish? You can use button element on Cornerstone or with Button Shortcode and control the style, icon position etc. So I am not really sure what you meant by “I want the buttons site wide to be the same as the ones in the front page slider.”. Please clarify properly.

Cheers!

[MBParticipant]

Ok let’s try this again.

1. On the front page of my website: https://mbguiding.ca/ there is a slider with a button on each slide. That button is orange with roboto font text at 17px and 500 weight. There is an icon type=”caret-right” on right hand side of text inside button.

2. I want all of the buttons on the rest of my website to look exactly like that. Same colour, same font, same icon, same position of icon.

3. How do I do that?

[RupokMember]

Hi there,

Thanks for writing back. What you are trying to achieve is not recommended because you shouldn’t force a style for all different buttons since there are lot of button styles. Also it might cause unusual effect if you use other button classes and styles. If you still want this, you can try this Custom CSS :

.x-btn, .button, [type="submit"] {
  background-color: #f1861f!important;
  border: 1px solid #000000;
  border-radius: 0 !important;
  color: #ffffff!important;
  text-transform: uppercase;
  font-family: "Roboto";
  font-size: 17px;
  font-weight: 500;
  letter-spacing: 0;
}

.x-btn::after, .button::after, [type="submit"]::after {
  content: "";
  font-family: "FontAwesome";
  padding: 0 15px;
}

Hope this helps.

Cheers!

[MBParticipant]

OK, This’s fantastic! I really only needed the [icon type=”caret-right”] on right hand side of text inside buttons. So the bottom code snippet was perfect with a little less padding:

.x-btn::after, .button::after, [type=”submit”]::after {
content: “”;
font-family: “FontAwesome”;
padding: 0 5px;
}

How a bout a snippet to get rid of shadow on global buttons and give a flatter look like on slider?

Thanks, MB

[JadeModerator]

Hi MB,

As I am seeing, it is only the pagination button that look a bit different from the slider buttons.

Please add this CSS for that:

.x-pagination span.current, .flex-direction-nav a, 
.flex-control-nav a:hover, .flex-control-nav a.flex-active {
    box-shadow: none;
}

Please point us to the specific section where there is a button that looks different that we missed.

Thank you.

[MBParticipant]

Hi, Its the shadow on the text inside the buttons we’re trying to target. Thanks

[Paul RModerator]

Hi,

You can add this under Custom > CSS in the Customizer.

.x-btn, .button, [type="submit"] {
     text-shadow:none !important;
}

Hope that helps.

[MBParticipant]

Ok. I notice this drop shadow is on all the text and boxes in the footer widget too. If we change the colour of footer widget container background, the white drop box shadow shows. Please advise.

Thanks, MB

[FriechModerator]

Hi There,

Can you confirm the issue? I don’t see any text shadows on the footer section.

Thanks!

[MBParticipant]

Footer widget area ABOVE footer. colophon-top

[ZeshanMember]

Hi there,

For that, use this CSS code:

.x-colophon.top .widget {
    text-shadow: none;
}

.x-colophon.top .widget ul,
.x-colophon.top .widget ol,
.x-colophon.top .widget ul li, 
.x-colophon.top .widget ol li {
    border: none;
    box-shadow: none;
}

Further customizations from here would be getting into custom development, which is outside the scope of support we can offer. If you need more in depth changes, you may wish to consult with a developer. X is quite extensible with child themes, so there are plenty of possibilities. Thanks for understanding.

[MBParticipant]

[RESOLVED] Thanks Themeco! 😀

[Author]

Posts