Category appearance Improvement (Topic,Post,Last Post)

[TruStealth™]

Hello I would like to know how I can make my forum categories look like in this image?

 

[Sir. Mayo]

Hello,

Can you please provide the url to where you found this.
Your forum url
Is your forum type still punbb?

[SLGray]

It is right here - https://help.forumotion.com/t116797-drop-gallery-theme#869748

[TruStealth™]

It is right here - https://help.forumotion.com/t116797-drop-gallery-theme#869748

I know that. But I don't want all the crowdedness that shows in the demo I want it to be clean with no bugs. all I am wanting to change is the topics and post are but for them be side by side and the box around the last post and last of all the forum , Topics , Last Post headings removed.

Hope you follow what im saying

[SLGray]

You can add all the codes and then correct the areas you want.

[TruStealth™]

but I am not wanting to change my current theme. and I doubt them codes will work with out changing the whole css coding etc. I have my forum the way i like it I just want to make them few changes.

[SLGray]

Here is the CSS for the last post column:

Code:

.last-post {
float: right;
width: 180px;
font-size: 11px;
padding: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
border: 1px solid #D7D7D7;
box-shadow: 1px 1px 1px white;
margin-right: 3px;
background: white;
}

Topics & Posts:

Code:

.topics {
background: white;
margin-top: -10px;
box-shadow: 1px 1px 1px white;
padding: 2px;
font-size: 11px;
  border-radius: 3px;
  border: 1px solid #D7D7D7;}

.posts {
background: white;
padding: 2px;
border: 1px solid #D7D7D7;
border-radius: 3px;
font-size: 11px;
box-shadow: 1px 1px 1px white;
}

[TruStealth™]

them codes did nothing. them for punbb?

[Sir Chivas™]

You will have to do changes into the templates, in order for it to work. However, this will cause few bugs for your categories, since we do need to find all of the old css that contains the way you have the categories and forums setup. (css)

[TruStealth™]

You will have to do changes into the templates, in order for it to work. However, this will cause few bugs for your categories, since we do need to find all of the old css that contains the way you have the categories and forums setup. (css)

What do you mean "Since we do need to find all the old css" that contains the way I have the categories and forums setup. Are you speaking of the main css code that is with the skin?

[Sir Chivas™]

Yes,

Since the codes will be duplicated, they won't have any effect, unless we add the !important part within the CSS.

[TruStealth™]

Yes,

Since the codes will be duplicated, they won't have any effect, unless we add the !important part within the CSS.

Code:

body {
    background: url("http://i82.servimg.com/u/f82/14/65/46/14/bg_fix10.gif") repeat scroll 0 0 transparent;
    color: #333333;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 12px;
}

.pun {
    background: #F9F4CE;
    border: 1px solid #D9C586;
    border-radius: 6px 6px 6px 6px;
    line-height: 130%;
    margin: 20px auto;
    padding: 15px;
    width: 990px;
}

.pun a:link {
    color: #00487D;
    text-decoration: none;
}
.pun a:visited {
    color: #00487D;
}
.pun a:hover {
    color: #BF7360;
}
.pun a:active {
    color: #00487D;
}
.pun a:focus {
    color: #00487D;
}

#pun-intro {
    background: url("http://i82.servimg.com/u/f82/14/65/46/14/highli10.png") repeat-x scroll 0 0 #F9D79B;
    border: 1px solid #EBB962;
    box-shadow: 0 1px 4px #FDE5BB;
    padding: 10px;
    border-radius: 3px 3px 0 0;
}

#pun-head #pun-navlinks {
    background: url("http://i82.servimg.com/u/f82/14/65/46/14/catego10.png") repeat-x scroll center top #F9D9B0;
    border: 1px solid #F9BC6D;
    padding: 0.5em 1.1em 0.6em;
    border-radius: 0 0 3px 3px;
    border-top: 0px;
}

#pun-navlinks li a {
    margin: 0 0.8em 0 0;
    color: #6D3F03;
}
#pun-navlinks a, #pun-navlinks a:hover {
    text-decoration: none;
    color: #BF7360;
}

.pun .main-content {
    background-color: #FBFBFB;
    border: 1px solid #E7D9AD;
}
.pun table.table td {
    background-color: #fff;
    border-color: #E7D9AD;
    border-style: solid none none solid;
    border-width: 1px;
    line-height: 130%;
    padding: 10px;
}
.pun .main table td.tc2, .pun .main table td.tc3 {
    background-color: #fff;
}

