Customizing SMF > Graphics and Templates

problem on profile page

<< < (2/2)

LFrancke:
Maybe not the best way but go to line 2603 of the index.css file, this is the #basicinfo section.

Change the width to 22% and see if that works.

rickmastfan67:

--- Quote from: LFrancke on May 16, 2012, 09:26:38 PM ---Maybe not the best way but go to line 2603 of the index.css file, this is the #basicinfo section.

Change the width to 22% and see if that works.

--- End quote ---

Already have done that..

--- Quote from: rickmastfan67 on May 15, 2012, 11:04:32 AM ---It seems that changing the "width" line in "#basicinfo" helps with this problem, but it isn't a perfect fix as the white on the side disappears @ 22%, but the white at the bottom in the picture in the first post remains.

--- End quote ---

LFrancke:
hmmm ... in that case  :)

do this ...

at line 2580,  #profileview change the background-color to what ever you want

at line 2592 , #basicinfo .content add a line for background-color

at line 2604, #basicinfo add a line for background-color

that just colors the left square for the name/avatar. If you want to do the entire field then add:

at line 2597 ( or there abouts ), #detailedinfo .content add background-color.


edit: you may also need to add background-color in the #basicinfo h4 section.

rickmastfan67:

--- Quote from: LFrancke on May 16, 2012, 09:51:18 PM ---at line 2580,  #profileview change the background-color to what ever you want

--- End quote ---

Doing that also changes the border color, which is something I don't want to do as I like the 1px white outline.

Now, if there was just a way to get "#basicinfo" to automatically match whatever height that "#detailedinfo" uses via the CSS if possible since more data shows up in "#detailedinfo"....

Then again, I have to make sure I don't mess up the older style profile screen that you get when you hit the arrow on the top right of the profile screen.

rickmastfan67:
Ok, I found a way around this in the "Core" theme.

1) I made a copy of the "Profile.template.php" file and put it in my theme.
2) I opened the file in my editor and did a search for the class "profileview".
3) At the first "profileview" (line 53), I copied and duplicated that line right below it and added a tab to the new second one (duplicated copy on line 54).
4) Then I changed "profileview" to "profileview1" on line 54 (shown below).

--- Code: --- // Display the basic information about the user
echo '
<div id="profileview" class="flow_auto">
<div id="profileview1" class="flow_auto">
<div class="cat_bar">
<h3 class="catbg">

--- End code ---
5) Then I went down to line 960 (will be 961 after the edit in #3) and changed the "profileview" there to "profileview2" and saved the file.
6) Now went to open the "index.css" file of the *core* theme (in the theme I'm working on of course) and went down to line ~2579.
7)

--- Code: (Find:) ---/* Fixes for the core theme */
#profileview
{
padding: 1px;
border: 1px solid #696969;
background-color: #ecedf3;
}
#profileview .content
{
border: none;
}
#basicinfo .content
{
padding: 1em;
}
#detailedinfo .content
{
padding: 0.7em 1.2em;
border-left: 1px solid #aaa;
}

--- End code ---

--- Code: (Replace With:) ---/* Fixes for the core theme */
#profileview
{
padding: 1px;
border: 1px solid #696969;
background-color: #ecedf3;
}
#profileview .content
{
border: none;
}
#profileview1
{
border: 1px solid #696969;
background-color: #ecedf3;
}
#profileview2
{
padding: 1px;
border: 1px solid #696969;
background-color: #ecedf3;
}
#profileview2 .content
{
border: none;
}
#basicinfo .content
{
padding: 1em;
background-color: #ecedf3;
}
#detailedinfo .content
{
padding: 0.7em 1.2em;
border-left: 1px solid #aaa;
}

--- End code ---

And you're done.  Adjust the background colors to your pleasing. :)

Marking this as solved. :)

Navigation

[0] Message Index

[*] Previous page