Change font size of custom text above signature

Started by pepa, January 19, 2018, 09:38:46 PM

Previous topic - Next topic

pepa

I need to display some user info just above their signature - Location, Suburb e.g. Brisbane, Toowong

Text display OK but it would look a lot better if it was a little smaller.  I tried editing in Index.css the following:
.custom_fields_above_signature
{
   width: 98%;
   clear: right;
   padding: 1em 0 3px 0;
   border-top: 1px solid #aaa;
   line-height: 1.4em;
   font-size: 0.85em;
}


In particular reducing the font-size, but it has no effect.  Anyone know where I need to edit this?  I'm using 2.0.15, default theme with Responsive Curve.

Sir Osis of Liver

Font size in poster info is defined here -

index.css



/* Default font sizes: small (8pt), normal (10pt), and large (14pt). */
.smalltext, tr.smalltext th
{
font-size: 0.85em;
font-family: verdana, sans-serif;
}



and called here -

index.template.php



// Show a link to the member's profile.
echo '
', $message['member']['link'], '
</h4>
<ul class="reset smalltext" id="msg_', $message['id'], '_extra_info">';



This affects all text in poster block.  You would have to apply your custom class just to the bits you want smaller.

Ashes and diamonds, foe and friend,
 we were all equal in the end.

                                     - R. Waters

pepa

Quote from: Sir Osis of Liver on January 19, 2018, 11:18:35 PM
Font size in poster info is defined here -

index.css



/* Default font sizes: small (8pt), normal (10pt), and large (14pt). */
.smalltext, tr.smalltext th
{
font-size: 0.85em;
font-family: verdana, sans-serif;
}



and called here -

index.template.php



// Show a link to the member's profile.
echo '
', $message['member']['link'], '
</h4>
<ul class="reset smalltext" id="msg_', $message['id'], '_extra_info">';



This affects all text in poster block.  You would have to apply your custom class just to the bits you want smaller.

Not completely sure if that's what I mean?  The text I'm referring to is displayed in display.template.php by this code:

// Are there any custom profile fields for above the signature?
if (!empty($message['member']['custom_fields']))
{
foreach ($message['member']['custom_fields'] as $custom)
if (empty($custom['placement']) || empty($custom['value']))
echo
$custom['value'], '&nbsp &nbsp';
}


Does that apply to what you have described above?

Gwenwyfar

.smalltext, tr.smalltext th will change many places in the entire theme, not sure if it will also apply to the custom signature fields.

Have you refreshed your cache since you made your changes on .custom_fields_above_signature?
"It is impossible to communicate with one that does not wish to communicate"

pepa

Quote from: Gwenwyfar on January 20, 2018, 10:23:48 AM
.smalltext, tr.smalltext th will change many places in the entire theme, not sure if it will also apply to the custom signature fields.

Have you refreshed your cache since you made your changes on .custom_fields_above_signature?

Yes .. thanks for your suggestion Gwenwyfar, however, I've done that a few times and it makes no difference.

Sir Osis of Liver

The code I posted last night is, of course, in Display.template.php, not index.template.php.  (Sir Osis is getting a bit too old for multi-tasking. :P)  Where exactly did you place the new class?
Ashes and diamonds, foe and friend,
 we were all equal in the end.

                                     - R. Waters

pepa

Quote from: Sir Osis of Liver on January 20, 2018, 10:19:10 PM
The code I posted last night is, of course, in Display.template.php, not index.template.php.  (Sir Osis is getting a bit too old for multi-tasking. :P)  Where exactly did you place the new class?

Too old ... lol, you and me both.  I haven't done any serious coding for at least 10 years and now I'm setting up this forum as a volunteer for a not for profit group!

Anyway, what I have tried doing today is calling the class .custom_fields_above_signature (from index.css) in display.template.php. So I changed the font size (in index.css) from 0.85em to 0.65em ... looks better but there are two problems.

1.  The text is displayed with a top and bottom border, probably because I called the class by wrapping it in a div and looks like divs are defined elsewhere with a top and bottom border.  There is a top border in the class .custom_fields_above_signature but removing that makes no difference.

2.  I want the text displayed inline but it displays as a list.

Hope that's clear?

Sir Osis of Liver

Ashes and diamonds, foe and friend,
 we were all equal in the end.

                                     - R. Waters

Sir Osis of Liver

I think you're making this more complicated than it needs to be.  If you just want to reduce font size of specific fields in poster info, make a css class like this -



.poster_custom
{
font-size: .65em;
}



and plug it into the field you want to change -



// Show their personal text?
if (!empty($settings['show_blurb']) && $message['member']['blurb'] != '')
echo '
<li class="poster_custom">', $message['member']['blurb'], '</li>';



That will reduce font-size of personal text only.  You can apply it to any of the other fields same way.
Ashes and diamonds, foe and friend,
 we were all equal in the end.

                                     - R. Waters

pepa

Quote from: Sir Osis of Liver on January 20, 2018, 11:48:09 PM
I think you're making this more complicated than it needs to be.  If you just want to reduce font size of specific fields in poster info, make a css class like this -



.poster_custom
{
font-size: .65em;
}



and plug it into the field you want to change -



// Show their personal text?
if (!empty($settings['show_blurb']) && $message['member']['blurb'] != '')
echo '
<li class="poster_custom">', $message['member']['blurb'], '</li>';



That will reduce font-size of personal text only.  You can apply it to any of the other fields same way.

What I did was in display.template.php I used:

// Are there any custom profile fields for above the signature?
            if (!empty($message['member']['custom_fields']))
         {
            foreach ($message['member']['custom_fields'] as $custom)
               if (empty($custom['placement']) || empty($custom['value']))
                  echo '
                        <div class ="custom_fields_above_signature">', $custom['value'], '&nbsp &nbsp </div>';
         }