.main .main-head {
    margin-top: 10px;
    background: url("http://i82.servimg.com/u/f82/14/65/46/14/catego10.png") repeat-x scroll center top #F9D9B0;
    border: 1px solid #F9BC6D;
    border-radius: 5px 5px 5px 5px;
    color: #6D3F03;
    font-size: 11px;
    border-radius: 4px 4px 0 0;
    min-height: 6px;
}

.pun table.table th {
    background-color: transparent;
    border-style: none;
    color: #6D3F03;
    padding: 0.5em 0;
}

.pun .post {
    border-color: #EEEEEE #FFFFFF #E7D9AD;
    border-style: solid none;
    border-width: 0px 0 1px;
}

.pun .postmain {
    background-color: #fff;
    border-left: 1px solid #E7D9AD;
    margin-left: 18em;
}
.pun .posthead {
    background: url("http://i82.servimg.com/u/f82/14/65/46/14/catego10.png") repeat-x scroll center top #F9D9B0;
    border-bottom: 1px solid #F9BC6D;
    padding: 0.5em 1.3em 0.5em 1em;
}

.postfoot {
    border-top: 0px dashed #CCCCCC;
    clear: both;
    margin-left: -17em;
    padding: 0.5em 1em;
    text-align: right;
}

.main .main-foot {
    background-color: transparent;
    color: #DEDFDF;
    font-weight: 400;
    padding: 0.7em 1.3em;
}

.postmain blockquote {
    background-color: #F9F4CE;
    border: 1px solid #F9BC6D;
    padding: 0.5em 1em;
}

#pun-about {
    background-color: #FFF4E5;
    border-color: #F9D9B0;
    border-style: solid;
    border-width: 1px;
    line-height: 150%;
    padding: 0.6em 1em;
    text-align: right;
}
#pun-about ul {
    list-style-type: none;
}
#pun-about ul li {
    display: inline;
}
#pun-about ul li a {
    font-weight: normal;
}
#pun-about #qjump {
    display: none;
}

#stats {
    background-color: transparent;
    line-height: 150%;
    padding: 0.6em 1em;
}
#onlinelist {
    background-color: transparent;
    border-top: 1px dashed #D9C586;
    padding: 0.6em 1em;
}

#pun-visit, .main-box {
    background-color: #FBFBFB;
    border-color: #D9C586;
    border-style: solid;
    border-width: 1px;
    margin: 0 0 1em;
    padding: 0.6em 1em;
}

.pun .paged-foot, .pun .paged-head{
    background-color: transparent;
    border: 0px solid #BFE4FF;
    padding: 0.6em 1.3em 0.3em;
}

[Sir Chivas™]

Alright, I've looked at your CSS and you're good, all you have to do is use edit the template. Is this theme install on hitskin or is provided in another forum?

[TruStealth™]

hotskin them

[Sir Chivas™]

Can you provide me the URL or the name of the theme? Thank you.

[TruStealth™]

Can you provide me the URL or the name of the theme? Thank you.

You would just have to ask that I don't remember the link but  ill try to find it here you found it  but i cant post links

[Sir Chivas™]

All right, post it here when you find it. I think I've seen this theme somewhere as well, I'll search for it as well. If I do find and can provide the template editing, I'll post it. Good luck.

[TruStealth™]

All right, post it here when you find it. I think I've seen this theme somewhere as well, I'll search for it as well. If I do find and can provide the template editing, I'll post it. Good luck.

I cant post the link says i have to wait 7 days can I pm it to you.


Updated post:

Cant post links here or in pms but the theme is by matti_7 called PunBB gold

[Sir Chivas™]

Wow, I didn't see this link: I was speaking about this theme: https://help.forumotion.com/t116797-drop-gallery-theme#869748

All right, just basically add this parts: Into the templates: ACP >> Display >> Templates >> General


Index_body:

Code:

<div class="pun-crumbs">
  <p class="crumbs"><a href="{U_INDEX}">{L_INDEX}</a><strong>{NAV_CAT_DESC}</strong></p>
