[phpBB 3.0.x] Afficher les sous-forums en liste déroulante

Des tutos, des astuces et des BBCodes pour phpBB.
Pour toute demande de support, merci d'utiliser le forum de... support.
Répondre
Avatar du membre
cabot
Administrateur du site
Messages : 179
Enregistré le : 03 nov. 2011, 11:29
Contact :

[phpBB 3.0.x] Afficher les sous-forums en liste déroulante

Message par cabot » 30 janv. 2014, 15:30

Permet d'afficher les sous-forums dans une liste déroulante verticale affichée au survol.
  • Ouvrir styles/prosilver/forumlist_body.html

    Supprimer :

    Code : Tout sélectionner

    					<!-- IF forumrow.SUBFORUMS and forumrow.S_LIST_SUBFORUMS --><br /><strong>{forumrow.L_SUBFORUM_STR}</strong> {forumrow.SUBFORUMS}<!-- ENDIF -->
    
    Trouver :

    Code : Tout sélectionner

    		</li>
    	<!-- ENDIF -->
    
    	<!-- IF forumrow.S_LAST_ROW -->
    			</ul>
    Ajouter avant :

    Code : Tout sélectionner

    			<!-- IF forumrow.SUBFORUMS and forumrow.S_LIST_SUBFORUMS -->
    			<ul class="sushisubforums">
    				<li class="sushilabel">{forumrow.L_SUBFORUM_STR}<span>&raquo;</span>
    					<ul>
    					<!-- BEGIN subforum -->
    						<li>
    							<a class="subforum <!-- IF subforum.S_UNREAD -->unread<!-- ELSE -->read<!-- ENDIF -->" href="{subforum.U_SUBFORUM}">{subforum.SUBFORUM_NAME}</a>
    						</li>
    					<!-- END subforum -->
    					</ul>
    				</li>
    			</ul>
    			<div class="clear"></div>
    			<!-- ENDIF -->   			
    
  • Ouvrir : styles/prosilver/theme/common.css

    Ajouter à la fin :

    Code : Tout sélectionner

    /* Listes Sous-forums
    -------------------------------------------------- */
    .sushisubforums {
    	float: left;
    	position: relative;
    	margin: -0.8em 0 0 45px;
    	list-style: none;
    }
    
    .sushisubforums  li {
    	font-size: 12px;
    }
    
    .sushilabel {
    	cursor: pointer;
    }
    
    .sushilabel:hover span {
    	margin-left: -8px;
    }
    
    .sushisubforums ul {
    	position: absolute;
    	z-index: 99;
    	left: -999em;
    	padding-left: 85px;
    	list-style: none;
    	opacity: 0;
    	transition: opacity 0.7s;
    }
    
    .sushisubforums li:hover ul {
    	left: 4px;
    	bottom: -3px;
    	opacity: 1;
    }
    
    .sushisubforums ul li {
    	min-width: 120px;
    	border-top: 1px solid transparent;
    }
    
    .sushisubforums ul li:first-child {
    	border: 0;
    }
    
    .sushisubforums ul li a {
    	background: white url("{T_IMAGESET_PATH}/subforum_read.gif") no-repeat 3px 50%;
    	text-align: center;
    	padding: 2px 0 2px 14px;
    	border: 1px solid #39C;
    	text-decoration: none;
    	display: block;
    	border-radius: 3px;
    }
    
    .sushisubforums ul li a.unread {
    	background-image: url("{T_IMAGESET_PATH}/subforum_unread.gif");
    }
    
    .sushisubforums ul li:last-child a {
    	box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
    }		
    
    .sushisubforums ul li a:hover {
    	color: #fff;
    	background-color: #39C;
    }
    
    .sushisubforums + .clear {
    	margin-bottom: 4px;
    }
    
  • Aperçu :

    Affichage par défaut :
    Image

    Affichage au survol :
    Image

Répondre