I have had the same paypal plugin for years with other templates. It has no background. You can see it in the lefthand bar on our current site:
www.mainefiberarts.org

I totally duplicated all the modules and plugins for our new site with build.r/buildr and the button insists on having a background. Even when I recreated the button as a .png and another .gif. From the code it looks like something in the template settings is telling a "submit" button to have a white background. You can see it on any page here near the bottom and/or in the off-canvas more button:
www.mainefiberarts.org/newblue/

Can you help with this? I hope you can.

Carol Jones

Hi Carol,

The button is an input so it have a background colour added by the templates css so you need to target it to remove it

try adding

#bottom3 input {background:transparent;border:0;}

Cheers
Paul

Yes. That worked. Now how about the off canvas one? How would I specify that in the css?

ah ok sorry missed that

is the paypal in the off canvas in its own module? - if so can you add a module class to it

Well, it's part of a custom module now, but it could actually be the same custom module as the other in the bottom 3 position. But what would the module class be called? Do you mean I would make it up? If I add a module class then do I need the css, or is the css the class or...I'm confused. Adding module classes aren't one of my skills. Yet.

Thanks,

Carol

Hi Carol,

You would make one up and add it to the module - with that we can target the paypal specifically

without that module class any styling I suggest would conflict with the other content in the off canvas position

Cheers
Paul

I read up about module suffixes and thought I had done the right thing, but maybe my css is missing something. I used several suffixes, currently the module suffix is donate_button (after a space), and the css I made is this:

.donate_button {
border: 0;
background:transparent;
width:auto;
}

I have also used many other word options and nothing affects the button in the blue off-canvas thing. It still has a white background. Maybe I need a different word and shouldn't use button, I tried some different things. Maybe I need two dots before the class name? Maybe I need an !important after it? Maybe I need to stick in "moduletable" or something like that?

I'm out of steam on this one. I don't know what I'm doing any more. The only solution I can think of is to take that whole module out of the blue off canvas thing. How many donate buttons do we need anyway.

So that's that about this one.

Carol Jones

ok lets try an attribute selector - this is an image so we can do it this way

.sb-slidebar.off-canvas input[type="image"] {background:transparent; border:0}

also looking at the css you have this

..hotspots-fullscreeen #logowrap {
z-index: 0!important;
}

..hotspots-fullscreen .zen-nav-fixed {
z-index: 0!important;
}

..hotspots-fullscreen #bottomwrap .zen-container {
position: static;
z-index: 0!important;
}

with the double dots for a class you need one dot

Any module suffix shouldn't have a dot in front (although I don't think this is relevant to above)

Uh...so with the new piece of css, do I get rid of the module suffix I added and the css that was supposed to affect that? Just adding that to the custom css file did nothing to the donate button.

NEWS FLASH! It is working, the donate button in the off canvas bar IS working. It just takes a while for changes in the backend to show up. (annoying delay)

About the double dots in front of those three css things.They aren't about module suffixes but were sent to me by the guy who developed the map inside a module on the home page which also has menu items to it that show it on its own page. That map has a feature where you can zoom out to have the map take over the full screen but the menu bar at the top covers up the buttons at the top right of the map so we can't make it go back to regular size and can't access any of the stuff at the top of the list on the right side of the map. One of these things in the css is also supposed to make the orange bar (in the bottom position) go down to the bottom of the screen so it doesn't cover up the center of the map.

Unfortunately this is another can of worms because this works sometimes but sometimes not. I think it is related to the way the homepage doesn't refresh right unless you hit the home in the menu or the logo.

But now he (Daniel) says it might be a good idea to see if you all (joomlabamboo) can figure out why the menu covers up the map controls when it is expanded.

I'm on the verge of making this site live even with the weirdnesses because I can't stand it anymore. I would rather make changes to the site once it is at the root level. The issues don't seem to be *that* awful. Are they?

Carol Jones

I can't see a module class with the paypal module

The css I suggested does negate the need for a module class but it is less specific

so if you were to use an image in an input (e.g. a form) in the off canvas it would potentially be a problem

as it is now its ok

The annoying delay could be down to caching either in the site or on the server e.g. for instance siteground have caching enabled by default

you can turn it off via the cpanel

if the double dots are working then its fine

for other issues can you open a new thread as it gets way too confusing if I need to ask a developer to take a look and my question is different

Cheers
Paul

Another reason why I want this site to be the one at the root level. I have caching off on the other/current site. What is more annoying is to have to "tend out" on two sites any time I have to make a change to things.

yeah its always a big problem updating two sites at the same time - feel your pain on that one

New thread is way over due. I'll get to it later.

Thank you for all this. Over and out.

Carol

No problem

Cheers
Paul

Hi Carol

An idea on your hotspots map issue, which makes some assumptions, I'll chip in anyway in a hope it helps.

Here is some css to patch the issue for you to try - add to custom.css, you may be to remove or comment out the existing hotspot css.

.hotspots-fullscreen section#logowrap {
display: none;
}
.hotspots-fullscreen #footerwrap {
display: none;
}
.hotspots-fullscreen #bottomwrap {
display: none;
}
.hotspots-fullscreen #top-right {
display: none;
}

Of course you can combine the rules into a single line as they are the same. This is for your main map from the menu.

I assume you are loading the map into the module grid position on the home using the plugins from hotspots and reference the map. One trick we use is to create a hidden menu for each map used in a module, the plugin then can reference the hidden menu item. The advantage is you can control how the map looks and works, including styling, which is useful and still draws from the same data set of locations.

We use Hotspots with JB template as a base in several sites, all work fine with the full screen, so I suspect something else is creating the conflict, that may you find with some digging. In the meantime the css above should give a workaround.

Love the art by the way....

Regards Ian

Thanks Ian

Appreciated

Enjoy your weekend

Cheers
Paul

Hi Ian,

Thank you so much for chipping in. I will take in everything you said soon. I have been working at my other, non website, job and haven't had time to think about this. Probably tomorrow...