Affichage sujet clair #001

Auteur.e.s: Jei

Templates & CSS & JS

Templates modifiés:viewtopic_body

viewtopic_body

Remplacer l'intégralité du template par le code suivant:

Code:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@6.9.96/css/materialdesignicons.min.css" />

<!-- BEGIN switch_push_direct_send -->
<div id="push-answer" class="jqmWindow"></div>
<script src="{JQUERY_DIR}jqmodal/jqmodal.js" type="text/javascript"></script>
<script type="text/javascript">
 $(document).ready(function() {
 $('#push-answer').jqm({toTop: true});

 $('#push-bell').click(function () {
 return sendWebPush({TOPIC_ID});
 });
 function sendWebPush(tId){
 $.get("/ajax_push.php?topicID=" + tId ).done(showPushAnswer);
 }

 function showPushAnswer(data) {
 $('#push-answer').html(data).jqmShow();
 $('.jqmOverlay').bgiframe();
 $('#push-answer').bgiframe();
 }
 });
 //]]>
</script>
<!-- END switch_push_direct_send -->

<thread class="container">
  
  <thread class="header">
    <a href="{TOPIC_URL}" class="topic_title">{TOPIC_TITLE}</a>
    <!-- BEGIN switch_push_direct_send -->&nbsp;<span id="push-bell" style="color:goldenrod;" title="{switch_push_direct_send.L_PUSH_SEND}" class="mdi mdi-bell"></span><!-- END switch_push_direct_send -->
    
    <thread class="header_nav">
      <a class="nav" href="{U_INDEX}"><span>{L_INDEX}</span></a>
      {NAV_CAT_DESC}
    </thread>

    <thread class="posters_list">{POSTERS_LIST}</thread>
  </thread>

  <thread class="buttons">
    <!-- BEGIN switch_user_authpost -->
    <a href="{U_POST_NEW_TOPIC}" rel="nofollow" {S_POST_NEW_TOPIC} title="{T_POST_NEW_TOPIC}" class="newtopic"><span class="mdi mdi-pencil"></span> {L_POST_NEW_TOPIC}</a>
    <!-- END switch_user_authpost -->
    <!-- BEGIN switch_user_authreply -->
    <a href="{U_POST_REPLY_TOPIC}" {S_POST_REPLY_TOPIC} title="{T_POST_REPLY_TOPIC}" class="newreply"><span class="mdi mdi-reply"></span> {L_POST_REPLY_TOPIC}</a>
    <!-- END switch_user_authreply -->
  </thread>

  <!-- BEGIN topicpagination -->
  <thread class="pagination">{PAGINATION}</thread>
  <!-- END topicpagination -->

  <thread class="polldisplay">{POLL_DISPLAY}</thread>

  <!-- BEGIN postrow -->
  
    <!-- BEGIN hidden -->
    <div class="post {postrow.hidden.ROW_COUNT}"><p style="text-align:center">{postrow.hidden.MESSAGE}</p></div>
    <!-- END hidden -->
    <!-- BEGIN displayed -->
    <div id="p{postrow.displayed.U_POST_ID}" class="post {postrow.displayed.ROW_COUNT}{postrow.displayed.ONLINE_IMG_NEW} post--{postrow.displayed.U_POST_ID}"{postrow.displayed.THANK_BGCOLOR} style="{postrow.displayed.DISPLAYABLE_STATE}">
            <div style="position: relative; top: -30px; width: 1px;" id="{postrow.displayed.U_POST_ID}"></div>
 <div class="post_profile">
          <div class="poster_avatar">
            {postrow.displayed.POSTER_AVATAR}
            
            <div class="poster_avatarfields">
              <div class="poster_buttons">
                <div class="poster_button_fields">Profil</div>
                <div class="poster_button_rpg">RPG</div>
              </div>
            
      <!-- BEGIN profile_field -->
              <div class="p_afield">
        <div class="p_afield_label">{postrow.displayed.profile_field.LABEL}</div>
        <div class="p_afield_content">{postrow.displayed.profile_field.CONTENT}</div>
        {postrow.displayed.profile_field.SEPARATOR}
              </div>
    <!-- END profile_field -->
          
            <div class="poster_rpg">{postrow.displayed.POSTER_RPG}</div>

    <div class="poster_contact">
              {postrow.displayed.PROFILE_IMG}{postrow.displayed.PM_IMG}{postrow.displayed.EMAIL_IMG}<!-- BEGIN contact_field -->{postrow.displayed.contact_field.CONTENT}<!-- END contact_field -->
          </div>
              
          </div>
        </div>
      </div>

 <div class="postbody">           
          <div class="poster_nar">
            <div class="poster_name">{postrow.displayed.POSTER_NAME}</div>
    <div class="poster_ranks">{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}</div>
          </div>
          
  <div class="post_icons">
            <ul class="profile-icons">
      <li class="btn-thank"><a href="{postrow.displayed.THANK_URL}"><span class="mdi mdi-heart"></span></a></li>
      <li class="btn-quote-multi"><span onclick="{postrow.displayed.MULTIQUOTE_URL}" id="post_mq{TOPIC_ID}_{postrow.displayed.U_POST_ID}"><span class="mdi mdi-format-quote-close-outline"></span></span></li>
      <li class="btn-quote"><a href="{postrow.displayed.QUOTE_URL}"><span class="mdi mdi-format-quote-close"></span></a></li>
      <li class="btn-edit"><a href="{postrow.displayed.EDIT_URL}"><span class="mdi mdi-pencil"></span></a></li>
      <li class="btn-delete"><a href="{postrow.displayed.DELETE_URL}"><span class="mdi mdi-delete"></span></a></li>
      <li class="btn-ip"><a href="{postrow.displayed.IP_URL}"><span class="mdi mdi-ip"></span></a></li>
      <li class="btn-report">{postrow.displayed.REPORT_IMG}</li>
            </ul>
          </div>
 

 <!-- BEGIN switch_vote_active -->
 <div class="vote">
 <!-- BEGIN switch_vote -->
 <a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}" class="ion-plus-circled"></a>
 <!-- END switch_vote -->

 <!-- BEGIN switch_vote -->
 <a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}" class="ion-minus-circled"></a>
 <!-- END switch_vote -->

 <!-- BEGIN switch_bar -->
 <div class="vote-bar" title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}">
 <div class="vote-bar-desc">
 {postrow.displayed.switch_vote_active.L_VOTE_TITLE}
 </div>

 <div class="vote-bars">
 <!-- BEGIN switch_vote_plus -->
 <div class="vote-bar-plus" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;"></div>
 <!-- END switch_vote_plus -->

 <!-- BEGIN switch_vote_minus -->
 <div class="vote-bar-minus" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>
 <!-- END switch_vote_minus -->
 </div>
 </div>
 <!-- END switch_bar -->

 <!-- BEGIN switch_no_bar -->
 <div title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}" class="vote-bar-empty"></div>
 <!-- END switch_no_bar -->
 </div>
 <!-- END switch_vote_active -->

 
 <div class="content">
 <div>{postrow.displayed.MESSAGE}</div>
 <!-- BEGIN switch_attachments -->
 <dl class="attachbox">
 <dt>{postrow.displayed.switch_attachments.L_ATTACHMENTS}</dt>
 <dd class="attachments">
 <!-- BEGIN switch_post_attachments -->
 <dl class="file">
 <dt>
 <img src="{postrow.displayed.switch_attachments.switch_post_attachments.U_IMG}" alt=""/>
 </dt>
 <dd>
 <!-- BEGIN switch_dl_att -->
 <span><a class="postlink" href="{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.U_ATTACHMENT}">{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT}</a> {postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT_DEL}</span>
 <!-- END switch_dl_att -->

 <!-- BEGIN switch_no_dl_att -->
 <span>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT} {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT_DEL}</span>
 <!-- END switch_no_dl_att -->

 <!-- BEGIN switch_no_comment -->
 <span>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_comment.ATTACHMENT_COMMENT}</span>
 <!-- END switch_no_comment -->

 <!-- BEGIN switch_no_dl_att -->
 <span><strong>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO_DL}</strong></span>
 <!-- END switch_no_dl_att -->

 <span>({postrow.displayed.switch_attachments.switch_post_attachments.FILE_SIZE}) {postrow.displayed.switch_attachments.switch_post_attachments.NB_DL}</span>
 </dd>
 </dl>
 <!-- END switch_post_attachments -->
 </dd>
 </dl>
 <!-- END switch_attachments -->
 </div>
 <div class="edited-message">
 {postrow.displayed.EDITED_MESSAGE}
 </div>
 <!-- BEGIN switch_signature -->
 <div class="signature_div" id="sig{postrow.displayed.U_POST_ID}">{postrow.displayed.SIGNATURE_NEW}</div>
 <!-- END switch_signature -->
 
 <!-- BEGIN switch_likes_active -->
 <div class="fa_like_div">
 <button class="rep-button {postrow.displayed.switch_likes_active.C_VOTE_LIKE}"  data-href="{postrow.displayed.switch_likes_active.U_VOTE_LIKE}" data-href-rm="{postrow.displayed.switch_likes_active.U_VOTE_RM_LIKE}">
 <i class="ion-thumbsup"></i>
 <span>{postrow.displayed.switch_likes_active.L_LIKE}</span>{postrow.displayed.switch_likes_active.COUNT_VOTE_LIKE}
 </button>
 <!-- BEGIN switch_dislike_button -->
 <button class="rep-button {postrow.displayed.switch_likes_active.switch_dislike_button.C_VOTE_DISLIKE}" data-href="{postrow.displayed.switch_likes_active.switch_dislike_button.U_VOTE_DISLIKE}" data-href-rm="{postrow.displayed.switch_likes_active.switch_dislike_button.U_VOTE_RM_LIKE}">
 <i class="ion-thumbsdown"></i>
 <span>{postrow.displayed.switch_likes_active.switch_dislike_button.L_DISLIKE}</span>{postrow.displayed.switch_likes_active.switch_dislike_button.COUNT_VOTE_DISLIKE}
 </button>
 <!-- END switch_dislike_button -->
 <!-- BEGIN switch_like_list -->
 {postrow.displayed.switch_likes_active.switch_like_list.D_LIKE_LIST}
 <!-- END switch_like_list -->
 <!-- BEGIN switch_dislike_list -->
 {postrow.displayed.switch_likes_active.switch_dislike_list.D_DISLIKE_LIST}
 <!-- END switch_dislike_list -->
 </div>
 <!-- END switch_likes_active -->
          <div class="post_date">{postrow.displayed.POST_DATE_NEW}</div>
       </div>
 </div>
 <!-- BEGIN first_post_br -->
 <hr id="first-post-br" />
 <!-- END first_post_br -->
 <!-- END displayed -->
