Toggle Submenu
  1. Forums
  2. Recent
  3. Categories
  4. Tags
  5. Users
  6. Badges
Support is currently Online
Add a reply View Replies (11)

Resolved Profile Alignment

  1. Corleone
    Corleone
  2. General
  3. Tuesday, October 14 2014, 01:56 PM
Dear all,

For the last hour I have been trying out the Easy Profile component, and I am pleasantly surprised. However, I am facing some difficulties in displaying the my profile section nice and smooth. As you can see in the attachment, something goes wrong with the account information. The alignment of username, name, last name, email, etc. and its corresponding values is wrong... What can I do to fix this?
I have set 'include bootstrap files' to yes, because before no template was visible at all.

Thanks in advance!
Attachments (1)
Screen Shot 2014-10-14 at 13.51.09.png Screen Shot 2014-10-14 at 13.51.09.png
Responses (11)
admin
admin Accepted Answer
Admin
Hi please post me your site link, we will send you the CSS code to add at your template (I think 1 line) ;)
  1. more than a month ago
  2. General
  3. # 1
Corleone
Corleone Accepted Answer
Thank you for your quick reply! I am working on a local server, so I cant send you the link. I will come back to you as soon as we are online. Keep up the good work!
  1. more than a month ago
  2. General
  3. # 2
Corleone
Corleone Accepted Answer
Content Protected
  1. more than a month ago
  2. General
  3. # 3
Corleone
Corleone Accepted Answer
Also on small screens, the alignment of the fields and placeholders is not good...
  1. more than a month ago
  2. General
  3. # 4
Corleone
Corleone Accepted Answer
Please see here both problems. The fields do not align well when editing a profile, and on small devices my profile does not work correctly. Thanks!
  1. more than a month ago
  2. General
  3. # 5
admin
admin Accepted Answer
Admin
Hi,
we have fixed on your site.

What we did:
- Removed Template override for com_users component: rename folder from /templates/gk_publisher/html/com_users to /templates/gk_publisher/html/com_users.no
your template override Joomla original template file, with this mod the override is gone ;)

- Add some CSS statement to fix template conflict: we have added these lines at the end of file /templates/gk_publisher/override.css
body{background-color:#1A1A1A !important;}

.profile dt{min-width:0px;margin:0;}
  1. more than a month ago
  2. General
  3. # 6
Corleone
Corleone Accepted Answer
Thanks, I see that 'edit profile' now perfectly works. However, the 'My profile' Page still places the data wrong on small devices and when you make the window very small.

I have cleared my cache, but I still experience this on both my phone and desktop..

Thanks for your support so far!
  1. more than a month ago
  2. General
  3. # 7
Corleone
Corleone Accepted Answer
This is my temporary solution; added in mobile.css

/* Fix for the user profile */
.profile dt {
width: 100% !important;
text-align: left;
padding-top: 10px;
}


.dl-horizontal dd{
margin-left:1px



}

Could you let me know if this is the right way to proceed?

Thanks!
  1. more than a month ago
  2. General
  3. # 8
admin
admin Accepted Answer
Admin
Hi,
I have added also this:
.row-fluid .col-md-3,.row-fluid .col-md-9,.row-fluid .col-md-6{float:none;width:100%;}
see now ;)

you can consider to moving all the code in the file override.css with this way
@media(max-width:580px){

	.profile dt {

	width: 100% !important;

	text-align: left;

	padding-top: 10px;

    }

    .dl-horizontal dd{

	margin-left:1px

    }

    .row-fluid .col-md-3,.row-fluid .col-md-9,.row-fluid .col-md-6{

	float:none;

	width:100%;

    }

}
  1. more than a month ago
  2. General
  3. # 9
Corleone
Corleone Accepted Answer
Thanks.
However, the profile picture is now displayed really big in the middle; I liked it together with the name more...
And if you resize your window to the smallest dimensions possible, you see that the edit profile page is not very smooth...

These are all template-related issues right?

Thanks for your help so far. Really appreciate it!
  1. more than a month ago
  2. General
  3. # 10
admin
admin Accepted Answer
Admin
picture is now displayed really big
This is because in Avatar field configuration is set "width" parameter on 200, so the image have 200px.
In previous version you see a smaller image because there is a CSS property that set "max-width" to 100%.
Now to set a width of image I recommend you to add some CSS rule like:
img.avatar{max-width:120px}


you see that the edit profile page is not very smooth
I have added some other CSS rule to mobile.css
.form-horizontal .control-label{width:auto;float:none;text-align:left;}

.form-horizontal .controls{margin-left:0;line-height:100%;}

.form-horizontal .controls input[type="text"],

.form-horizontal .controls input[type="password"],

.form-horizontal .controls input[type="email"]{width:100%;}

.form-horizontal .control-group{margin:0 0 10px}


These are all template-related issues right?
Yes because your template not use standard bootstrap classes
  1. more than a month ago
  2. General
  3. # 11
  • Page :
  • 1


There are no replies made for this post yet.
However, you are not allowed to reply to this post.
Sorry, the discussion is currently locked. You will not be able to post a reply at the moment.