Good art is a taste, good design is an opinion.


Come as guest, stay as family.
Board Index

Come as guest, stay as family.


You are not connected. Please login or register

Board Index » Forumotion »  [Read Only] Questions & Problems »[Solved] Mini Address Bar

Foto

[Solved] Mini Address Bar

by ,


View previous topic View next topic Go down Message [Page 1 of 1]

1
Offline

  decru

decru
Punbb Rookie
Punbb Rookie
2014-02-26, 12:45
I don't know how to call this but. its like a mini address bar.

on my forum

[Solved] Mini Address Bar Untitl11

I want it to be change like this

[Solved] Mini Address Bar 112

Powered by PunBB
Currently 0 users have thanked decru for this post:

2
Offline

  Guest

Anonymous
Guest
2014-02-26, 13:59
It's called a pun crumbs,

Put this in your CSS

Code:
[panda=css].pun-crumbs {
    background: none repeat scroll 0px 0px #EFF1F3;
    border: 1px solid #D9DBDD;
    border-radius: 5px;
    box-shadow: 0px 0px 3px rgba(109, 119, 237, 0.2);
    clear: both;
    font-size: 11px;
    margin: 0px 1px 1em;
    overflow: hidden;
    padding: 0.2em 1em;
}

PS: To move position you must move it from templates.

Powered by PunBB
Currently 0 users have thanked Guest for this post:

3
Offline

  decru

decru
Punbb Rookie
Punbb Rookie
2014-02-26, 15:00
Rapid wrote:It's called a pun crumbs,

Put this in your CSS

Code:
[panda=css].pun-crumbs {
    background: none repeat scroll 0px 0px #EFF1F3;
    border: 1px solid #D9DBDD;
    border-radius: 5px;
    box-shadow: 0px 0px 3px rgba(109, 119, 237, 0.2);
    clear: both;
    font-size: 11px;
    margin: 0px 1px 1em;
    overflow: hidden;
    padding: 0.2em 1em;
}


PS: To move position you must move it from templates.

thank you for active response. what particular templates do u need to edit? any idea?

Powered by PunBB
Currently 0 users have thanked decru for this post:

4
Offline

  Shadow

Shadow
Administrator
Administrator
2014-02-26, 17:04
Everywhere where you get pun-crumbs at templates.

Powered by PunBB
Currently 0 users have thanked Shadow for this post:

5
Offline

  decru

decru
Punbb Rookie
Punbb Rookie
2014-02-26, 23:11
Shadow wrote:Everywhere where you get pun-crumbs at templates.


I have two pun-crumbs on my templates sir.

1st is at memberlist_body

Code:
[panda=css]<style>
.pun .table.memberlist tbody tr td {
    border: 0px;
    background: white!important;
    border-bottom: 1px solid #DDD;
}
.pun .table.memberlist tbody tr:nth-child(2n+2) td {
    background: rgb(250, 250, 250)!important;
}
.table.memberlist .tcl.avatar-mini .gen img {
    padding: 1px;  border: 1px solid #DDD;  box-shadow: 0px 1px 3px -1px #BEBEBE;
    width: 70px;
    height: 70px;
}
.table.memberlist .tcl.avatar-mini .gen img:hover {
    border-color: #aaa;
}
.table.memberlist .tcl.avatar-mini a {
    font-family: arial, sans-serif;  font-size: 13px;  font-style: italic;
  }
.table.memberlist #user-hoverbox {
    margin-top: 75px;
    position: absolute;
}
</style><!-- BEGIN switch_user_logged_in -->
<div id="pun-visit" class="clearfix">
   <ul>
         <li><a href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a></li>
         <li><a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a></li>
   </ul>
   <p>{LOGGED_AS}. {LAST_VISIT_DATE}</p>
</div>
<!-- END switch_user_logged_in -->

<!-- BEGIN switch_user_logged_out -->
<div id="pun-visit">
   <p>{L_NOT_CONNECTED} {L_LOGIN_REGISTER}</p>
</div>
<!-- END switch_user_logged_out -->

<div class="pun-crumbs">
   <p class="crumbs">
      <a href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}&nbsp;&raquo;&nbsp;<strong>{PAGE_TITLE}</strong>
   </p>
</div>

