AccueilRechercherS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.

Le Deal du moment :
Amazon Music Unlimited – 3 mois gratuits
Voir le deal

    Problème avec mon code catégorie sur AwesomeBB

    NaLu
    NaLu
    FémininAge : 26Messages : 164

    Jeu 30 Sep 2021 - 12:32

    Bonjour !

    Alors voilà, je me remet au code après des mois de silence.
    Je dois aimée une amie sur son forum et donc je suis en charge de la partie intégration.
    Le problème : J'ai bien réussi à faire les catégories, tout va bien, puis quand je rajoute des catégories / forums sous celui-ci, je me retrouve avec un décalage sous la première catégorie...

    Je me suis dis que c'était peut être à cause des flottants que j'ai mis du coup j'ai mis des clear: both, mais maintenant je ne suis pas vraiment sure de tout cela.

    C'est pour cela que je viens vers vous, pour espérer trouver de l'aide et peut-être une petite opti de ce que j'ai fais ? (ce n'est pas nécessaire, évidemment Very Happy)

    Vila le lien du forum test : https://palace-of-sangeki.forumactif.com/

    Je vous met en dessous les différents codes :)

    PARTIE CSS

    Code:
    .forum-content, .posts-content {
        margin-bottom: 10px;
    }

    /*---------------- CATEGORIE -------------------*/

    .forum-content>*{
      flex:1;
    }

    .clear{
      clear:both;
    }

    .forum-lastpost, .avatar-default{
      max-width: 33.3333%;
      min-width: 10%;
      margin-left: -31px;
    }

    .forum-header, .posts-header{
      /*background-image:url(https://zupimages.net/up/20/17/zym2.png);*/
      border-radius: 0;
      margin-bottom: 10px;
      background-color:black;
      height: 80px;
    }

    .forum-section, .posts-section{
      border-radius: 0;
      margin-top: 0;
      border-bottom: 5px solid #880000;
      background-color: #e9ebed;
      height: 282px;
      position:relative;
      margin-bottom: 35px;
    }

    .forum-lastpost-inner, .posts-lastpost-inner{
      margin-left: 0px;
    }

    .forum-lastpost .topic-title, .posts-lastpost .topic-title{
      color: white;
      font-weight: 200;
      font-size: 12px;
    }

    .forum-lastpost{
      width: 520px;
    }

    /*--- Avatar categ ---*/

    .avatar-default img{
      border-radius: 0;
      height: 155px;
      width: 180px;
    }

    /*--- Partie Stat ---*/

    .forum-statistics-topics, .forum-statistics-posts{
      background-color:black;
      padding: 10px;
    }

    .forum-statistics-topics #testtext1, .forum-statistics-posts #testtext1{
      font-size: 21px;
      color: white;
    }

    .forum-statistics-topics #testtext2, .forum-statistics-posts #testtext2{
      font-size: 12px;
      text-transform: uppercase;
      color: white;
    }

    /*--------------- PARTIE DESCRIPTION ----------------------*/

    .forum-description h3{
        background-color: black;
        padding: 18px!important;
        width: 66.5%;
        position: absolute;
        top: -17px;
        left: 376px;
    }

    .forum-description h3 a{
      color: #ffffff;
    }

    .forum-description p{
      background-color: #fff;
      font-size: 13px;
      width: 503px;
      height: 122px;
      position: absolute;
      text-align: justify;
      padding: 12px 12px 12px 12px;
      line-height: 20px;
      color: #797979;
      display: block;
      top: 57px;
      left: 392px;
      clear: both;
    }

    /*--- Sous-forum ---*/

    .sous-forums a{
      white-space: nowrap;
      text-overflow: ellipsis;
      margin: 3px!important;
      background-color: #880000;
      color: white;
      font-size: 12px;
      padding: 2px 12px 2px 12px;
    }

    PARTIE TEMPLATE

    Code:
    <style>
        .select:after {
            right: -23px;
        }
    </style>

    <div class="select">
        <select style="background-color: #c5c5c5; border: 2px solid #800000; margin-left: 35px; margin-top: -5px;"
                location=this.options[this.selectedIndex].value;>
            <option selected disabled>Options</option>
            <option value="{U_SEARCH_NEW}">{L_SEARCH_NEW}</option>
            <option value="{U_SEARCH_SELF}">{L_SEARCH_SELF}</option>
            <option value="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</option>
            <option value="{U_TODAY_ACTIVE}">{L_TODAY_ACTIVE}</option>
            <option value="{U_TODAY_POSTERS}">{L_TODAY_POSTERS}</option>
            <option value="{U_OVERALL_POSTERS}">{L_OVERALL_POSTERS}</option>
            <option value="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}">
                {switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}
            </option>
        </select>
    </div>

    <!-- BEGIN catrow -->
    <!-- BEGIN tablehead -->
    <div class="forum {catrow.tablehead.TYPE_TABLE_SECTION}">
        <div class="forum-header">
            <div class="category-title"
                style="margin-left: 0; padding-right: 0; width: auto; font-size: 25px!important; letter-spacing: 5px; font-weight: 400; text-transform: uppercase;">
                <span>{catrow.tablehead.L_FORUM}</span>
            </div>
        </div>
        <!-- END tablehead -->

        <!-- BEGIN forumrow -->
        <div class="forum-section">
            <div class="forum-news {catrow.forumrow.FOLDER_CLASSNAME} {catrow.forumrow.TYPE_SECTION}">
            </div>
            <div class="forum-content" style="display: flex; flex-direction: column;">
                <div class="forum-description">
                    <h3><a href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></h3>
                    <p>{catrow.forumrow.FORUM_DESC}</p>
                </div>
                <div id="postmessagelast">
                    <div id="lastpost" style="display: flex; flex-direction: row; width: 64%; margin-left: 407px; margin-top: 41px;">
                        <div class="forum-lastpost" style="background-color: #000; padding: 10px; color: white; vertical-align:middle; line-height: 50px; font-size: 12px; text-align: center; margin-right: 31px;margin-top: 155px; height: 63px; max-width: 77.7%; min-width: 77.7%;">
                            <div class="forum-lastpost-inner" style="display: flex; flex-direction: row;">
                                <!-- BEGIN switch_topic_title -->
                                <a class="topic-title" href="{catrow.forumrow.U_LATEST_TOPIC}"
                                  title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a>
                                <!-- END switch_topic_title -->
                                <!-- BEGIN ads -->
                                <a class="topic-title" href="{catrow.forumrow.ads.LINK}"
                                  title="{catrow.forumrow.ads.TITLE}">{catrow.forumrow.ads.TITLE}</a>
                                <!-- END ads -->
                                <span style="display: flex; flex-direction: row;">
                                    <!-- BEGIN ads -->
                                    <span class="forum-lastpost-location">
                                        <i class="material-icons">place</i>{catrow.forumrow.ads.LOCATION}
                                    </span>
                                    <!-- END ads -->
       
                                    <!-- BEGIN ads -->
                                        {catrow.forumrow.ads.ALIAS}
                                    <!-- END ads -->
                                    <span class="forum-lastpost-time" style="width: 370px;">
                                        <a style="color:white;" href="{catrow.forumrow.U_LATEST_TOPIC_POST}">{catrow.forumrow.LAST_POST_HOUR}  <i class="material-icons">send</i></a>
                                            <!-- BEGIN ads -->
                                            {catrow.forumrow.ads.DATE}
                                            <!-- END ads -->
                                    </span>
                                    <span class="forum-lastpost-author" style="text-align: left;">
                                        {catrow.forumrow.USER_LAST_POST}
                                    </span>
                                </span>
                            </div>
                        </div>
                        <div class="clear"></div>
                        <div class="dernierpost">
                                <div class="avatar-default" style="min-width:87px; max-width:87px; min-height: 155px;">
                                        <!-- BEGIN avatar -->
                                        {catrow.forumrow.avatar.LAST_POST_AVATAR}
                                        <!-- END avatar -->
                                        <!-- BEGIN ads -->
                                        <img src="{catrow.forumrow.ads.IMG}" alt="{catrow.forumrow.ads.TITLE}"/>
                                        <!-- END ads -->
                                </div>
                                <div class="forum-statistics" style="display: flex; flex-direction: row; width: 189px; padding: 8; margin-left: -35px;">
                                  <span class="forum-statistics-topics"><span id="testtext1">{catrow.forumrow.TOPICS}</span> <span id="testtext2">{L_TOPICS}</span></span>
                                        <span class="forum-statistics-posts"><span id="testtext1">{catrow.forumrow.POSTS}</span> <span id="testtext2">{L_POSTS}</span></span>
                                </div>
                        </div>
                    </div>
                    <div class="clear"></div>
                    <div class="sous-forums" style="background-color: #880000; height: 28px; margin-left: -65px; width: 107.5%; vertical-align: middle; line-height: 25px;">
                        {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
                    </div>
                </div>
            </div>
            <div class="clear"></div>
            <!-- END forumrow -->

            <!-- BEGIN tablefoot -->
        </div><!-- <div class="forum" ></div> -->
        <!-- END tablefoot -->
        <!-- END catrow -->
    </div>
    <script type="text/javascript">
        //<![CDATA[
        $(document).ready(function () {
            var btn_collapse = $('<div></div>', {
                class: 'forum-hide',
                html: '<div class="forum-hide-icon-a"></div><div class="forum-hide-icon-b"></div>',
            });

            var collapsed = [];

            if (readCookie('collapsed') != null && readCookie('collapsed') != '') {
                collapsed = readCookie('collapsed').split(',');
            }

            $(document).on('click', '.forum-hide', function () {
                $(this).toggleClass('forum-show');
                $(this).parents('.php').toggleClass('forum-hidden');

                if (readCookie('collapsed') != null && readCookie('collapsed') != '') {
                    collapsed = readCookie('collapsed').split(',');
                }

                if (!$(this).parents('.php').hasClass('forum-hidden')) {
                    removeFromArray('' + $(this).parents('.php').data('cindex'), collapsed);

                    createCookie('collapsed', collapsed);
                } else {
                    collapsed.push('' + $(this).parents('.php').data('cindex'));

                    createCookie('collapsed', collapsed);
                }
            });

            $('.php').each(function (i) {
                $(this).data('cindex', '' + i);

                $(btn_collapse)
                    .clone()
                    .attr('id', 'forum' + i)
                    .appendTo($(this).find('.forum-header'));

                if ($.inArray('' + i, collapsed) > -1) {
                    $(this).find('.forum-hide').toggleClass('forum-show');
                    $(this).toggleClass('forum-hidden');
                }

                if ($(this).find('.type-classified').length) {
                    $(this)
                        .addClass('type-table-classified')
                        .find('.forum-statistics-header-posts, .forum-statistics-posts').remove();
                }
            });
        });

        function removeFromArray(item, array) {
            var i = array.indexOf(item);

            if (i > -1) {
                array = array.splice(i, 1);
            }
        }

        function createCookie(name, value, days) {
            var expires;

            if (days) {
                var date = new Date();
                date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
                expires = "; expires=" + date.toGMTString();
            } else {
                expires = "";
            }
            document.cookie = encodeURIComponent(name) + "=" + encodeURIComponent(value) + expires + "; path=/";
        }

        function readCookie(name) {
            var nameEQ = encodeURIComponent(name) + "=";
            var ca = document.cookie.split(';');
            for (var i = 0; i < ca.length; i++) {
                var c = ca[i];
                while (c.charAt(0) === ' ') c = c.substring(1, c.length);
                if (c.indexOf(nameEQ) === 0) return decodeURIComponent(c.substring(nameEQ.length, c.length));
            }
            return null;
        }

        //]]>
    </script>

    Merci beaucoup pour celui ou celle qui m'apportera son aide çxç



    Problème avec mon code catégorie sur AwesomeBB 683430Sanstitre7
    NaLu
    NaLu
    FémininAge : 26Messages : 164

    Dim 3 Oct 2021 - 23:05

    Poti up !



    Problème avec mon code catégorie sur AwesomeBB 683430Sanstitre7
    NaLu
    NaLu
    FémininAge : 26Messages : 164

    Mer 6 Oct 2021 - 14:33

    Petit up !



    Problème avec mon code catégorie sur AwesomeBB 683430Sanstitre7
    NaLu
    NaLu
    FémininAge : 26Messages : 164

    Ven 15 Oct 2021 - 10:40

    Bonjour Very Happy

    Le problème a été réglé !

    Le sujet peut-être archivé !

    Merci beaucoup !



    Problème avec mon code catégorie sur AwesomeBB 683430Sanstitre7
    Contenu sponsorisé


      La date/heure actuelle est Ven 22 Oct 2021 - 22:23