<!-- END postrow -->
  
<script type="text/javascript">
$('.p_afield').each(function() {
    var $label = $(this).find('span:last').text();

    $(this).attr('data-label', $label);
    $(this).find('.p_afield_content').attr('data-label', $label);
});
  
$('.poster_button_fields').on('click', function() {
    $(this).parent().parent().find('.p_afield').show();
    $(this).parent().parent().find('.poster_rpg').hide();
});

$('.poster_button_rpg').on('click', function() {
    $(this).parent().parent().find('.p_afield').hide();
    $(this).parent().parent().find('.poster_rpg').show();
});
</script>

<a name="bottomtitle"></a>

<div class="topic-actions bottom">
 <!-- BEGIN topicpagination -->
 <div class="pagination">
 {PAGINATION}
 </div>
 <!-- END topicpagination -->

 <div class="topic-actions-buttons">
  <!-- BEGIN switch_user_logged_in -->
  <!-- BEGIN watchtopic -->
          <div class="thread_watch">{S_WATCH_TOPIC}</div>
  <!-- END watchtopic -->
  <!-- END switch_user_logged_in -->
 
          <thread class="buttons">
     <!-- BEGIN switch_user_authpost -->
     <a href="{U_POST_NEW_TOPIC}" rel="nofollow" {S_POST_NEW_TOPIC} title="{T_POST_NEW_TOPIC}" class="newtopic"><span class="mdi mdi-pencil"></span> {L_POST_NEW_TOPIC}</a>
     <!-- END switch_user_authpost -->
     <!-- BEGIN switch_user_authreply -->
     <a href="{U_POST_REPLY_TOPIC}" {S_POST_REPLY_TOPIC} title="{T_POST_REPLY_TOPIC}" class="newreply"><span class="mdi mdi-reply"></span> {L_POST_REPLY_TOPIC}</a>
     <!-- END switch_user_authreply -->
          </thread>
 </div>