<div class="main frm">

   <!-- BEGIN switch_pagination -->
   <div class="paged-head clearfix">
      <p class="paging">{PAGINATION}</p>
   </div>
   <!-- END switch_pagination -->

   <div class="main-head">
      <h1 class="page-title">MEMBER LIST</h1>
   </div>

   <div class="main-content"><fieldset class="frm-set clearfix" style="margin: 0;padding: 0;">
         <div class="frm-form" style="margin: 0;">
            <table class="table memberlist" cellspacing="0" style="border: 0px">
               <thead>
                  <tr>
                     <th class="tcl memberlist">{L_AVATAR} - {L_USERNAME}</th>
                     <!-- BEGIN switch_th_group -->
                     <th class="tc2">{L_GROUPS}</th>
                     <!-- END switch_th_group -->
                     <th class="tc3">{L_INTERESTS}</th>
                     <th class="tc2">{L_JOINED}</th>
                     <th class="tc2">{L_VISITED}</th>
                     <th class="tc3">{L_POSTS}</th>
                     <th class="tc3">{L_PM}</th>
                     <th class="tc3">{L_WEBSITE}</th>
                  </tr>
               </thead>

               <tbody>
                  <!-- BEGIN memberrow -->
                  <tr>
                     <td class="tcl avatar-mini">
                                                          <a class="gen" href="{memberrow.U_VIEWPROFILE}">{memberrow.AVATAR_IMG}&nbsp;</a><a class="gen user" href="{memberrow.U_VIEWPROFILE}"><span>{memberrow.USERNAME}</span></a></td>
                     <!-- BEGIN switch_td_group -->
                     <td class="tc2">{memberrow.GROUPS}</td>
                     <!-- END switch_td_group -->
                     <td class="tc3">{memberrow.INTERESTS}</td>
                     <td class="tc2">{memberrow.JOINED}</td>
                     <td class="tc2">{memberrow.LASTVISIT}</td>
                     <td class="tc3">{memberrow.POSTS}</td>
                     <td class="tc3">{memberrow.PM_IMG}</td>
                     <td class="tc4">{memberrow.WWW_IMG}</td>
                  </tr>
                  <!-- END memberrow -->
                  <!-- BEGIN switch_no_user -->
                  <tr>
                     <td colspan="{switch_no_user.COLSPAN_NUMBER}" class="tcr">{switch_no_user.L_NO_USER}</td>
                  </tr>
                  <!-- END switch_no_user -->
               </tbody>
            </table>
         </div>
      </fieldset>
   </div>
<!-- BEGIN switch_pagination -->
   <div class="paged-foot clearfix">
      <p class="paging">{PAGINATION}</p>
   </div>
   <!-- END switch_pagination -->
  <br/>
  <style>.dr_frm-buttons {
    display: block;
    clear: both;
    text-align: center;
    padding-top: 25px;
}
.frm-set.multi.search dl {
    font-size: 11px;  color: #999;  display: block;  float: left;      
    padding: 0 10px;  border-right: 1px solid #ddd;  font-weight: normal;
    height: 50px;
}
.frm-set.multi.search .username_input input {
    background: #ffffff;  color: #979797;  font-size: 11px;  outline: 0;  
    border: 1px solid rgb(206, 206, 206);  padding: 0px 10px;  
    height: 30px;  
    margin-top: 7px;
    width: 285px;
}
.frm-set.multi.search .select_mode select ,.frm-set.multi.search .s_order_select select {
    height: 35px;
    width: 260px;
}
.frm-set.multi.search dl dd {
    margin: 0;
}
.frm-set.multi.search .dr_frm-buttons input {
    font-size: 11px;  color: #666;  border-radius: 2px;  cursor: pointer;  border: 1px solid #C2C2C2;  background: rgb(255,255,255);  background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(238,238,238,1) 100%);  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(238,238,238,1)));  background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(238,238,238,1) 100%);  background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(238,238,238,1) 100%);  background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(238,238,238,1) 100%);  background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(238,238,238,1) 100%);  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 );  box-shadow: 0px 1px 1px rgba(204, 204, 204, 0.18);    
    width: 200px;    padding: 10px;  text-transform: uppercase;  
    font-weight: bold;
    margin: 10px auto;
    }
  
