[TUT] - Style attachments fieldset by GID

[TUT] - Style attachments fieldset by GID

This tutorial was created quickly during providing help here: https://community.mybb.com/thread-231416...pid1363700 as the existing provided help there was then further expanded upon simply as a suggestion here: https://community.mybb.com/thread-231416...pid1363711 so then I figured "hey, why not add it as yet another tutorial in the tutorial section?!", haha.

here is simply a preview of it styled to go along with another tut of mine ( staff post by gid ) simply shown for example sake:



Alright, getting to it...

Edit Template: postbit_attachments

<br />
<br />
<fieldset class="attachments-field{$post['usergroup']}">
<legend><span class="attachments-legend{$post['usergroup']}">{$lang->postbit_attachments}</span></legend>
{$post['attachedthumbs']}
{$post['attachedimages']}
{$post['attachmentlist']}
</fieldset>

Edit Template: postbit_attachments_attachment

<br />{$attachment['icon']}&nbsp;&nbsp;<span class="attachment-link{$post['usergroup']}"><a href="attachment.php?aid={$attachment['aid']}" target="_blank" title="{$attachdate}">{$attachment['filename']}</a></span> <span class="attachment-details{$post['usergroup']}">({$lang->postbit_attachment_size} {$attachment['filesize']} / {$lang->postbit_attachment_downloads} {$attachment['downloads']})</span>

here is an example with usergroup 4 =>  administrator, 3 => super moderator, 6 => moderator, 2 => registered, defined:

Add to css:

/* Postbit Attachment Styling by GID by: V */

/* administrator */

/* Fieldset Attachments */

fieldset.attachments-field4 {
  border-color: #008000;
  background: #B1F279;
}

/* fieldset  active & hover states */

fieldset.attachments-field4:active,
fieldset.attachments-field4:hover {
  background: #fff8f9;
}

/* Legend Attachments Title Span */

span.attachments-legend4 {
  color: #008000;
  font-weight: bold;
}

/* Attachment Details */

span.attachment-details4 {
  color: #008000;
}

/* Attachment Link */

span.attachment-link4 a:link {
  color: #008000;
  font-weight: bold;
  text-decoration: none;	
}

span.attachment-link4 a:visited {
  color: #008000;
  font-weight: bold;
  text-decoration: none;		
}

span.attachment-link4 a:active,
span.attachment-link4 a:hover {
  color: #003400;
  text-decoration: underline;	
}

/* moderator */

/* Fieldset Attachments */

fieldset.attachments-field3 {
  border-color: #CC00CC;
  background: #FFD6FC;
}

/* fieldset  active & hover states */

fieldset.attachments-field3:active,
fieldset.attachments-field3:hover {
  background: #fff8f9;
}

/* Legend Attachments Title Span */

span.attachments-legend3 {
  color: #CC00CC;
  font-weight: bold;
}

/* Attachment Details */

span.attachment-details3 {
  color: #CC00CC;
}

/* Attachment Link */

span.attachment-link3 a:link {
  color: #CC00CC;
  font-weight: bold;
  text-decoration: none;	
}

span.attachment-link3 a:visited {
  color: #CC00CC;
  font-weight: bold;
  text-decoration: none;		
}

span.attachment-link3 a:active,
span.attachment-link3 a:hover {
  color: #990099;
  text-decoration: underline;	
}

/* super moderator */

/* Fieldset Attachments */

fieldset.attachments-field6 {
  border-color: #CC00CC;
  background: #FFD6FC;
}

/* fieldset  active & hover states */

fieldset.attachments-field6:active,
fieldset.attachments-field6:hover {
  background: #fff8f9;
}

/* Legend Attachments Title Span */

span.attachments-legend6 {
  color: #CC00CC;
  font-weight: bold;
}

/* Attachment Details */

span.attachment-details6 {
  color: #CC00CC;
}

/* Attachment Link */

span.attachment-link6 a:link {
  color: #CC00CC;
  font-weight: bold;
  text-decoration: none;	
}

span.attachment-link6 a:visited {
  color: #CC00CC;
  font-weight: bold;
  text-decoration: none;		
}

span.attachment-link6 a:active,
span.attachment-link6 a:hover {
  color: #990099;
  text-decoration: underline;	
}

/* registered */

/* Fieldset Attachments */

fieldset.attachments-field2 {
  border-color: #0072BC;
  background: #F5F5F5;
}

/* fieldset  active & hover states */

fieldset.attachments-field2:active,
fieldset.attachments-field2:hover {
  background: #EFEFEF;
}

/* Legend Attachments Title Span */

span.attachments-legend2 {
  color: #0072BC;
  font-weight: bold;
}

/* Attachment Details */

span.attachment-details2 {
  color: #0072BC;
}

/* Attachment Link */

span.attachment-link2 a:link {
  color: #0072BC;
  font-weight: bold;
  text-decoration: none;	
}

span.attachment-link2 a:visited {
  color: #0072BC;
  font-weight: bold;
  text-decoration: none;		
}

span.attachment-link2 a:active,
span.attachment-link2 a:hover {
  color: #005389;
  text-decoration: underline;	
}

You would then need to keep adding for all of your various other usergroups #s....

etc, etc

Best of Luck! Happy editing!   ~ V