Refazendo área de MP

Detalhes da questão

Endereço do fórum: http://atelier262.forumeiros.com/
Versão do fórum: PhpBB3

Descrição

Olá quero trocar totalmente a área de mp do meu fórum.

Como é: http://prntscr.com/e4o8ko

Como eu quero que seja: http://prntscr.com/e4o7e8

Download da página: https://www.sendspace.com/file/0vc4ao

Vírus total: aqui

#UP

UP

UP

UP

UP

UP

UP

UP

Da lista:

• Barra de navegação de mensagens privadas no topo.
  
• Criação de discussão.
  
• Nome da discussão na lista.
  
• Data de início da discussão.
  
• Criação de votações.
  
• Número de mensagens por mensagem.

Não foi possível fazer. Em adição:

• Caixa de envio.
  
• Mensagens enviadas.
  
• Arquivos.
  
• Excluir selecionado.
  
• Excluir tudo.
  
• Salvar selecionado.
  
• Paginação.

Foram mantidos, pois são botões de funcionamento da MP.

privmsgs_body

Código:

<form action="{S_PRIVMSGS_ACTION}" method="post" name="privmsg_list">
   <div class="fa-privmsg-navbar">
      <div class="topic-actions">
         <div class="fa-privmsg-buttons buttons">         
            <a href="/privmsg?mode=post">
               <img src="http://i.imgur.com/gOsPGI7.png" />
               Nova mensagem
            </a>
            <a href="javascript:select_switch_privmsg(true);">
               <img src="http://i.imgur.com/gOsPGI7.png" />
               {L_MARK_ALL}
            </a>
         </div>
      </div>
      <ul id="privmsgs-menu">
         <li><img src="http://i.imgur.com/gOsPGI7.png" /> <span>{INBOX}</span></li>
         <li><img src="http://i.imgur.com/gOsPGI7.png" /> <span>{SENTBOX}</span></li>
         <li><img src="http://i.imgur.com/gOsPGI7.png" /> <span>{OUTBOX}</span></li>
         <li><img src="http://i.imgur.com/gOsPGI7.png" /> <span>{SAVEBOX}</span></li>
      </ul>
   </div>

   <div class="forabg fa-privmsgbg">
      <ul class="topiclist pmlist bg_none">
         <!-- BEGIN listrow -->
         <li class="row {listrow.ROW_CLASS}">
            <dl class="icon">
               <dt>
                  <img src="{listrow.PRIVMSG_FOLDER_IMG}" /> {listrow.PRIVMSG_ICON}
                  <a href="{listrow.U_READ}" class="topictitle">{listrow.SUBJECT}</a><br />
                  <span class="fa-privmsg-date">{listrow.DATE}</span>
                  <span class="fa-privmsg-from">{listrow.FROM}</span>
               </dt>
               <dd class="mark"><input type="checkbox" name="mark[]2" value="{listrow.S_MARK_ID}" /></dd>
            </dl>
         </li>
         <!-- END listrow -->
         <!-- BEGIN switch_no_messages -->
         <li class="row row1">
            <dl class="icon">
               <dt>
                  <strong>{L_NO_MESSAGES}</strong>
               </dt>
               <dd class="mark"></dd>
            </dl>
         </li>
         <!-- END switch_no_messages -->
      </ul>
   </div>
   
   <div class="clear"></div>
   <p><span class="pagination">{PAGINATION}</span>{PAGE_NUMBER}</p>
   <div class="clear"></div>
   
   <div class="topic-actions fa-privmsg-actions">
      <div class="pagination">
         <p>
            {S_HIDDEN_FIELDS}
            <!-- BEGIN switch_save -->
            <input class="button1" type="submit" name="save" value="{L_SAVE_MARKED}" />
            <!-- END switch_save -->
            <!-- BEGIN switch_move_profile -->
            <input class="button1" type="submit" name="moveprofile" value="{L_MOVE_PROFILE_MARKED}" />
            <!-- END switch_move_profile -->
            <input class="button2" type="submit" name="delete" value="{L_DELETE_MARKED}" />
            <input class="button2" type="submit" name="deleteall" value="{L_DELETE_ALL}" />
         </p>
      </div>
   </div>