.frm-set.multi.search .dr_frm-buttons input:hover{background: #fefefe;}
.frm-set.multi.search .dr_frm-buttons input:active {
    background: rgb(238,238,238); background: -moz-linear-gradient(top,  rgba(238,238,238,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(238,238,238,1)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */  background: -webkit-linear-gradient(top,  rgba(238,238,238,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */  background: -o-linear-gradient(top,  rgba(238,238,238,1) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */  background: -ms-linear-gradient(top,  rgba(238,238,238,1) 0%,rgba(255,255,255,1) 100%); /* IE10+ */  background: linear-gradient(to bottom,  rgba(238,238,238,1) 0%,rgba(255,255,255,1) 100%); /* W3C */  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */;      box-shadow: inset 0px -1px 1px rgba(0, 0, 0, 0.09);
}    
  </style>
  <div class="main-head"><h1 class="page-title">SEARCH MEMBER LIST</h1></div>
<div class="main-content"><form action="{S_MODE_ACTION}" method="get" class="form-frm">
      <fieldset class="frm-set multi search">
         <dl class="username_input"  style="border-left: 1px solid #ddd;">
         <input style="height:20px;" type="text" class="inputbox" placeholder="Username" name="username" maxlength="25" size="20" value="{L_USER_SELECT_VALUE}" />
         </dl>
         <dl class="select_mode">
            
            <dd>{S_MODE_SELECT}</dd>
         </dl>
         <dl class="s_order_select">
            <dd>{S_ORDER_SELECT}</dd>
         </dl>

         <div class="dr_frm-buttons">
            {S_HIDDEN_SID}
            <input type="submit" name="submit" value="{L_SUBMIT}" />
         </div>
      </fieldset>
      </form>
  </div></div>



2nd one is Indes_box

Code:
[panda=css]<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 -->
      <div class="main-head mybb">
         <div class="page-title">{catrow.tablehead.L_FORUM}</div>
      </div>
      <div class="main-content">
         <table cellspacing="0" class="table">
            <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_forum_cat_row">{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="tc2"></td>
                  <td class="tc3">
                                                  <p id="catrow"> {catrow.forumrow.TOPICS} </span> Threads</p>
                                                   <p id="catrow"> <span>{catrow.forumrow.POSTS}</span> Posts</p></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 -->
                     {catrow.forumrow.USER_LAST_POST}
                     </span>
                  </td>
               </tr>
   <!-- END forumrow -->

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

I havent seen some values for positions. can u help me with this buddy?

Powered by PunBB
Currently 0 users have thanked decru for this post:

6
Offline

  Shadow

Shadow
Administrator
Administrator
2014-02-27, 13:37
It's the basic of HTML, please learn it better and you will be able to achieve many things with that. Also move it by yourself until you find the desired location.


Powered by PunBB
Currently 0 users have thanked Shadow for this post:

7
Offline

  decru

decru
Punbb Rookie
Punbb Rookie
2014-02-27, 16:22
Shadow wrote:It's the basic of HTML, please learn it better and you will be able to achieve many things with that. Also move it by yourself until you find the desired location.



I guess so mate.. thanks for the help and advice

Powered by PunBB
Currently 0 users have thanked decru for this post:

8
Offline

  nanako

nanako
Punbb Guru
Punbb Guru
2014-02-27, 16:43
Solved => Locked

Powered by PunBB
Currently 0 users have thanked nanako for this post:

9
Offline

  Sponsored content



Powered by PunBB
Currently 0 users have thanked Sponsored content for this post:

View previous topic View next topic Back to top Message [Page 1 of 1]


Topic URL's

URL
BBcode
HTML

Permissions in this forum:
You cannot reply to topics in this forum

 

About PunBB Design

PunBB Design (ex. PunBB Community) Forum is Forumotion hosted forum created 2012 as a test forum for helping out members and improving design and quality of the Forumotion forums. Over the time it became bigger and bigger in term of content, members and activity. That's why several times Forumotion offered us a free domain name for our community (www.punbb.biz). Today we want to back it's old activity and make it even better! In 2013 PunBB Design is awarded for best Forumotion forum.

General Links

Forum Resources

Forumotion Links

BtT
  • This skin is designed by Shadow for PunBB Design™.