</div>
<div class="main">
<!-- BEGIN catrow -->
  <!-- BEGIN tablehead --><br>
      <div class="main-head">
        <div class="page-title">{catrow.tablehead.L_FORUM}</div>
      </div>
      <div class="main-content">
        <table cellspacing="0" class="table">
            <thead>
              <tr class="ascundema">
                  <th class="tcl">{L_FORUM}</th>
                  <th class="tc2">{L_TOPICS}</th>
                  <th class="tc3">{L_POSTS}</th>
                  <th class="tcr">{L_LASTPOST}</th>
                                          </tr>
            </thead>
            <tbody class="statused">
  <!-- END tablehead -->

  <!-- BEGIN forumrow -->
              <tr>
                  <td class="tcl" style="padding-right: {catrow.forumrow.INC_LEVEL_RIGHT}; padding-left: {catrow.forumrow.INC_LEVEL_LEFT};">
                   
                                   
  <span class="status" style="margin-right: -{catrow.forumrow.INC_WIDTH_ICON}; margin-left: -{catrow.forumrow.INC_WIDTH_ICON};">
                        <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
                    </span>
                                               
                    <h{catrow.forumrow.LEVEL} class="hierarchy"><a href="{catrow.forumrow.U_VIEWFORUM}" class="forumtitle">{catrow.forumrow.FORUM_NAME}</a></h{catrow.forumrow.LEVEL}>
                    <br />
                                                          <div class="desc">{catrow.forumrow.FORUM_DESC}</div>
                    <!-- BEGIN switch_moderators_links -->
                    <br />
                    {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
                    <!-- END switch_moderators_links -->
                    {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
                    <strong>{forumrow.L_SUBFORUM_STR}</strong> {forumrow.SUBFORUMS}
                                                          </td><td class="tc3">
                  <div class="posts">{catrow.forumrow.TOPICS} {L_TOPICS}</div><br>
                                                          <div class="topics">{catrow.forumrow.POSTS} {L_POSTS}</div></td>
                  <td class="tcr">
                    <span>
                    <!-- BEGIN switch_topic_title -->
                    <a href="{catrow.forumrow.U_LATEST_TOPIC}" title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a><br />
                    <!-- END switch_topic_title -->
                                                          <div class="last-post">{catrow.forumrow.USER_LAST_POST}</div>
                    </span>
                  </td>
              </tr>
  <!-- END forumrow -->

  <!-- BEGIN tablefoot -->
            </tbody>
        </table>
      </div>
  <!-- END tablefoot -->
<!-- END catrow -->
</div>

<!-- BEGIN switch_on_index -->
<div class="main-box clearfix">
  <ul>
      <li><a href="{U_TODAY_ACTIVE}">{L_TODAY_ACTIVE}</a></li>
      <li><a href="{U_TODAY_POSTERS}">{L_TODAY_POSTERS}</a></li>
      <li><a href="{U_OVERALL_POSTERS}">{L_OVERALL_POSTERS}</a></li>
  </ul>
  <!-- BEGIN switch_delete_cookies -->
  <p class="right">
      <a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}">{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a>
  </p>
  <!-- END switch_delete_cookies -->
</div>
<!-- END switch_on_index -->     

and this into the CSS:

Code:

.pun .main table td.tc2, .pun .main table td.tc3{
  background: transparent;
border-right: none;
border-left: none;
border-top: none;
border-bottom: 1px solid #EBEBEB;}
.last-post {
float: right;
width: 180px;
font-size: 11px;
padding: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
border: 1px solid #D7D7D7;
box-shadow: 1px 1px 1px white;
margin-right: 3px;
background: white;
}
.topics {
background: white;
margin-top: -10px;
box-shadow: 1px 1px 1px white;
padding: 2px;
font-size: 11px;
  border-radius: 3px;
  border: 1px solid #D7D7D7;}

.posts {
background: white;
padding: 2px;
border: 1px solid #D7D7D7;
border-radius: 3px;
font-size: 11px;
box-shadow: 1px 1px 1px white;
}

[TruStealth™]

[Sir Chivas™]

There's few codes missing, hold up.

[TruStealth™]

is there also a way to shorten up the topics and post boxes and put them side by side

[Sir Chivas™]

Add this into your CSS:

Code:

.pun .table .tc2, .pun .table .tc3 {
text-align: center;
width: 10%;
}
.pun table .tcr {
overflow: hidden;
padding: 0 0 0 .5em !important;
text-align: left;
width: 30%;
}
.pun tbody.statused td.tcl {
padding-left: 3.4em;
border-right: none;
border-left: none;
border-top: none;
border-bottom: 1px solid #EBEBEB;
}

[TruStealth™]

still the same why with the code you provided 

[SLGray]

Please remove your forum from maintenance. Do you have a link to Forumotion on your loading page?

[TruStealth™]

Please remove your forum from maintenance.  Do you have a link to Forumotion on your loading page?

Yes there is a button on there that says enter site if you click on it it will redirect you

[SLGray]

No, I mean a link to www.forumotion.com.

[TruStealth™]

I can not post links because I have not been a member for 7+ days according to this forum settings but please use the globe under my pic it will take you to my forum


Them codes are also knocking out my whos online at the bottom of the forum

[SLGray]

I can not see your forum as a guest.

[TruStealth™]

I can not see your forum as a guest.

ill pm you a name with a temp password