</div>

<!-- BEGIN promot_trafic -->
 <div class="block" id="ptrafic_close" style="display: none;">
 <div class="h3"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><i class="ion-ios-plus-outline"></i></a>{PROMOT_TRAFIC_TITLE}</div>
 </div>
 <div class="block" id="ptrafic_open" style="display:'';">
 <div class="h3"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><i class="ion-ios-minus-outline"></i></a>{PROMOT_TRAFIC_TITLE}</div>
 <ul class="ptrafic">
 <!-- BEGIN link -->
 <li>
 <a href="{promot_trafic.link.U_HREF}" title="{promot_trafic.link.TITLE}">
 <i class="ion-ios-chatbubble-outline"></i>{promot_trafic.link.TITLE}
 </a>
 </li>
 <!-- END link -->
 </ul>
 </div>
<!-- END promot_trafic -->

<!-- BEGIN switch_forum_rules -->
<div class="post row1" id="forum_rules">
 <div class="h3">{L_FORUM_RULES}</div>
 <div class="clear"></div>
 <table class="postbody">
 <tr>
 <!-- BEGIN switch_forum_rule_image -->
 <td class="logo">
 <img src="{RULE_IMG_URL}" alt="" />
 </td>
 <!-- END switch_forum_rule_image -->
 <td class="rules content">
 {RULE_MSG}
 </td>
 </tr>
 </table>