and I altered the font size in index.css (and also removed the top border) so:

.custom_fields_above_signature
{
   width: 98%;
   clear: right;
   line-height: 1.4em;
   font-size: 0.65em;
}


End result changed the font size but with the 2 problems I mentioned above.

I'll have a play with your code but not sure I entirely have my head around it as I want it in the "custom text above the signature not in the poster block.

Gwenwyfar

Added some fields here for testing...

No need to change anything in Display.template.php, just add the font size change to .custom_fields_above_signature (that you already did). If you want the fields to display inline use


.custom_fields_above_signature li {
display: inline-block; }

.custom_fields_above_signature li + li {
margin-left: 14px; }


There is a border above the signature and one above .custom_fields_above_signature here:

.signature, .custom_fields_above_signature {
    border-top: 1px #ccc solid;


I'd just remove the one above .signature if you don't want it, otherwise there will be no distinction from the posts to the signature.
"It is impossible to communicate with one that does not wish to communicate"

Sir Osis of Liver

Hmm, I've been working with Curve display template, it's a bit different from Responsive Curve.  Just installed it, doesn't load correctly, no css.  Will have to tinker with it soon as I get a minute.
Ashes and diamonds, foe and friend,
 we were all equal in the end.

                                     - R. Waters

Gwenwyfar

Responsive Curve doesn't change anything in the main css nor Display.template.
"It is impossible to communicate with one that does not wish to communicate"

Sir Osis of Liver

Haven't been paying attention, was looking in the wrong place. :P  Your suggestion should work fine.
Ashes and diamonds, foe and friend,
 we were all equal in the end.

                                     - R. Waters

pepa

Quote from: Gwenwyfar on January 21, 2018, 06:40:20 AM
Added some fields here for testing...

No need to change anything in Display.template.php, just add the font size change to .custom_fields_above_signature (that you already did). If you want the fields to display inline use


.custom_fields_above_signature li {
display: inline-block; }

.custom_fields_above_signature li + li {
margin-left: 14px; }


There is a border above the signature and one above .custom_fields_above_signature here:

.signature, .custom_fields_above_signature {
    border-top: 1px #ccc solid;


I'd just remove the one above .signature if you don't want it, otherwise there will be no distinction from the posts to the signature.

Hi Gwenwyfar, thanks for your efforts but unfortunately it makes no difference.  If I revert to the standard code in display.template.php and use your suggestions just for alterations in index.css then nothing is displayed above the signature at all?


Gwenwyfar

That is a standard class that comes with the theme, it is always there in Curve, unless you had already altered it before with a mod or otherwise.

This is how the default file looks like:


// Are there any custom profile fields for above the signature?
      if (!empty($message['member']['custom_fields']))
      {
         $shown = false;
         foreach ($message['member']['custom_fields'] as $custom)
         {
            if ($custom['placement'] != 2 || empty($custom['value']))
               continue;
            if (empty($shown))
            {
               $shown = true;
               echo '
                     <div class="custom_fields_above_signature">
                        <ul class="reset nolist">';
            }
            echo '
                           <li>', $custom['value'], '</li>';
         }
         if ($shown)
            echo '
                        </ul>
                     </div>';
      }
"It is impossible to communicate with one that does not wish to communicate"

pepa

Quote from: Gwenwyfar on January 22, 2018, 04:54:06 AM
That is a standard class that comes with the theme, it is always there in Curve, unless you had already altered it before with a mod or otherwise.

This is how the default file looks like:


// Are there any custom profile fields for above the signature?
      if (!empty($message['member']['custom_fields']))
      {
         $shown = false;
         foreach ($message['member']['custom_fields'] as $custom)
         {
            if ($custom['placement'] != 2 || empty($custom['value']))
               continue;
            if (empty($shown))
            {
               $shown = true;
               echo '
                     <div class="custom_fields_above_signature">
                        <ul class="reset nolist">';
            }
            echo '
                           <li>', $custom['value'], '</li>';
         }
         if ($shown)
            echo '
                        </ul>
                     </div>';
      }


Yes, agreed ... and if I reinsert that code into display.template.php and your other code into index.css then nothing at all is displayed above the signature.

Gwenwyfar

I'm not sure if this is a general issue but it took a few minutes/refreshes to show for me. Maybe it is cached differently (odd but all else was getting updated normally...).

There should be nothing wrong with either code otherwise, works just fine in my test install to do what you want.
"It is impossible to communicate with one that does not wish to communicate"

pepa

Quote from: Gwenwyfar on January 22, 2018, 05:46:51 AM
I'm not sure if this is a general issue but it took a few minutes/refreshes to show for me. Maybe it is cached differently (odd but all else was getting updated normally...).

There should be nothing wrong with either code otherwise, works just fine in my test install to do what you want.

Yep, not sure what's happening here.  I'm also using this code (thanks to Sir Osis) to display the custom profile fields in the poster block:

// Any custom fields for standard placement?
if (!empty($message['member']['custom_fields']))
{
foreach ($message['member']['custom_fields'] as $custom)
if (empty($custom['placement']) || empty($custom['value']))
echo '
<li class="custom">', $custom['value'], '</li>';
}


It was working perfectly but now it only displays the first two custom fields?

Just realised the above code was working perfectly in Redsy theme but now misbehaving since I changed to default theme with responsive curve.

Sir Osis of Liver

Just took a quick look at previous topic, that code edit was to remove labels from custom fields -



<li class="custom">', $custom['title'], ': ', $custom['value'], '</li>';

<li class="custom">', $custom['value'], '</li>';



otherwise code is the same, shouldn't affect anything else.
Ashes and diamonds, foe and friend,
 we were all equal in the end.

                                     - R. Waters

Advertisement: