Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

Order History display Order History Info not stacking etc.


Recommended Posts

Hello,

I been totally driven mad trying to use the responsive design to try and correct the appearance of the above. I have exhausted it and NOTHING has changed doooohh!

Can someone help? 

Order History: The Reorder and View buttons cover the other details, the details will not display properly in mobile view, desktop view okay.

image.png.0d943f01890ffe14a006a4b1b668b8e4.png

image.thumb.png.0995a86de65df19a0c78248994484c05.png

Order History Info: Remains 1/4-3/4 view no matter what in mobile so it is difficult to see, why does this not stack as above? How to stack?

image.thumb.png.b082f547acbfee668e71cf1021448d6d.png

No matter how many settings I play with it NEVER changes ...

Please help only an issue on MOBILE view.

Thank you,

Lorraine

Link to comment
Share on other sites

  • 2 weeks later...

Okay so using an update for account system from the team, the Order History Info is now stacking great in mobile view - SOLVED!

The Order History overlap has improved slightly in mobile but still some overlap. I hope this can be fixed too.

Great so far ...

Link to comment
Share on other sites

  • 2 weeks later...

Okay,

So following the instructions I have added the padding see below. So far nothing has changed.

Here is the b.pagination I don't know what to alter? Please guide:

.pagination:after {
  clear: both;
  content:'';
  display:block;
}
.pagination {
  margin-bottom:20px;
}
.pagination .active a,  .pagination .active span {
  font-weight: bold;
  border:1px solid #1a61ad;
}
.pagination .left-area {
  float: left;
}
.pagination .next a,  .pagination .next span {
  font-size:0;
}
.pagination .next-pages {
  height:30px;
  min-width:30px;
  text-align: center;
  vertical-align: top;
  line-height:30px;
  display:inline-block;
  border:1px solid #e0e0e0;
  padding-right:5px;
  padding-left:5px;
  margin-left:5px;
}
.pagination .p-blog-index {
  text-align: right;
}
.pagination .page-number {
  height:30px;
  min-width:30px;
  text-align: center;
  vertical-align: top;
  line-height:30px;
  display:inline-block;
  border:1px solid #e0e0e0;
  padding-right:5px;
  padding-left:5px;
  margin-left:5px;
}
.pagination .paging {
  display:inline-block;
}
.pagination .paging span.prev,  .pagination .paging span.next {
  opacity: 0.3;
}
.pagination .prev a,  .pagination .prev span {
  font-size:0;
}
.pagination .prev-pages {
  height:30px;
  min-width:30px;
  text-align: center;
  vertical-align: top;
  line-height:30px;
  display:inline-block;
  border:1px solid #e0e0e0;
  padding-right:5px;
  padding-left:5px;
  margin-left:5px;
}
.pagination .right-area {
  float: right;
}
.pagination a:hover {
  text-decoration: none;
}
.pagination a,  .pagination span {
  height:30px;
  min-width:30px;
  text-align: center;
  vertical-align: top;
  line-height:30px;
  display:inline-block;
  border:1px solid #e0e0e0;
  padding-right:5px;
  padding-left:5px;
  margin-left:5px;
}
.pagination a.next,  .pagination span.next {
  height:30px;
  min-width:30px;
  text-align: center;
  vertical-align: top;
  line-height:30px;
  display:inline-block;
  border:1px solid #e0e0e0;
  padding-right:5px;
  padding-left:5px;
  margin-left:5px;
}
.pagination a.next:before,  .pagination span.next:before,  .pagination .next a:before,  .pagination .next span:before {
  font-size:20px;
  line-height:26px;
  content:'\f105';
  font-family:FontAwesome;
}
.pagination a.prev,  .pagination span.prev,  .pagination .prev a {
  height:30px;
  min-width:30px;
  text-align: center;
  vertical-align: top;
  line-height:30px;
  display:inline-block;
  border:1px solid #e0e0e0;
  padding-right:5px;
  padding-left:5px;
  margin-left:5px;
}
.pagination a.prev:before,  .pagination span.prev:before,  .pagination .prev a:before,  .pagination .prev span:before {
  font-size:20px;
  line-height:26px;
  content:'\f104';
  font-family:FontAwesome;
}
.pagination span.active {
  background-color: #532a68;
  color: #ffffff;
  font-weight: 700;
  height:30px;
  min-width:30px;
  text-align: center;
  vertical-align: top;
  line-height:30px;
  display:inline-block;
  border:1px solid #e0e0e0;
  padding-right:5px;
  padding-left:5px;
  margin-left:5px;
}
.pagination span:hover {
  text-decoration: none;
}
ul.pagination {
  list-style: none;
  padding:0px 0px;
  margin:0px 0px;
}
ul.pagination li {
  display:inline-block;
}
 

ORDH2024-04-26 154258.png

Link to comment
Share on other sites

Thank you,

I did all this to distraction to start with ... NOTHING changed.

The OSC4 team gave me a new account.zip to upload, after this all the stacking is good and normal.

The only problem I'm left with is in mobile size/view in Order History the bottom lines overlap and obscure. It looks unprofessional.

I've been told that the cause is inheriting from an earlier version and the only way to fix it is manually.

I've been able to follow up to step 2, however step 3 involves the pagination and the team wanted to see my b.pagination before suggesting updates.

Thank you,

Lorraine

Link to comment
Share on other sites

3 hours ago, herbsandhelpers said:

The only problem I'm left with is in mobile size/view in Order History the bottom lines overlap and obscure. It looks unprofessional.

I've been told that the cause is inheriting from an earlier version and the only way to fix it is manually.

I've been able to follow up to step 2, however step 3 involves the pagination and the team wanted to see my b.pagination before suggesting updates.

Please attach your current screenshot.

Link to comment
Share on other sites

  • 2 weeks later...
  • 2 weeks later...
On 5/28/2024 at 6:50 PM, Hotclutch said:

I am on the latest version, and confirm this problem, across all 4 themes.

It depends on the initial version of osCommerce. Themes are updated partially with system updates.

On 5/28/2024 at 6:30 PM, herbsandhelpers said:

Can someone help with this please?

It is hard to customize the theme without access to the site.

Try to remove all lines into this css class (you can copy/paste all lines to backup text file before removing):

image.png.533186acb66b88cc48b964d6a17b0de8.png

 

Link to comment
Share on other sites

22 hours ago, pandrei said:

It depends on the initial version of osCommerce. Themes are updated partially with system updates.

I have checked my updated installation, and the Printshop theme does not reflect changes. I only became aware when I did another clean installation and noticed the changes. May I suggest that the three other themes be added as apps with version numbers. Watch theme is already so, maybe you could add the others, then it would be easier to check for changes.

Link to comment
Share on other sites

^^ You could make a fresh test installation with the latest release, and see if your problem still persists there. If its fixed on the new theme, then you could start looking for the updated CSS to apply to your existing theme.

Link to comment
Share on other sites

Thank you and where is the updated css can someone post it here?

I’ve deleted all themes except the one I’m using in preparation for going live.

This is one issue that’s still not fixed. 
 

Lorraine 

Link to comment
Share on other sites

The updated CSS will be in the new theme, if indeed it has been updated. This problem in this thread I saw was fixed for the printshop theme, so I assume it will be for the others too.

In my personal case, I keep a record of changes i make to the theme. So what i did was take the new theme and added my changes to it.

Link to comment
Share on other sites

3 hours ago, herbsandhelpers said:

Finally!

Yes I have deleted the extra dashboard block and am pleased to say that all the account layout issues now seem to be resolved. 
 

Working and displaying as expected with mobile view.

THANK YOU!

Great! You're welcome!

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...