</form>

CSS:

Código:

.fa-privmsg-navbar {
    background-color: #545759;
    padding: 5px 20px;
    margin-bottom: 15px;
    overflow: hidden;
    border-radius: 5px;
}

.fa-privmsg-navbar a {
    display: inline-block;
    background: linear-gradient( 0deg, #eee, #fff); ;
    border-radius: 3px;
    padding: 0 15px;
    line-height: 30px;
    font-size: 14px;
    color: #333;   
}

.fa-privmsg-navbar img {
    vertical-align: middle;
    margin: 0 5px 0 0;
}

.fa-privmsg-navbar .topic-actions {
    margin: 0;
    overflow: hidden;
    float: left;
}

ul#privmsgs-menu {
    padding: 0;
    float: right;
}

.fa-privmsg-buttons a {
    margin-right: 10px;
}

ul#privmsgs-menu li {
    margin: 0;
    display: inline-block;   
    line-height: 30px;
    border: none;
    padding: 0;
    height: 30px;
    vertical-align: middle;
    position: relative;
    font-size: 14px;
}

ul#privmsgs-menu li:first-child span,
ul#privmsgs-menu li:first-child a  {
    border-radius: 5px 0 0 5px;
}

ul#privmsgs-menu li:last-child span,
ul#privmsgs-menu li:last-child a {
    border-radius: 0 5px 5px 0;
}

ul#privmsgs-menu span {
    position: relative;
    display: block;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #2a2a2a;
    padding-left: 45px;
    padding-right: 15px;
    color: #fff;
    text-align: left;
}

ul#privmsgs-menu img {
    position: absolute;
    z-index: 1;
    left: 15px;
    top: 2.5px;
}

ul#privmsgs-menu a,
.fa-privmsg-actions input {
    position: relative;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: linear-gradient(180deg, rgba(68,68,68,1) 0%, rgba(34,34,34,1) 100%);
    border: 1px rgba(0,0,0,0.1) solid;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.25), 0 1px 2px rgba(0,0,0,0.1);
    color: #fff;
    border-radius: 0;
    padding-left: 45px;;
    margin-left: -45px;
    margin-right: -15px;
    text-align: left;
    box-sizing: border-box;
    height: 30px;
}

ul#privmsgs-menu a:hover,
ul#privmsgs-menu a:active,
ul#privmsgs-menu a:focus,
.fa-privmsg-actions input:hover,
.fa-privmsg-actions input:focus {
    background: #2a2a2a;
}

ul.pmlist dt {
    padding-left: 0;
}

ul.pmlist img {
    vertical-align: middle;
}

ul.pmlist dl {
    background-color: #244457;
    margin-bottom: 15px;
}

ul.pmlist li.row {
    border: none;
    background-color: transparent;
}

ul.pmlist a.topictitle {
    color: #C2C2DA;
}

.fa-privmsgbg {
    background: none;
    padding: 0;
    border: none;
}

ul.pmlist dl {
    padding: 5px 10px !important;;
    border-radius: 10px;
}

ul.pmlist dl img {
    margin-right: 5px;
}

.fa-privmsg-date {
    color: #5573bf;
    margin-right: 10px;
    font-size: 12px;
}

.fa-privmsg-from {
    font-size: 12px;
}

.pmlist .mark {
    border: none !important;
    text-align: right;
}

.fa-privmsg-actions input {
   border: none !important;
   color: #fff !important;
   padding: 0 15px;
   margin: 0;
}

.fa-privmsg-actions input:first-child {
    border-radius: 5px 0 0 5px;
}

.fa-privmsg-actions input:last-child {
    border-radius: 0 5px 5px 0;
}