</div>
<!-- END switch_forum_rules -->

<!-- BEGIN switch_user_logged_in -->
 <a name="quickreply"></a>
 {QUICK_REPLY_FORM}
<!-- END switch_user_logged_in -->

<form action="{S_JUMPBOX_ACTION}" method="get" onsubmit="if(document.jumpbox.f.value == -1){return false;}">
 <fieldset class="jumpbox">
 <label>{L_JUMP_TO}:</label>
 {S_JUMPBOX_SELECT}
 <input class="button2" type="submit" value="{L_GO}" />
 </fieldset>
</form>

<!-- BEGIN viewtopic_bottom -->
<form method="get" action="{S_FORM_MOD_ACTION}">
 <fieldset class="quickmod">
 <input type="hidden" name="t" value="{TOPIC_ID}" />

 <!-- <input type="hidden" name="sid" value="{S_SID}" /> -->
 <input type="hidden" name="{SECURE_ID_NAME}" value="{SECURE_ID_VALUE}" />
 <label>{L_MOD_TOOLS}:</label>
 {S_SELECT_MOD}
 <input class="button2" type="submit" value="{L_GO}" />
 </fieldset>
</form>

<p class="right">{S_TOPIC_ADMIN}</p>
<!-- END viewtopic_bottom -->

<!-- BEGIN show_permissions -->
 <div class="block">
 <div class="h3">{L_TABS_PERMISSIONS}</div>
 {S_AUTH_LIST}
 </div>
<!-- END show_permissions -->

</thread>

<!-- BEGIN switch_image_resize -->
<script type="text/javascript">
//<![CDATA[
$(resize_images({ 'selector' : '.postbody .content', 'max_width' : {switch_image_resize.IMG_RESIZE_WIDTH}, 'max_height' : {switch_image_resize.IMG_RESIZE_HEIGHT} }));
//]]>
</script>
<!-- END switch_image_resize -->

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/styles/github-gist.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/highlight.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/languages/go.min.js"></script>
<script>
$(document).ready(function() {
 $('pre, code').each(function(i, block) {
 hljs.highlightBlock(block);
 });
});
</script>

css

Code:

/* - - - - - - 
------ AFFICHAGE SUJET CLAIR #001 - JEI
--- Merci de me créditer ! Je ne demande
--- que la mention de mon pseudo en guise de remerciement :b
- - - - - - */

/* - - - HAUT DE PAGE [TITRE, NAVIGATION & LISTE DES PARTICIPANTS] - - - */
thread.header {
    display: block;
    text-align: center;
}

a.topic_title {
    font-size: 24pt;
    color: #395162 !important;
}

thread a.nav {
    display: inline-block;
}

thread.header_nav {
    display: block;
    text-align: center;
    font-size: 0;
}

thread.header_nav a {
    font-size: 9pt;
    text-transform: uppercase;
    margin: 0 8px;
    font-weight: 500;
}

thread.posters_list {
    display: block;
    text-align: center;
}

.poster-list {
    display: flex;
    margin: 0 auto;
}

/* - - */
/* - - - BOUTONS | HAUT ET BAS DE PAGE - - - */
thread.buttons {
    float: none;
    margin-bottom: 30px;
    display: block;
}

thread.buttons a {
    background-color: #747474;
    color: white;
    margin: 0 10px;
    padding: 12px 18px;
    border-radius: 4px;
    transition: background-color .25s ease-in-out;
}

thread.buttons a:hover {
    background-color: #3793ff;
}
/* - - */
/* - - - AFFICHAGE D'UN MESSAGE | BLOCKS GÉNÉRAUX - - - */

div.post {
    box-shadow: none;
    border: none;
    background-color: white;
    margin: 20px 0;
    display: flex;
}

.postbody {
    display: inline-block;
    margin-right: 0 !important;
    width: 85%;
    vertical-align: top;
    background-color: white;
    box-sizing: border-box;
    border: none;
    position: relative;
    padding-bottom: 36px;
}

.postbody .content {
    margin-top: 20px;
}
/* - - */
/* - - - AFFICHAGE D'UN MESSAGE | BLOCKS DE GAUCHE (AVATARS) - - - */
.post_profile {
    display: flex;
    width: 200px;
    background-color: #cdcdcd;
    text-align: center;
}

.poster_avatar {
    display: block;
    vertical-align: top;
    position: sticky;
    height: 320px;
    top: 20px;
}

.poster_buttons {
    margin-bottom: 65px;
}

.poster_button_fields {
    background-color: #3793ff;
    display: inline-block;
    margin-right: 5px;
    text-transform: uppercase;
    color: white;
    border-radius: 2px;
    padding: 2px 6px;
    margin-top: 10px;
    opacity: .75;
}

.poster_button_rpg {
    background-color: #3793ff;
    display: inline-block;
    margin-left: 5px;
    text-transform: uppercase;
    color: white;
    border-radius: 2px;
    padding: 2px 6px;
    margin-top: 10px;
    opacity: .75;
}

.poster_button_fields:hover, .poster_button_rpg:hover {
    opacity: 1;
    cursor: pointer;
}

.poster_rpg {
    display: none;
    position: absolute;
    left: 0;
    top: 50px;
    font-size: 0;
    right: 0;
    max-height: 225px;
    overflow-y: scroll;
}

.poster_rpg:empty::before {
    content: "La fiche de ce joueur n'a pas été générée.";
    font-size: 8pt;
    width: 50%;
    display: block;
    margin: 0 auto;
    opacity: .5;
}

.poster_rpg::-webkit-scrollbar {
  width: 0px;
}

.poster_rpg .gen[id^="rpg-"] {
    font-size: 8pt;
    background-color: #00000088;
    padding: 6px 12px;
    margin: 5px 0 5px 5%;
    display: block;
    width: 90%;
    border-radius: 4px;
    border: 1px solid #ffffff20;
    text-align: left;
}

.poster_rpg span.gen:not([id^="rpg-"]) {
    display: block;
    font-size: 10pt;
}

.poster_avatar > a img {
    width: 200px;
    height: 320px;
}

.poster_fields {
    margin-top: 15px;
    margin-bottom: 15px;
}

.p_field {
    text-align: justify;
    padding: 0 5%;
}

.p_field * {
    display: inline-block;
}

