AccueilAccueil  CalendrierCalendrier  FAQFAQ  RechercherRechercher  MembresMembres  GroupesGroupes  S'enregistrerS'enregistrer  ConnexionConnexion  

Partagez | 
 

 [pris en charge par Jamy #1] Catégorie sous AwesomeBB

Aller en bas 
[pris en charge par Jamy #1] Catégorie sous AwesomeBB - Sam 1 Déc - 17:58
Bonjour bonjour c'est encore moi XD

Pseudo

Le type du code : Catégories
Le schéma: obligatoire. [spoiler][/code]
Acceptez-vous que le code soit mis en LS sur AK ? gogogogo LS
Les éléments : Textes/url/couleur/images/police ... N'hésitez pas à écrire vos dimensions et tout ce qui m'aidera à intégrer. Alors les caté sont pour une largeur de ... hum 45% -sur la dimension du fofo test j'ai mis en pourcent-

Je suis pas sure de la typo ceci dit, sur mon toshop c'est du Vanadine mais sur page web je crains que ce soit illisible.

J'aimerias bien que quand la taille de l'écrna se rétrécit, les fofos se mettent les uns en dessous des autres histoire de respecter une harmonie visuelle Very Happy voila Very Happy
Un lien vers votre forum/site/Autre: Ce sera pour ici http://chroniqueambrosia.forumactif.org/ mais d'abord je cale là pour continuer le design http://ambrosiatest.forumactif.com/
Autre chose? Je suis déjà sur le discord avec vous, j'ai tenté de coder mais je maitrise pas le responsive donc ça va pas XD je vous remercie Very Happy

fiche réalisée par laxy

Anonymous
Aernia
Invité
Re: [pris en charge par Jamy #1] Catégorie sous AwesomeBB - Mar 4 Déc - 21:29
C'est noté ! Je m'en occupe après l'affichage d'un message, je te fais ça au plus vite ! I love you
Voir le profil de l'utilisateur
Jamy
Jamy
Codeuse
Re: [pris en charge par Jamy #1] Catégorie sous AwesomeBB - Mer 26 Déc - 20:39
Code CSS :
Code:
/* Catégorie -- Jamy -- Avada Kedagraph */
.forum-header{background:none; text-align:center;  box-shadow:none; padding:0;}
.category-title{float:none; margin: 0 auto; padding: 10px; width: 80%; border-bottom: 2px solid var(--colorone);    box-sizing: border-box;}
.category-title h2{color: var(--colorone); font-size:24px !important;text-transform: uppercase;}

.forum-section{width:95%; border-radius:0; margin: 1%; padding:0; background-size: cover !important;}

.forum-content{width:100%;margin:0;text-align:center;margin-top: 15px;    height: 222px;}
.forum-content h3{ padding: 8px 0 !important; background: var(--fondbody);font-size:20px !important;text-transform: uppercase; font-weight: 400 !important;}
.forum-content h3 a{color: var(--colorone);}
.forum-content:after{display: none;}
.forum-statistics{float:none; padding: 0; width:80%; margin: 0 auto; text-transform: uppercase;background: var(--fondclair); font-size: 11px;line-height: 15px; margin-top:-5px}

.wrapStatSousfo{padding:5px; display: flex; justify-content: space-between; margin-top: 38px;}
.subforum{width:40%;}
.subforum a{background: var(--fondclair); font-size: 12px; display: block !important; width:100%; padding:1px 2px; margin: 2px !important;text-transform: uppercase;color: var(--colorone);}


.forum-lastpost{width:45%;line-height: 12px; font-size: 11px; text-transform: uppercase;color: var(--colorone);background: var(--fondbody);position:relative;}
.forum-lastpost-inner{margin: 0;width: 65%; display:inline-block !important; vertical-align: bottom !important; float:none; padding: 5px;}
.avatar-default{float:none !important; margin:0 !important; display:inline-block !important; padding: 5px;}

.avatar-default img{width: 50px; height:50px;}

.forum-lastpost .topic-title, .forum-lastpost-time a{font-size: 11px; text-transform: uppercase;color: var(--colorone);font-weight: 400 !important;}
.forum-lastpost-author{display: inline;}
.forum-description{display: none;}

.triangle{
  margin-top:13px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 25px 190px;
  border-color: transparent transparent var(--dark) transparent;
}

.iconNewOld{ position: absolute; left: 55%;
    bottom: 0px;}
.New_Old_Lock{width:40px;}
@media (min-width: 960px){
  .forum-section{width:48%;display: inline-block;    vertical-align: top;}

}

/* FIN Catégorie -- Jamy -- Avada Kedagraph */

Et le template :
Code:
<ul class="action-bar action-bar-top">
    <!-- BEGIN switch_user_logged_in -->
    <li>
        <a href="{U_SEARCH_NEW}">
            <i class="material-icons">new_releases</i> {L_SEARCH_NEW}
        </a>
    </li>
    <li>
        <a href="{U_SEARCH_SELF}">
            <i class="material-icons">account_box</i> {L_SEARCH_SELF}
        </a>
    </li>
    <!-- END switch_user_logged_in -->
    <li>
        <a href="{U_SEARCH_UNANSWERED}">
            <i class="material-icons">chat_bubble_outline</i> {L_SEARCH_UNANSWERED}
        </a>
    </li>
    <!-- BEGIN switch_user_logged_in -->
    <li class="rightside">
        <a href="{U_MARK_READ}" accesskey="m">
            <i class="material-icons">done_all</i> {L_MARK_FORUMS_READ}
        </a>
    </li>
    <!-- END switch_user_logged_in -->
</ul>

<!-- BEGIN catrow -->
<!-- BEGIN tablehead -->
<div class="forum {catrow.tablehead.TYPE_TABLE_SECTION}">
    <div class="forum-header">
        <div class="category-title">{catrow.tablehead.L_FORUM}</div>
    </div>
    <!-- END tablehead -->

    <!-- BEGIN forumrow -->
    <div class="forum-section {catrow.forumrow.FOLDER_CLASSNAME} {catrow.forumrow.TYPE_SECTION}">

        <div class="forum-content">
          <h3><a href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></h3>
          <div class="forum-statistics">{catrow.forumrow.TOPICS} <span>correspondances</span> ✉️ {catrow.forumrow.POSTS} <span>missives</span></div>
                
          <div class="wrapStatSousfo">
           <div class="subforum">
                  {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
                </div>
          
          
              <div class="forum-lastpost">
                  <div class="forum-lastpost-inner">
                      <!-- 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 -->
                      <span>
                        <span class="forum-lastpost-time"><a href="{catrow.forumrow.U_LATEST_TOPIC_POST}">{catrow.forumrow.LAST_POST_HOUR}</a></span>
                        BY <span class="forum-lastpost-author">{catrow.forumrow.USER_LAST_POST}</span>
                      </span>
                  </div>
                
                  <div class="avatar-default">
                      <!-- BEGIN avatar -->
                      {catrow.forumrow.avatar.LAST_POST_AVATAR}
                      <!-- END avatar -->
                  </div>
                  <div class="triangle"></div>
                
                 <div class="iconNewOld">
                  <img class="New_Old_Lock" title="{catrow.forumrow.L_FORUM_FOLDER_ALT}"
                    src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
                </div>
              </div>
          </div>
          
            <div class="forum-description">
               <p>{catrow.forumrow.FORUM_DESC}</p>
             </div>
          
        </div>
    </div>
    <!-- END forumrow -->

    <!-- BEGIN tablefoot -->
</div><!-- <div class="forum" /> -->
<!-- END tablefoot -->
<!-- END catrow -->

<script type="text/javascript">
 $('.subforum').each(function() {
      var string = $(this).html();
      $(this).html(string.replace(/,/g , ' '));
  });
  
   $('.forum-description p img').each(function(){
       var img = $(this).attr("src");
       var value = "background: url('" + img + "')";
       $(this).parent().parent().parent().parent().attr("style", value);

       console.log(img);
    });
  
 
</script>

<!-- BEGIN switch_on_index -->
<ul class="action-bar action-bar-bottom">
    <li>
        <a href="{U_TODAY_ACTIVE}">{L_TODAY_ACTIVE}</a>
    </li>
    <li>
        <a href="{U_TODAY_POSTERS}">{L_TODAY_POSTERS}</a>
    </li>
    <li class="last">
        <a href="{U_OVERALL_POSTERS}">{L_OVERALL_POSTERS}</a>
    </li>
    <!-- BEGIN switch_delete_cookies -->
    <li class="rightside">
        <a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}" rel="nofollow">
            <i class="material-icons">delete</i>&nbsp;{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}
        </a>
    </li>
    <!-- END switch_delete_cookies -->
</ul>
<!-- END switch_on_index -->

<script type="text/javascript">
    //<![CDATA[
    $(document).ready(function() {
        var btn_collapse = $('<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('.forum').toggleClass('forum-hidden');

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

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

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

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

        $('.forum').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>


ouuups, j'avais pas noté que j'étais pas sur le bon compte hahaha Arrow
c'est Jamy. I love you
Voir le profil de l'utilisateur http://avada-kedagraph.forumactif.com
Re: [pris en charge par Jamy #1] Catégorie sous AwesomeBB - Sam 5 Jan - 19:51
Et voici le CSS version responsive ! Very Happy

Code:
/* Catégorie -- Jamy -- Avada Kedagraph */
.forum-header{background:none; text-align:center;  box-shadow:none; padding:0;}
.category-title{float:none; margin: 0 auto; padding: 10px; width: 80%; border-bottom: 2px solid var(--colorone);    box-sizing: border-box;}
.category-title h2{color: var(--colorone); font-size:15px !important;text-transform: uppercase;}

.forum-section{width:100%; border-radius:0; margin: 0 0 10px 0; padding:0; background-size: cover !important;}

.forum-content{width:100%;margin:0;text-align:center;padding-top: 15px;}
.forum-content h3{ padding: 8px 0 !important; background: var(--fondbody);font-size:15px !important;text-transform: uppercase; font-weight: 400 !important;}
.forum-content h3 a{color: var(--colorone);}
.forum-content:after{display: none;}
.forum-statistics{display: none;}

.wrapStatSousfo{padding:5px; display: flex; justify-content: space-between; margin-top: 15px;}
.subforum{width:40%;}
.subforum a{background: var(--fondclair); font-size: 12px; display: block !important; width:100%; padding:1px 2px; margin: 2px !important;text-transform: uppercase;color: var(--colorone);    height: 25px;
    overflow: auto;}


.forum-lastpost{width:50%;line-height: 12px; margin: 0; font-size: 11px; text-transform: uppercase;color: var(--colorone);background: var(--fondbody);position:relative;padding:0px;border:0;}
.forum-lastpost-inner{margin: 0 auto;width: 100%; display:inline-block !important; vertical-align: bottom !important; float:none; padding: 8px;}
.avatar-default{float:none !important; margin:0 !important; display:inline-block !important; padding: 5px;}

.avatar-default img{width: 50px; height:50px;}

.forum-lastpost-time {display:block !important; float:none;}

.forum-lastpost .topic-title, .forum-lastpost-time a{font-size: 11px; text-transform: uppercase;color: var(--colorone);font-weight: 400 !important;}
.forum-lastpost-author{display: inline; float:none;}
.forum-description{display: none;}

.triangle{ margin-top:-21px; width: 0; height: 0; border-style: solid; border-width: 0 0 25px 190px; border-color: transparent transparent var(--dark) transparent;}

.iconNewOld{ position: absolute; left: 55%; bottom: 0px;}
.New_Old_Lock{width:40px;}


@media (min-width: 960px){
  .category-title h2{color: var(--colorone); font-size:24px !important;text-transform: uppercase;}
  .forum-section{width:48%;display: inline-block; vertical-align: top; margin: 1%;}
  .forum-content{ height: 222px;}
  .forum-content h3{    margin-top: 0px; font-size:20px !important;}
  .forum-statistics{float:none; padding: 0; width:80%; margin: 0 auto; text-transform: uppercase;background: var(--fondclair); font-size: 11px;line-height: 15px; margin-top:-5px}
  .wrapStatSousfo{margin-top: 38px;}
  .forum-lastpost{width:45%;}
  .forum-lastpost-inner{margin: 0;width: 62%; padding: 5px; float:left;}
  .forum-lastpost{    padding: 0 !important;}
  .avatar-default{float:right;}
  .triangle{ margin-top:23px; }

}

/* FIN Catégorie -- Jamy -- Avada Kedagraph */


Tu me dis quand c'est tout bon pour archivage ? I love you
Voir le profil de l'utilisateur
Jamy
Jamy
Codeuse
Re: [pris en charge par Jamy #1] Catégorie sous AwesomeBB -
 
[pris en charge par Jamy #1] Catégorie sous AwesomeBB
Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» Catégorie Junior MX1.......LA catégorie !
» Attaque et catégorie
» [Suggestion] Catégorie Suggestion !
» LES ARAIGNEES
» [5ème édition] Catégorie Meilleur Méchant

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Avada Kedagraph :: Les commandes :: Commande de codes :: Commandes terminées-
Sauter vers: