My Checkout Without Account Mod

[alicia1234]

Duh! I was reading the overwrites-writes.txt file, thinking it was the "install.txt" file, and that's all I had to do was upload those files.
Now I see there's more to it in the actual install.txt file. Sorry!

[alicia1234]

OK. I've got it all installed and it's working great. I did install the two optional addons. There is a weird problem with the ordersteps addon and styling.

I made changes to no_acccount.css to change the color of the progress bar and the text above it, and also to reduce the vertical height of the "box". All my changes are there when I check out without an account. However, if I check out WITH an account, none of my changes are there! And yes I did make the changes in both parts of the css, when there is one style with _CWOA and one without. I double-checked that.

And furthermore, in IE7, there is a float drop when checking out WITH an account. The "order complete" part falls below the "shipping" part.

My custom no_account.css file is in includes/templates/custom/css.

I'm totally baffled! I wanted to attach the css file but it's too big!

[alicia1234]

So I figured out that the ordersteps addon included these 5 new css files:
checkout_shipping.css
checkout_confirmation.css
checkout_payment.css
checkout_succes.css
no_account.css

And they are all exactly the same!
I tried taking what I had in no_account.css, copying it to stylesheet.css, and then basically blanking out the 5 css files, but that didn't work. I had to replicate the edits that I had made to no_account.css to each of the other 4 files. So there are still 5 .css files for this addon, and they are all exactly the same.

I still have the dropped float issue in IE7. Will post back when I figure that one out.

[rstevenson]

There looks to be something in there that is breaking the rules of CSS.

Ignoring, for the moment, Zen Cart's own rules of precedence for stylesheets, the usual thing is that any stylesheet loaded after the first one takes precedence, if there are any style definitions in it that are for the same elements that are styled in any previously loaded stylesheet.

If there are no such definitions, then the newly defined elements get their style from the second sheet anyway. And if the normal rules of precedence are being followed, it matters not one bit whether those newly defined elements are styled in a separate stylesheet or in the first one. If there is any doubt that these elements may have been styled already in the first sheet, then simply make sure they are defined again at the bottom of the first one.

Or a little more clearly: rules at the bottom of any one stylesheet are read and interpreted after rules above them. And rules in a stylesheet loaded after another are interpreted after rules in that previous stylesheet. And any rule interpreted after another takes precedence.

That's the way things should work.

But ZC has code in it which loads stylesheets in a certain, slightly arcane, order -- for good and necessary reasons I'm sure. First comes any stylesheet the name of which begins with style*; then they load language stylesheets, category and page stylesheets, and so on. The order is given in the readme file in the css folder.

The net result of all this possibly irrelevant discussion is this: what you did should have worked.

Obviously there is code somewhere calling these particular stylesheets rather than letting the natural order of things take care of it. But the good news is it doesn't really matter. In modern browsers, working over fast networks, the loading of a stylesheet -- especially one that contains as little as these do -- is a minor issue. It should take less than a second to get all five of those redundant stylesheets loaded. So if redundancy works, let it go.

But it does make future edits and upkeep more complicated than necessary. So you might try this ...

In one of those 5 stylesheets -- say, no_account.css -- leave all the styles defined. Put only this one line in each of the other four:
@import url(no_account.css);
You might have to experiment to get the right one to leave the styles in.

That, at least, will make it easier to do changes to your styles and will make furture upgrades easier too.

[alicia1234]

Good suggestion. Thanks. Any idea on the dropped float?

[alicia1234]

It worked beautifully! Changing all of these files:

checkout_shipping.css
checkout_payment.css
checkout_confirmation.css
checkout_success.css

To only contain the line:
@import url(no_account.css);

worked like a charm.
Still have the dropped float in IE7 though - and only when checking out WITH an account.

[alicia1234]

I fixed the float drop problem!
This problem was in the ordersteps addon to CWOA.
It was happening in IE6 and IE7 but not in Firefox. And only when checking out WITH an account.
The fix: in no_account.css, under #order_steps, change this line:
margin: 10px 10px;
to this:
margin: 5px 5px;

And if you haven't used the "@import ... " kluge mentioned directly above this post for the other 4 css files, you'll need to edit those files as well.

I guess that IE just needs a little more "breathing room".

[rstevenson]

It worked beautifully! Changing all of these files:

checkout_shipping.css
checkout_payment.css
checkout_confirmation.css
checkout_success.css

To only contain the line:
@import url(no_account.css);

worked like a charm.

Now, he said with an evil grin, I wonder if you can put ...
@import url(stylesheet.css);
into all 5 of them, and add the styles from no_account to the bottom of stylesheet.css?

Rob

[alicia1234]

I'm not sure I even want to try this!
It seems like it would be recursive. stylesheet.css is obviously already being loaded somehow. It's too confusing to even think about!

[rstevenson]

You're right. Bad idea!

Rob