.poster_avatarfields {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    box-sizing: border-box;
    background-color: #222222DF;
    color: white;
    opacity: 0;
    transition: opacity .25s ease-in-out;
}

.poster_avatar:hover .poster_avatarfields {
    opacity: 1;
}

.p_afield {
    margin-top: 10px;
}

.p_afield .p_afield_label {
    display: none;
}

.p_afield_content::before {
    content: attr(data-label);
    display: block;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 9pt;
}

.poster_contact {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 8px;
}

.poster_contact a {
    margin: 0 2px;
    opacity: .65;
    transition: opacity .25s ease-in-out;
    overflow: hidden;
    height: 24px;
    width: 24px;
    border-radius: 2px;
    display: inline-block;
}

.poster_contact a:hover {
    opacity: 1;
}

/* personnalisation du champ "Messages" */
.p_afield[data-label="Messages"] {
    display: block;
    position: absolute;
    left: 15%;
    top: 30px;
}

.p_afield[data-label="Messages"] .p_afield_label {
    display: none;
}

.p_afield[data-label="Messages"] .p_afield_content {
    font-size: 11pt;
}

.p_afield[data-label="Messages"] .p_afield_content::before {
    content: "\F028C";
    font-family: 'Material Design Icons';
    margin-right: 5px;
    font-size: 12pt;
}
/* - */
/* personnalisation du champ "Points" - à changer pour modifier le label 'Points' (si changé dans le panel admin) et l'icône 
- - pour voir les autres icônes du Material Design Icons, rdv ici: https://materialdesignicons.com/ */
.p_afield[data-label="Points"] {
    display: block;
    position: absolute;
    right: 15%;
    top: 30px;
}

.p_afield[data-label="Points"] .p_afield_label {
    display: none;
}

.p_afield[data-label="Points"] .p_afield_content {
    font-size: 11pt;
}

.p_afield[data-label="Points"] .p_afield_content::before {
    content: "\F0116";
    font-family: 'Material Design Icons';
    margin-right: 5px;
    font-size: 12pt;
}
/* - */
/* - - - AFFICHAGE D'UN MESSAGE | NOM D'UTILISATEUR, RANG - - - */
.poster_nar {
    display: inline-block;
}
.poster_name {
    font-size: 14pt;
    display: inline-block;
}

.poster_ranks {
    display: inline-block;
    margin: 0 10px 0 5px;
    text-transform: uppercase;
    transform: translateY(-1px);
    font-weight: 500;
    color: #777;
}

/* - - */
/* - - - AFFICHAGE D'UN MESSAGE | BOUTONS [CITER, ÉDITER, ETC.] & BOUTONS LIKE/DISLIKE - - - */
.post_icons {
    display: inline-block;
    float: right;
}

.profile-icons a, .profile-icons span {
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
    color: black !important;
    opacity: .65;
    transition: opacity .25s ease-in-out;
    font-size: 12pt;
}

.profile-icons a:hover, .profile-icons span:hover {
    opacity: 1;
}

.fa_like_div {
    float: right;
    padding-right: 0;
    padding-bottom: 0;
}
/* - - */
/* - - - BOUTONS DE BAS DE PAGE [WATCH, NOUVEAU SUJET, ETC.] - - - */
.topic-actions-buttons {
    margin: 0 !important;
}

.thread_watch {
    padding: 0 10px 25px 0;
    text-align: right;
}

.thread_watch a {
    background-color: lightgrey;
    padding: 4px 8px;
    border-radius: 4px;
    opacity: .75;
    transition: all .25s ease-in-out;
}

.thread_watch a:hover {
    opacity: 1;
    color: black;
}
/* - - */
/* - - - RÉPONSE RAPIDE - - - */
a[name="quickreply"] + .h3 {
    text-align: center;
    border: none;
    margin-bottom: 0;
    padding-bottom: 0;
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 2pt;
}
/* - - */

Merci de me créditer (Jei) quelque part sur le forum: footer, sujet dédié, PA ou autre; c'est un travail qui a pris plusieurs ~~heures~~ jours de mon temps libre.

modernbb

Dimanche 31 Juillet 2022