Accueil
Créer un forumpositionnement barre de navigation + fusion avec les notifications
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1 • Partagez
positionnement barre de navigation + fusion avec les notifications
par AryaLestrange Sam 8 Aoû 2020 - 14:08
Détails techniques
Version du forum : ModernBB
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : 07/08/2020
Lien du forum : https://avada-kedavrarpg.forumactif.com
Description du problème
Bien le bonjour à vous
Je reviens aujourd'hui vers vous car je souhaiterai fusionner ma barre de navigation avec celle relative à la notification.
Vous trouverez actuellement sur mon forum la barre de navigation au bon endroit, avec celle des notifications (j'ai un peu triché) sauf qu'après avoir fait une manipulation, elle n'y est plus :/ je souhaitais initialement retiré les boutons connexion/déconexions qu'il y avait à droite car je les avais en double, sauf que ça c'est enlevé :
voici mon code CSS actuel :
- Code:
/*navigation et notifications*/
.navbar {
text-align: left;
background-color: #201C19!important;
font-family: 'Libre Baskerville', serif!important;
color: #9a9c9b!important;
margin-top: -50px;
position: fixed;
z-index: 99999 !important;
}
.navbar a{color: #9a9c9b!important; font-size: 13px!important; font-family: 'Libre Baskerville', serif!important;font-weight:bold!important;}
#fa_right #fa_notifications {
color: #9a9c9b!important;
font-size: 14px!important;
font-family: 'Libre Baskerville', serif!important;
margin-right: 50px;}
#fa_left,#fa_search,#fa_share, #fa_welcome, #fa_hide, #fa-show{display:none!important;}
#fa_right {
display: none!important;}
#fa_toolbar a:hover {
text-decoration: none;
}
.navbar a:hover{ background-color:transparent!important; color:#9a9c9b!important; }
S'il vous faut autre chose n'hésitez pas, par ailleurs, je ne comprends pas pourquoi la barre de navigation ne reste pas lorsque je vais par exemple dans les profil, liste des membres, mps ou encore la liste des sujets et les profils&messages
D'avance merci pour votre aide, j'espère que ma demande est claire
bonne journée à vous
AryaLestrange- *
- Messages : 40
Inscrit(e) le : 14/06/2020 -
Re: positionnement barre de navigation + fusion avec les notifications
par Invité Sam 8 Aoû 2020 - 20:43
Hello AryaLestrange,
dans un premier temps,
tu peux donner le contenu de ton template overall_header:
Affichage/Templates/Général/ overall_header
Ainsi que ta feuille de style dans sa totalité svp.
a++
dans un premier temps,
tu peux donner le contenu de ton template overall_header:
Affichage/Templates/Général/ overall_header
Ainsi que ta feuille de style dans sa totalité svp.
a++
Invité- Invité
Re: positionnement barre de navigation + fusion avec les notifications
par AryaLestrange Sam 8 Aoû 2020 - 21:48
Coucou
Pas de soucis, voici le CSS et le template :
template :
CSS complet :
PS : mon template est modifié, comme certains vu qu'on code intégralement le forum, donc je m'excuse si c'est pas très propre surtout dans le css enfin pas ranger pour l'instant
D'avance merci à vous
Pas de soucis, voici le CSS et le template :
template :
- Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}"
xml:lang="{L_LANG_HTML}" {NAMESPACE_FB_LIKE} {NAMESPACE_FB} {NAMESPACE_BBCODE}>
<link href="https://fonts.googleapis.com/css2?family=Baskervville:ital@1&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Libre+Baskerville&display=swap" rel="stylesheet">
<head>
<title>{SITENAME_TITLE}{PAGE_TITLE}</title>
<meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}"/>
<meta http-equiv="content-script-type" content="text/javascript"/>
<meta http-equiv="content-style-type" content="text/css"/>
<!-- BEGIN switch_compat_meta -->
<meta http-equiv="X-UA-Compatible" content="IE={switch_compat_meta.VERSION}"/>
<!-- END switch_compat_meta -->
<!-- BEGIN switch_canonical_url -->
<link rel="canonical" href="{switch_canonical_url.CANONICAL_URL}"/>
<!-- END switch_canonical_url -->
{META_FAVICO}
{META}
{META_FB_LIKE}
<meta name="title" content="{SITENAME_TITLE}{PAGE_TITLE}"/>
{T_HEAD_STYLESHEET}
{CSS}
<link rel="search" type="application/opensearchdescription+xml" href="/improvedsearch.xml" title="{SITENAME}"/>
<link rel="search" type="application/opensearchdescription+xml"
href="{URL_BOARD_DIRECTORY}/search/improvedsearch.xml" title="{SEARCH_FORUMS}"/>
<script src="{JQUERY_PATH}" type="text/javascript"></script>
<!-- BEGIN switch_recent_jquery -->
<script src="{JS_DIR}jquery1.9/jquery-migrate-1.4.1.js" type="text/javascript"></script>
<script src="{JQUERY_DIR}browser/v1.0/jquery.browser.min.js" type="text/javascript"></script>
<script src="{JQUERY_DIR}support/jquery.support.js" type="text/javascript"></script>
<!-- END switch_recent_jquery -->
<script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script>
{RICH_SNIPPET_GOOGLE}
<!-- BEGIN switch_fb_login -->
<script src="https://connect.facebook.net/{switch_fb_login.FB_LOCAL}/all.js" type="text/javascript"></script>
<script src="{switch_fb_login.JS_FB_LOGIN}" type="text/javascript"></script>
<!-- END switch_fb_login -->
<!-- BEGIN switch_ticker -->
<link type="text/css" rel="stylesheet" href="{JQUERY_DIR}ticker/ticker.css"/>
<script src="{JQUERY_DIR}ticker/ticker.js" type="text/javascript"></script>
<!-- END switch_ticker -->
<!-- BEGIN switch_ticker_new -->
<script src="{JQUERY_DIR}jcarousel/jquery.jcarousel.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
/* Definir le sens de direction en fonction du panneau admin */
var tickerDirParam = "{switch_ticker.DIRECTION}";
var slid_vert = false;
var auto_dir = 'next';
var h_perso = parseInt({switch_ticker.HEIGHT});
switch (tickerDirParam) {
case 'top' :
slid_vert = true;
break;
case 'left':
break;
case 'bottom':
slid_vert = true;
auto_dir = 'prev';
break;
case 'right':
auto_dir = 'prev';
break;
default:
slid_vert = true;
}
$(document).ready(function () {
$('#fa_ticker_content').css('display', 'block');
var width_max = $('ul#fa_ticker_content').width();
var width_item = Math.floor(width_max / {switch_ticker.SIZE});
if (width_max > 0) {
$('ul#fa_ticker_content li').css('float', 'left').css('list-style', 'none').width(width_item).find('img').each(function () {
if ($(this).width() > width_item) {
var ratio = $(this).width() / width_item;
var new_height = Math.round($(this).height() / ratio);
$(this).height(new_height).width(width_item);
}
});
if (slid_vert) {
var height_max = h_perso;
$('ul#fa_ticker_content li').each(function () {
if ($(this).height() > height_max) {
height_max = $(this).height();
}
});
$('ul#fa_ticker_content').width(width_item).height(height_max).css('marginLeft', 'auto').css('marginRight', 'auto');
$('ul#fa_ticker_content li').height(height_max);
}
$('#fa_ticker_content').jcarousel({
vertical: slid_vert,
wrap: 'circular',
auto: {switch_ticker.STOP_TIME},
auto_direction: auto_dir,
scroll: 1,
size: {switch_ticker.SIZE},
height_max: height_max,
animation: {switch_ticker.SPEED}
});
} else {
$('ul#fa_ticker_content li:not(:first)').css('display', 'none');
$('ul#fa_ticker_content li:first').css('list-style', 'none').css('text-align', 'center');
}
});
//]]>
</script>
<!-- END switch_ticker_new -->
<script type="text/javascript">//<![CDATA[
$(document).ready(function () {
<!-- BEGIN switch_enable_pm_popup -->
pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');
if (pm != null) {
pm.focus();
}
<!-- END switch_enable_pm_popup -->
<!-- BEGIN switch_report_popup -->
report = window.open('{switch_report_popup.U_REPORT_POPUP}', '_phpbbreport', 'HEIGHT={switch_report_popup.S_HEIGHT},resizable=yes,scrollbars=no,WIDTH={switch_report_popup.S_WIDTH}');
if (report != null) {
report.focus();
}
<!-- END switch_report_popup -->
<!-- BEGIN switch_ticker -->
$(document).ready(function () {
Ticker.start({
height: {switch_ticker.HEIGHT},
spacing: {switch_ticker.SPACING},
speed: {switch_ticker.SPEED},
direction: '{switch_ticker.DIRECTION}',
pause: {switch_ticker.STOP_TIME}
});
});
<!-- END switch_ticker -->
});
<!-- BEGIN switch_login_popup -->
var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH},
logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = true, logInBackgroundClass = false;
$(document).ready(function () {
$(window).resize(function () {
var windowWidth = document.documentElement.clientWidth;
var popupWidth = $("#login_popup").width();
var mypopup = $("#login_popup");
$("#login_popup").css({
"left": windowWidth / 2 - popupWidth / 2
});
});
});
<!-- END switch_login_popup -->
//]]>
</script>
{GREETING_POPUP}
<style type="text/css">
#page-footer, div.navbar, div.navbar ul.linklist {
display: block !important;
}
ul.linklist li.rightside, ul.linklist li.rightside a.copyright {
display: inline !important;
}
<!-- BEGIN switch_ticker_new -->
.jcarousel-skin-tango .jcarousel-item {
text-align: center;
width: 10px;
}
.jcarousel-skin-tango .jcarousel-item-horizontal {
margin-right: {switch_ticker.SPACING}px;
}
.jcarousel-skin-tango .jcarousel-item-vertical {
margin-bottom: {switch_ticker.SPACING}px;
}
<!-- END switch_ticker_new -->
</style>
{HOSTING_JS}
<!-- BEGIN google_analytics_code -->
<script type="text/javascript">
//<![CDATA[
(function (i, s, o, g, r, a, m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)}, i[r].l = 1 * new Date();
a = s.createElement(o),
m = s.getElementsByTagName(o)[0];
a.async = 1;
a.src = g;
m.parentNode.insertBefore(a, m)
})
(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
ga('create', '{G_ANALYTICS_ID}', 'auto');
ga('send', 'pageview');
ga('set', 'anonymizeIp', true);
<!-- BEGIN google_analytics_code_bis -->
ga('create', '{G_ANALYTICS_ID_BIS}', 'auto', 'bis');
ga('bis.send', 'pageview');
ga('bis.set', 'anonymizeIp', true);
<!-- END google_analytics_code_bis -->
//]]>
</script>
<!-- END google_analytics_code -->
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,500,700,700i&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese&display=swap"
rel="stylesheet"/>
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet"/>
</head>
<body id="modernbb">
<!-- BEGIN hitskin_preview -->
<div id="hitskin_preview" style="display: block;">
<h1><img src="{hitskin_preview.PATH_IMG_FA}hitskin/hitskin_logo.png" alt=""/> <em>Hit</em>skin.com</h1>
<div class="content">
<p>
{hitskin_preview.L_THEME_SITE_PREVIEW}
<br/>
<span>{hitskin_preview.U_INSTALL_THEME}<a
href="https://{hitskin_preview.U_RETURN_THEME}">{hitskin_preview.L_RETURN_THEME}</a></span>
</p>
</div>
</div>
<!-- END hitskin_preview -->
<!-- BEGIN switch_login_popup -->
<div id="login_popup" style="z-index: 10000 !important;">
<div class="h3">{SITENAME}</div>
<div id="login_popup_message">
{LOGIN_POPUP_MSG}
</div>
<div id="login_popup_buttons">
<form action="{S_LOGIN_ACTION}" method="get">
<input type="submit" class="button1" value="{L_LOGIN}"/>
<input type="button" class="button1" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';"/>
<input id="login_popup_close" type="button" class="button2" value="{L_DONT_DISPLAY_AGAIN}"/>
</form>
</div>
</div>
<!-- END switch_login_popup -->
<a id="top" name="top" accesskey="t"></a>
{JAVASCRIPT}
<style>@keyframes cf3FadeInOut {
0% {
opacity:1;
}
45% {
opacity:1;
}
55% {
opacity:0;
}
100% {
opacity:0;
}
}</style>
<ul class="navbar navlinks{NAVBAR_BORDERLESS}">
<li>{GENERATED_NAV_BAR}</li>
</ul>
<div id="page-header">
<a href="{U_INDEX}" id="logo"><img loading="lazy" src="{LOGO}" alt="{L_INDEX}"/></a>
<!-- BEGIN switch_ticker_new -->
<div id="fa_ticker_blockD" style="margin-top:4px;">
<div class="module">
<div class="inner">
<div id="fa_ticker_container">
<ul id="fa_ticker_content" class="jcarousel-skin-tango" style="display:none">
<!-- BEGIN ticker_row -->
<li>{switch_ticker.ticker_row.ELEMENT}</li>
<!-- END ticker_row -->
</ul>
</div>
</div>
</div>
</div>
<!-- END switch_ticker_new -->
</div>
<div class="conteneur_minwidth_IE">
<div class="conteneur_layout_IE">
<div class="conteneur_container_IE">
<iframe frameborder="0" src="https://avada-kedavrarpg.forumactif.com/h1-index" style="position:absolute; top: auto; left: 0;overflow: hidden; width: 170px; height: 390px;"></iframe> <div id="wrap">
<div id="page-body">
<!-- BEGIN switch_ticker -->
<div id="fa_ticker_block" style="margin-top:4px;">
<div class="module">
<div class="inner">
<div id="fa_ticker_container">
<div id="fa_ticker" style="height:{switch_ticker.HEIGHT}px;">
<div class="fa_ticker_content">
<!-- BEGIN ticker_row -->
<div>{switch_ticker.ticker_row.ELEMENT}</div>
<!-- END ticker_row -->
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END switch_ticker -->
<div id="{ID_CONTENT_CONTAINER}"{CLASS_CONTENT_CONTAINER}>
<div id="outer-wrapper">
<div id="wrapper">
<div id="{ID_LEFT}">
<!-- BEGIN giefmod_index1 -->
{giefmod_index1.MODVAR}
<!-- BEGIN saut -->
<div style="height:{SPACE_ROW}px"></div>
<!-- END saut -->
<!-- END giefmod_index1 -->
</div>
<div id="container">
<div id="content-main">
<div id="main">
<div id="main-content">
CSS complet :
- Code:
.ficheadministrative{background-image:url(https://www.zupimages.net/up/20/26/fohu.png);
background-repeat:repeat;background-position: center;width:500px;}
.ficheadministrativetitre{background-color:#34170e;margin: auto; width: 400px; height:100px; font-size: 40px; text-align: center;font-family: 'Morva';color:#9a9c9b; padding:20px;}
.ficheadministrativebloc{background-color:#1c1716; margin: auto; max-width:400px!important;border: 3px solid #34170e; font-family: Arial; text-align: justify; overflow:hidden;padding: 25px!important;font-size: 11px;line-height: 11px;color:#9a9c9b;}
.ficheadministrativecredit{font-weight:bold; font-family: 'Baskervville', italic!important;font-size:11px;color:#9a9c9b;margin-left: 350px;margin-top:-20px;}
.ficheadministrativesoustitre{font-size: 16px;font-family: 'Baskervville', italic!important;border-bottom: 3px solid #786655;color:#9a9c9b;font-weight:bold;}
.ficheadministrativetitre2{font-family: 'Baskervville', italic!important;font-size: 35px;text-align:center;}
.blocpartenaire{background-color: #1C1716;width:500px; height:500px;}
.hautpartenaire{margin-top:-25px!important; width:100%;margin:auto;height:250px;background-size:cover;background-image:url(https://www.zupimages.net/up/20/24/ozq5.png);
background-repeat:no-repeat;background-position: center;}
.lienspartenaires{border: 3px solid #34170e;background-color:#302C29;width:460px;margin:auto;text-align:center;font-family: 'Baskervville', italic!important;font-weight:bold;}
.contextepartenaire{background-color:#302C29;border: 3px solid #34170e; width: 200px; height: 100px;font-family: Arial;color:#9a9c9b; margin-left:20px;font-size: 11px;}
.staffpartenaire{background-color:#302C29;border: 3px solid #34170e; width: 250px; height: 150px;margin-left:230px; margin-top:-120px;}
.staffpartenaire1{width:120px; height:120px;position: absolute;background-color:#1c1716;border: 1px solid #34170e;margin-left:100px; margin-top:-100px;}
.pseudostaff1{font-family: 'Morva';font-size:12px;color:#786655;margin-top:10px!important;text-align: center;}
.rangstaff1{font-family: 'Baskervville', italic;color:#6e6e6d; line-height: 1px; font-size:12px;font-weight: bold;margin-top:-5px;}
.rangstaff1 a{color:#786655!important;}
.staffpartenaire1 img{margin-left:10px;}
.prestitre{font-family: 'Baskervville', italic!important;font-size: 25px;text-align:center;}
.blocpres{background-color:#1c1716; overflow-y:auto; max-width:290px!important;height:100px;border: 3px solid #34170e; font-family: Arial; text-align: justify; overflow:hidden;padding: 10px!important;font-size: 11px;line-height: 11px;color:#9a9c9b;}
.avapres{margin-top:-100px; margin-left:300px;width:100px; height:100px;background-size: cover; object-fit:cover;position:relative;}
.avaperso{width: 160px; float:left;padding:10px;margin-top:-10px;}
.ip{color: #786655!important;font-weight:bold; font-family: 'Baskervville', italic!important;font-size:12px;}
/*-------------------------------GESTION ONGLET FICHE----------------------------------------------*/
.AB2C label {background-color:#1c1716; width:130px!important; height:20px;border: 1px solid #34170e; font-family: Arial; overflow:hidden; padding:2px; font-size: 11px;line-height: 11px;color:#9a9c9b; text-align: center;
display:inline-block; float:left; clear:left; margin-right:-10px; margin-bottom:2px; overflow:hidden; padding-top:3px;
text-align:center; line-height:normal;text-transform:uppercase; }
.AB2C label:hover {opacity:1; filter:grayscale(0); -webkit-filter:grayscale(0);}
.contentAB2C { background-color:#1c1716; margin-left:15px; border: 3px solid #34170e; font-family: Arial; text-align: justify; overflow:hidden;padding: 10px!important;font-size: 11px;line-height: 11px;color:#9a9c9b;
display:none; width:265px; height:280px; padding:12px; overflow-y:auto; }
.contentAB2C span { font-size: 12px;border:2px #34170e solid; text-align:justify; border:none;}
.AB2C { margin-left:50px;width:460px;text-align:left; font-family:Arial; line-height:16px; }
.AB2C::after {content:''; display:table; clear:both;}
.AB2C input[type=radio] {display:none;}
.AB2C [id^="OAB2C"]:checked + label { opacity:1; }
#OAB2C1:checked ~ #contentAB2C1,
#OAB2C2:checked ~ #contentAB2C2,
#OAB2C3:checked ~ #contentAB2C3,
#OAB2C4:checked ~ #contentAB2C4,
#OAB2C5:checked ~ #contentAB2C5,
#OAB2C6:checked ~ #contentAB2C6,
#OAB2C7:checked ~ #contentAB2C7,
#OAB2C8:checked ~ #contentAB2C8,
#OAB2C9:checked ~ #contentAB2C9,
#OAB2C10:checked ~ #contentAB2C10,
#OAB2C11:checked ~ #contentAB2C11{ display:inline-block;}
/*-------------------------------GESTION ONGLET FICHE PRESENTATION ----------------------------------------------*/
.AB3C label { background-color:#1c1716; width:121px!important;border: 3px solid #34170e; font-family: Arial; overflow:hidden; padding:2px; font-size: 11px;line-height: 11px;color:#9a9c9b; text-align: center;
display:inline-block; float:bottom; clear:bottom; margin-bottom:2px; height:25px;
width:100px; overflow: auto; padding-top:3px; text-align:center; text-transform:uppercase;
line-height:normal;opacity:0.5; }
.AB3C label:hover {opacity:1; filter:grayscale(0); -webkit-filter:grayscale(0);}
.contentAB3C {background-color:#1c1716; margin: auto; max-width:400px!important; border: 3px solid #34170e; font-family: Arial; text-align: justify; overflow:hidden;padding: 10px!important;font-size: 11px;line-height: 11px;color:#9a9c9b;
display:none; width:415px; height:250px; padding:10px; overflow-y:auto; margin:auto;}
.contentAB3C span { font-size: 12px;border:2px #34170e solid; text-align:justify; border:none;}
.AB3C {margin-left: 50px; width:460px; text-align:left; font-family:Arial; line-height:16px; }
.AB3C::after {content:''; display:table; clear:both;}
.AB3C input[type=radio] {display:none;}
.AB3C [id^="OAB3C"]:checked + label { opacity:1;}
#OAB3C1:checked ~ #contentAB3C1,
#OAB3C2:checked ~ #contentAB3C2,
#OAB3C3:checked ~ #contentAB3C3{display:inline-block;}
/*navigation et notifications*/
.navbar {
text-align: left;
background-color: #201C19!important;
font-family: 'Libre Baskerville', serif!important;
color: #9a9c9b!important;
margin-top: -50px;
position: fixed;
z-index: 99999 !important;
}
.navbar a{color: #9a9c9b!important; font-size: 13px!important; font-family: 'Libre Baskerville', serif!important;font-weight:bold!important;}
#fa_right #fa_notifications {
color: #9a9c9b!important;
font-size: 14px!important;
font-family: 'Libre Baskerville', serif!important;
margin-right: 50px;}
#fa_left,#fa_search,#fa_share, #fa_welcome, #fa_hide, #fa-show{display:none!important;}
#fa_right {
display: none!important;}
#fa_toolbar a:hover {
text-decoration: none;
}
.navbar a:hover{ background-color:transparent!important; color:#9a9c9b!important; }
/*** PA ***/
.es{box-sizing:border-box;}
.staffar{display:inline-block;overflow:hidden;width: 83px; height: 133px;margin-left:-150px; margin-top:-133px;}
.staffar div{background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;background-color:#1c1716;border: 1px solid #34170e;box-sizing:border-box;height:133px;padding-top:15px;position:relative;top:0;transition:.5s;width:83px}
.staffar:hover div{top:-133px;transition:.5s}
.staffho{display:inline-block;overflow:hidden;width: 83px; height: 133px;margin-left:20px; margin-top:-133px;}
.staffho div{background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;background-color:#1c1716;border: 1px solid #34170e;box-sizing:border-box;height:133px;padding-top:15px;position:relative;top:0;transition:.5s;width:83px}
.staffho:hover div{top:-133px;transition:.5s}
.blocPA{background-image:url(https://www.zupimages.net/up/20/26/fohu.png);
background-repeat:no-repeat;background-position: center;width:684px;height:350px;text-align:center;}
.blocbienvenue{margin:auto; background-color:#1c1716;border: 1px solid #34170e;width: 650px;font-family: 'Baskervville', italic!important;color: #6e6e6d;font-size: 14px;line-height: 11px; margin-top: -10px; padding: 5px;font-weight: bold;}
.bloccontexte{background-color:#1c1716;border: 1px solid #34170e;width: 200px;font-family: Arial;color: #6e6e6d;font-size: 11px;margin-left: 20px;text-align: justify;height:133px;overflow: auto;padding: 5px;}
.titre_police{font-family: 'Libre Baskerville', serif;font-size:11px;color:#786655;}
.staff{width:110px; height:133px;position: absolute;margin-left:320px; margin-top:-133px;background-color:#1c1716;border: 1px solid #34170e;}
.staffimg{width: 100px!important;height: 100px!important;}
.pseudostaff{font-family: 'Morva';font-size:13px;color:#786655;margin-top: 35px;}
.rangstaff{font-family: 'Baskervville', italic;color:#6e6e6d; line-height: 1px; font-size:12px;font-weight: bold;margin-top:-5px;}
.rangstaff a{color:#786655!important;}
select {margin-top:-133px;margin-left:425px;
background-color: #1c1716;
cursor: pointer;
vertical-align: middle;
border: 1px solid #34170e!important;
font-family: Arial;
color: #6e6e6d;
font-size: 10px!important; width: 225px!important;
}
.partenaires{background-color: #1c1716;border: 1px solid #34170e;width: 110px;color:#5a2814;margin-left:443px;margin-top:-100px;font-size:11px;}
.nousliers{background-color: #1c1716;border: 1px solid #34170e;width: 100px;color:#5a2814;margin-left:557px;margin-top:-18px;font-size:11px;width: 110px;}
.news{background-color: #1c1716;border: 1px solid #34170e;width:224px; margin-left:444px;margin-top:10px;height:73px;overflow:auto;text-align: justify;padding: 5px;font-size:11px;color: #6e6e6d;}
.wanted{width: 200px!important; height: 50px!important;position:relative;margin-left: 20px;text-align: center;}
.pointMaison{width:220px; text-align:center;margin-left:220px; margin-top:-50px;}
.housePoint{display:inline-block; width: 50px; position:relative;}
.housePoint:nth-child(1n){margin-right:0px;}
.housePoint img{display:block; width:100%;}
.housePoint span{display:none; }
.housePoint:hover span{display:block; color:#b8cae6; text-align:center; background: #041028; padding:2px 0; font-size:9px; width: 58px; position:absolute; bottom:5px; left: 5px;z-index:5; }
.blocmaison{width:207px; position: absolute;margin-left:228px; margin-top:-80px;background-color:#1c1716;border: 1px solid #34170e;font-family: 'Baskervville', italic;font-size: 14px;color: #6e6e6d!important;text-align: center;font-weight:bold;padding: 5px;}
.topsite{width:200px!important; height:50px!important; position:absolute;margin-left:317px!important; margin-top:-140px;!important;text-align: center;}
/**** SCROLLBAR ****/
::-webkit-scrollbar {
width: 3px; /*largeur de la scrollbar verticale*/
height: 3px; /*hauteur de la scrollbar horizontale*/
background-color: transparent !important;}
::-webkit-scrollbar-track {
background-color:#5a2814 !important; /*couleur du fond de la scrollbar*/}
::-webkit-scrollbar-thumb { /*la petite bande qui monte/descend*/
background-color: #34170E; /*couleur de l'ascenseur*/;
}
::-webkit-scrollbar-button {
background-color: #;
}
/**** FIN SCROLLBAR ****/
@font-face{
font-family: 'Morva';
src: url('https://dl.dropbox.com/s/modzd9xe42z5ndb/MORVA.ttf?') ;}
/** fin PA ** /
/* CB*/
.chatbox-options li a, .chatbox-options li label {
color: #9A9C9B;}
#chatbox_header {
background-color: #1C1716;
color:#9A9C9B;}
.chatbox-title .chat-title {
color: #9A9C9B!important;}
#chatbox>p {
border-bottom: 1px solid #9A9C9B;
}
.button, .button1, .button2, input[type="submit"] {
background-color: #9A9C9B;}
a:link {
color: #9A9C9B!important;
font-family: 'Baskervville', italic;
font-size: 11px;
font-weight: bold;
}
/* header*/
#page-header {
text-align: center;
margin-top:-12px;
}
#logo img {
width: 100%;
max-width: 1500px;
}
.boutonhautbas {
bottom: 40px;
right: 10px; /* remplacez right par left pour afficher les boutons à gauche */
position: fixed;
z-index: 100;
}
/** QEEL PAR ARYA ET MODIFIE PAR HOPE**/
.Queelfonds {
width: 680px;
height: 220px;
background-color: #201C19;
background-image: url(https://www.zupimages.net/up/20/26/fohu.png);
background-size: cover;
background-position: bottom;
margin: auto;
}
.QEELcadrestats { position: relative;
top: 10px;
left: 18px;
width: 190px;
height: 125px;
background-color: #1c1716;
border: 2px solid #34170e;
padding: 5px;
font-size: 11px;
font-family: 'Arial';
color: #6e6e6d;
text-align: justify;
overflow: auto;
}
.QEELcadreh24{ margin-top:20px;
background-color: #1c1716;
border: 2px solid #34170e;
position: relative;
padding: 5px;
font-size: 11px;
font-family: 'Arial';
color: #6e6e6d;
text-align: justify;
top: -135; left: 460px;
width: 200px;
height: 160px;
overflow: auto;
}
.qeelqel{
background-color: #1c1716;
border: 2px solid #34170e;
font-size: 11px;
font-family: 'Arial';
color: #6e6e6d;overflow: hidden;position: relative;
text-align: center ;
left: 18px;
width: 643px;
display:inline-block;
}
.qeelbienvenue {background-color: #1c1716; background-position: center;
position:relative;
border: 2px solid #34170e;
font-size: 11px;
font-family: 'Arial';
color: #6e6e6d;overflow: hidden;position: relative;
text-align: center ;top: -209px; left: 210px;
width: 182px; height: 50px;
}
.qeel_ava img { object-fit:cover;position:relative;
top:-214px; left: 210px;
height: 50px;
width: 50px;
border: 1px solid #34170e;
}
.qeelanniversaire{background-color: #1c1716;
border: 2px solid #34170e;
font-size: 11px;
font-family: 'Arial';
color: #6e6e6d;overflow: hidden;position: relative;
text-align: center ;top: -159px;
left: 17px;
width: 190px;
}
.contenu_onglet{
background-color: #1c1716;
border: 2px solid #34170e;
width: 235px;
margin-top:-392px;
height:80px;
padding:5px;
font-size: 11px;
font-family: 'Arial';
color: #6e6e6d;
text-align: justify;
overflow: auto;
margin-left:-15px;
display: none;}
.onglet{
background-color: #1c1716;
border: 2px solid #34170e;
font-size: 11px;
font-family: 'Libre Baskerville', serif!important;
text-align: center;
margin: 1px;display: inline-block;
position:relative;top:-287px; left:-37px;
height:20px;}
.copyright-body {
border-color: #1D262C;
border-style: solid;
border-width: 0 0 0;
margin: 18px 0 0;
padding: 18px 0 0;
}
/** fin du QEEL***/
@font-face{
font-family: 'Morva';
src: url('https://dl.dropbox.com/s/modzd9xe42z5ndb/MORVA.ttf?') ;}
/*** catégories par Arya ***/
.lienscategories{
width:850px;
margin:auto;
padding: -5px;} /*** correspond aux liens juste avant le début des catégories ***/
.lienscategories a{
color: #9a9c9b!important;
font-family: 'Libre Baskerville', serif!important;
font-size:9px!important;} /*** correspond aux liens juste avant le début des catégories ***/
.linklist.top {
border-width: 0 0 0px;} /*** correspond aux liens juste avant le début des catégories ***/
.linklist.bottom {
border-width: 0px 0 0;} /*** correspond aux liens juste avant le début des catégories ***/
/*** début des catégories ***/
.title{
background-image:url(https://zupimages.net/up/20/26/e58u.png);
font-size: 30px;
color: #9f9795;
font-family: 'Morva'!important;
width: 683px;
height:51px;
text-align: center;}
.title h2 {
color: #9a9c9b;
font-family: 'Morva'!important;
font-size: 30px;
font-weight: 400;
margin-top: 10px;
line-height: 55px;}
.catesstitre {font-family: 'Libre Baskerville', serif!important;font-size: 12px; color: #5a2814;}
.categorie {
width:683px; height: 130px;
background-image:url(https://images2.imgbox.com/e8/27/sHdPJ4Mx_o.png);
}
.sousforum{background-color: #201C19;
border: 1px solid #34170e;width:260px!important;
height:25px!important;
text-align: left;
margin-left: -50px;
margin-bottom: 5px;}
.sousforum a{
color: #786655!important;
font-family: 'Baskervville', italic;
font-size: 14px!important;
padding: 5px;
font-weight: bold;
text-decoration: none;}
.descriptionforum{
background-color: #201C19;
border: 1px solid #34170e;
width:260px!important;
height:70px!important;
font-family: Arial;
color: #6e6e6d;
font-size: 11px;
text-align: justify;
overflow: auto;
padding: 5px;
margin-left: -50px;}
.imgcategorie{
width: 100%;
height: 100%;
margin-left:5px!important;
position:relative;}
.listeforum{background-color: #201C19;
border: 1px solid #34170e;
overflow: auto;
width:100px!important;
height:100px!important;
margin-left: 335px;
margin-top: -100px;
display: flex;
flex-flow: wrap; /* retour à la ligne de chaque balise */
align-content: center; /* le contenu est centré verticalement */
justify-content: center; /* le contenu est centré horizontalement */
font-size: 0;}
.listeforum a{
display: block!important;
color: #6e6e6d!important;
font-family: 'Libre Baskerville', serif!important;
font-size: 10px!important;
font-weight: bold!important;
text-decoration: none!important;}
.derniermessage{
background-color: #201C19;
border: 1px solid #34170e;
width: 130px;
margin-left: 520px;
text-align:center;
margin-top:-91px;
display: flex;
flex-flow: wrap; /* retour à la ligne de chaque balise */
align-content: center; /* le contenu est centré verticalement */
justify-content: center; /* le contenu est centré horizontalement */
padding: 5px;
line-height: 12px;
height:70px;
font-size: 10px;}
.nbsujetsmessages{
background-color: #201C19;
border: 1px solid #34170e;
float:right;
width: 100px;
display: inline-block;
width: 130px;
position: absolute;
top: 100px;
left: 536px;
font-family: Arial;
font-size: 10px;
font-style: normal;}
ul.topiclist dfn {
display: inline-block;
font-family: Arial;
font-size: 10px;
font-style: normal;}
.avatardernierposteur {
display: inline-block;
height: 100px;
width: 62px;
margin: 7px 0 0 100px;}
.avatardernierposteur img {
height: 100%;
width: 100%;}
.dterm1 { position: absolute;
margin-top: 15px;
margin-left: -30px;}
/*** fin des catégories ***/
/*** footer ***/
.cadre{
width: 800px;
margin:auto;
text-align: center;
padding: 2px;}
.cadre a{
color: #786655!important;
font-family: 'Libre Baskerville', serif!important;}
.copyright {
margin-top: 15px;}
.copyright a{
color: #786655!important;
font-family: 'Libre Baskerville', serif!important;}
/*** fin footer ***/
/*---------- MESSAGES ET PROFIL : NOUVEAU/RÉPONDRE ---------*/
.msg_bloc {
background-color: #201C19;
border: 3px solid #201C19;
}
.topic_action_msg .watch a {
color: #4f768b;
font: 11px Fira Sans Condensed;
float: right;
}
.topic_action_msg span a {
color: #4f768b;
font: 11px Fira Sans Condensed;
}
/*---------- TITRE ET NAV ---------*/
.title_nav {
background-image:url(https://zupimages.net/up/20/26/e58u.png);
background-repeat:no-repeat;background-position: center;
position: relative;
text-align: center!important;}
.title_nav .navigation {
font: 12px 'Baskervville';
color: #9A9C9B;
text-align: center!important;
margin-top: -5px!important;
}
.title_nav .navigation a {
font: 12px 'Baskervville';
color: #9A9C9B;
margin-top: -15px!important;
text-align: center!important;
}
.fow_title > a {
color: #9A9C9B;
font: 20px 'Morva';
text-align: center!important;
}
h1.fow_title a[href=""] {
display: none;
}
/*---------- MESSAGES ET PROFIL : CADRE NOM, RANG, BOUTONS ----------*/
.topic-actions.top{
margin-bottom: 48px;
margin-top: -50px;
}
.msg_top {
height: 70px;
padding-top: 10px;
margin-top: 60px;
}
.msg_top p, .msg_top > div {
display: inline-block;
height: 70px;
overflow: hidden;
margin-bottom: -10px;
}
.msg_name span strong {
font: 20px 'Morva';
color: #fdfefe;
}
.msg_top p:first-of-type {
margin-left: 255px;
margin-top: 5px;
margin-bottom: 0px!important;
}
.profile-icons {
margin: -6px -6px 0 65px;
}
.profile-icons li a:hover {
background: none;
box-shadow: none;
}
.profile-icons li a {
border: none;
box-shadow: none;
font: 12px Fira Sans Condensed;
color: #fdfefe;
margin: 0px -6px;
}
.msg_top .profile-icon:first-of-type {
padding-left: 110px;
padding-right: 20px;
}
hr.separate_titledate_msg {
border: .5px solid #d0d1d2;
clear: none;
margin: 0 auto;
}
.msg_top .rank {
display: block;
width: 250px;
font: 12px Fira Sans Condensed;
font-style: italic;
color: #fdfefe;
font-weight:300;
margin: 1px 0px 0px 25px;
}
/*---------- MSG ET PROFILS : AVATAR ET TEXTE ----------*/
.msg_bloc {
background: #fdfefe;
min-height: 300px;
}
/*Bloc de l'avatar et champs du profil*/
.msg_avatar {
float: left;
margin-top: -60px;
margin-left: 20px;
height: 320px;
overflow: hidden;
}
.msg_avatar > div {
width: 180px;
padding: 20px 10px;
margin-top: -310px;
margin-left: 10px;
height: 300px;
position: relative;
background-color: rgba(253, 254, 254, 0.8);
opacity: 0;
transition: 0.6s linear;
font-size: 11px;
font-family: Fira Sans Condensed;
}
.msg_avatar:hover > div {
opacity: 1;
}
.msg_avatar a img {
width: 200px;
height: 320px;
transition: all 0.5s;
}
.msg_avatar:hover a img {
filter: blur(3px);
transform: scale(1.2);
}
.msg_avatar .rpg a {
font: 22px Cookie;
color: #6c3651;
text-align: center;
display: block;
margin-bottom: -15px;
}
.msg_avatar .label {
font: 11px Fira Sans Condensed;
color: #1d1f22;
text-transform: uppercase;
font-weight: 500;
line-height: 20px;
}
.msg_avatar h3 {
border: 1px solid #1d1f22;
font: 16px Fjalla One;
color: #1d1f22;
margin: -7px auto 5px;
text-align: center;
width: 100px;
padding-top: 5px;
text-transform: uppercase;
}
.msg_avatarperso > a {
display: block;
border: 1px solid #1d1f22;
font: 16px Fjalla One;
color: #1d1f22;
text-align: center;
width: 100px;
padding-top: 5px;
padding-bottom: 4px;
text-transform: uppercase;
margin: -8px auto -10px;
}
.msg_avatar textarea {
width: 160px;
height: 50px;
background-color: rgba(253, 254, 254, 0.4);
}
/*Bloc du message*/
.msg_text {
margin-left: 255px;
padding-top: 3px;
width: 510px;
}
.msg_text a{
font-weight: bold;
}
span.topic-date {
float: right;
display: inline-block;
font: 11px Fira Sans Condensed;
font-weight:300;
color: #c1c1c1;
}
.topic-title {
display: inline-block;
text-align: left;
width: 390px;
font: 11px Fira Sans Condensed;
font-weight:300;
}
.topic-title a {
color: #c1c1c1;
font-weight: 300;
}
.msg_text > div:first-of-type{
padding-bottom: 5px;
margin-top: 2px;
width: 100%;
}
.msg_text .the_msg {
min-height: 330px;
font-size: 12px;
text-align: justify;
color: #000;
width: 100%;
margin-top: 15px;
padding-bottom: 15px;
}
/* SIGNATURE */
.signature_div {
background: #fdfefe;
max-height: 250px;
margin: auto;
overflow: auto;
padding: 0px 20px 10px;
}
.signa_separateur {
width: 800px;
border-top: 1px solid #1d1f22;
margin: auto;
}
.signature_div > div, .signature_div > center {
margin-top: -30px;
}
.signa_espace {
width: 100%;
height: 7px;
}
/*---------- RÉPONSE RAPIDE ----------*/
form#quick_reply {
margin-bottom: 40px;
}
form#quick_reply .row2 {
background: none;
}
.quickreply .h3 {
display: none;
}
form#quick_reply .sceditor-container.ltr.sourceMode {
border-radius: 0!important;
background: #F6F8F8!important;
box-shadow: none!important;
}
form#quick_reply .sceditor-toolbar {
background-color: #F4F4F4!important;
}
form#quick_reply div.sceditor-group {
background: none;
border-bottom: none;
border-radius: 3px;
}
form#quick_reply input.button2 {
margin-right: 10px;
background: #1C1716;
padding: 3px;
box-shadow: none;
border-radius: 0px;
color: #773A21;
font: 16px Fjalla One;
text-transform: uppercase;
}
/*==================================== BLOC ERREUR BY KAYL ========================= */
.error div[class^="ion-"]:first-child {
left: 18px;
position: relative!important;
top: 22px!important;
}
.error {
padding: 22px!important;
position: inherit!important;
}
/*==================================== FIN BLOC ERREUR BY KAYL ========================= */
PS : mon template est modifié, comme certains vu qu'on code intégralement le forum, donc je m'excuse si c'est pas très propre surtout dans le css enfin pas ranger pour l'instant
D'avance merci à vous
AryaLestrange- *
- Messages : 40
Inscrit(e) le : 14/06/2020 -
Re: positionnement barre de navigation + fusion avec les notifications
par Invité Dim 9 Aoû 2020 - 6:30
Hello AryaLestrange,
merci pour le template et la css.
Si tout était comme ceci, ce serait le bonheur
.
Dans la css, tu as ceci qui cache la partie droite de la Toolbar:
Hum, tu feras comment pour te connecter à ta prochaine session ?.
Pour le reste:
Il faudrait désactiver les scripts sur ton forum car la Toolbar est désactivée sur ton forum de mon côté lorsque
je vais voir les membres, donc çà sent une erreur de script ou conflit.
Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Codes Javascript
Activer la gestion des codes Javascript :Non
Ensuite, pour positionner les titres de la barre de navigation, il faut passer par ton P.A:
Car ceci ne fonctionne pas:
Affichage/Page d'accueil/En-tête & Navigation/En-tête des pages
Position de la barre de navigation : Cocher "A gauche".
Puis en modifiant la taille de police et les margin, on arrive à tout positionner :
Ta feuille de style modifiée:
a++
merci pour le template et la css.
donc je m'excuse si c'est pas très propre surtout dans le css enfin pas ranger pour l'instant
Si tout était comme ceci, ce serait le bonheur
.Vous trouverez actuellement sur mon forum la barre de navigation au bon endroit, avec celle des notifications (j'ai un peu triché) sauf qu'après avoir fait une manipulation, elle n'y est plus
Dans la css, tu as ceci qui cache la partie droite de la Toolbar:
- Code:
#fa_right {display: none!important;}
je souhaitais initialement retiré les boutons connexion/déconexions qu'il y avait à droite car je les avais en double
Hum, tu feras comment pour te connecter à ta prochaine session ?.
Pour le reste:
je ne comprends pas pourquoi la barre de navigation ne reste pas lorsque je vais par exemple dans les profil, liste des membres, mps ou encore la liste des sujets et les profils&messages
Il faudrait désactiver les scripts sur ton forum car la Toolbar est désactivée sur ton forum de mon côté lorsque
je vais voir les membres, donc çà sent une erreur de script ou conflit.
Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Codes Javascript
Activer la gestion des codes Javascript :Non
Ensuite, pour positionner les titres de la barre de navigation, il faut passer par ton P.A:
Car ceci ne fonctionne pas:
- Code:
.navbar
{
text-align: left;
}
Affichage/Page d'accueil/En-tête & Navigation/En-tête des pages
Position de la barre de navigation : Cocher "A gauche".
Puis en modifiant la taille de police et les margin, on arrive à tout positionner :
Ta feuille de style modifiée:
- Code:
/*navigation et notifications*/
.navbar {
background-color: #201C19!important;
top:0px;
left: 0px;
right: 0px;
position: fixed;
z-index: 99999 !important;
}
.navbar li,#fa_right a.rightHeaderLink{margin:0px!important;}
.navbar a{padding:2px!important;height: 30px;line-height:30px!important;color: #9a9c9b!important; font-size:11px!important; font-family: 'Libre Baskerville', serif!important;font-weight:bold!important;}
.navbar a:hover{ background-color:transparent!important; color:#9a9c9b!important; }
#fa_right
{
z-index: 111111111111111 !important;
position: absolute;
left: 90%;
font-size:11px!important;
}
#fa_right #fa_notifications ,#notif_list .content div
{
font-family: 'Libre Baskerville', serif!important;
color: #9a9c9b!important;
font-size:11px!important;
}
#notif_list .content div{font-style:italic!important;
}
.fa_tbMainElement.notification ul#notif_list{left: -290px!important;}
.ficheadministrative{background-image:url(https://www.zupimages.net/up/20/26/fohu.png);
background-repeat:repeat;background-position: center;width:500px;}
.ficheadministrativetitre{background-color:#34170e;margin: auto; width: 400px; height:100px; font-size: 40px; text-align: center;font-family: 'Morva';color:#9a9c9b; padding:20px;}
.ficheadministrativebloc{background-color:#1c1716; margin: auto; max-width:400px!important;border: 3px solid #34170e; font-family: Arial; text-align: justify; overflow:hidden;padding: 25px!important;font-size: 11px;line-height: 11px;color:#9a9c9b;}
.ficheadministrativecredit{font-weight:bold; font-family: 'Baskervville', italic!important;font-size:11px;color:#9a9c9b;margin-left: 350px;margin-top:-20px;}
.ficheadministrativesoustitre{font-size: 16px;font-family: 'Baskervville', italic!important;border-bottom: 3px solid #786655;color:#9a9c9b;font-weight:bold;}
.ficheadministrativetitre2{font-family: 'Baskervville', italic!important;font-size: 35px;text-align:center;}
.blocpartenaire{background-color: #1C1716;width:500px; height:500px;}
.hautpartenaire{margin-top:-25px!important; width:100%;margin:auto;height:250px;background-size:cover;background-image:url(https://www.zupimages.net/up/20/24/ozq5.png);
background-repeat:no-repeat;background-position: center;}
.lienspartenaires{border: 3px solid #34170e;background-color:#302C29;width:460px;margin:auto;text-align:center;font-family: 'Baskervville', italic!important;font-weight:bold;}
.contextepartenaire{background-color:#302C29;border: 3px solid #34170e; width: 200px; height: 100px;font-family: Arial;color:#9a9c9b; margin-left:20px;font-size: 11px;}
.staffpartenaire{background-color:#302C29;border: 3px solid #34170e; width: 250px; height: 150px;margin-left:230px; margin-top:-120px;}
.staffpartenaire1{width:120px; height:120px;position: absolute;background-color:#1c1716;border: 1px solid #34170e;margin-left:100px; margin-top:-100px;}
.pseudostaff1{font-family: 'Morva';font-size:12px;color:#786655;margin-top:10px!important;text-align: center;}
.rangstaff1{font-family: 'Baskervville', italic;color:#6e6e6d; line-height: 1px; font-size:12px;font-weight: bold;margin-top:-5px;}
.rangstaff1 a{color:#786655!important;}
.staffpartenaire1 img{margin-left:10px;}
.prestitre{font-family: 'Baskervville', italic!important;font-size: 25px;text-align:center;}
.blocpres{background-color:#1c1716; overflow-y:auto; max-width:290px!important;height:100px;border: 3px solid #34170e; font-family: Arial; text-align: justify; overflow:hidden;padding: 10px!important;font-size: 11px;line-height: 11px;color:#9a9c9b;}
.avapres{margin-top:-100px; margin-left:300px;width:100px; height:100px;background-size: cover; object-fit:cover;position:relative;}
.avaperso{width: 160px; float:left;padding:10px;margin-top:-10px;}
.ip{color: #786655!important;font-weight:bold; font-family: 'Baskervville', italic!important;font-size:12px;}
/*-------------------------------GESTION ONGLET FICHE----------------------------------------------*/
.AB2C label {background-color:#1c1716; width:130px!important; height:20px;border: 1px solid #34170e; font-family: Arial; overflow:hidden; padding:2px; font-size: 11px;line-height: 11px;color:#9a9c9b; text-align: center;
display:inline-block; float:left; clear:left; margin-right:-10px; margin-bottom:2px; overflow:hidden; padding-top:3px;
text-align:center; line-height:normal;text-transform:uppercase; }
.AB2C label:hover {opacity:1; filter:grayscale(0); -webkit-filter:grayscale(0);}
.contentAB2C { background-color:#1c1716; margin-left:15px; border: 3px solid #34170e; font-family: Arial; text-align: justify; overflow:hidden;padding: 10px!important;font-size: 11px;line-height: 11px;color:#9a9c9b;
display:none; width:265px; height:280px; padding:12px; overflow-y:auto; }
.contentAB2C span { font-size: 12px;border:2px #34170e solid; text-align:justify; border:none;}
.AB2C { margin-left:50px;width:460px;text-align:left; font-family:Arial; line-height:16px; }
.AB2C::after {content:''; display:table; clear:both;}
.AB2C input[type=radio] {display:none;}
.AB2C [id^="OAB2C"]:checked + label { opacity:1; }
#OAB2C1:checked ~ #contentAB2C1,
#OAB2C2:checked ~ #contentAB2C2,
#OAB2C3:checked ~ #contentAB2C3,
#OAB2C4:checked ~ #contentAB2C4,
#OAB2C5:checked ~ #contentAB2C5,
#OAB2C6:checked ~ #contentAB2C6,
#OAB2C7:checked ~ #contentAB2C7,
#OAB2C8:checked ~ #contentAB2C8,
#OAB2C9:checked ~ #contentAB2C9,
#OAB2C10:checked ~ #contentAB2C10,
#OAB2C11:checked ~ #contentAB2C11{ display:inline-block;}
/*-------------------------------GESTION ONGLET FICHE PRESENTATION ----------------------------------------------*/
.AB3C label { background-color:#1c1716; width:121px!important;border: 3px solid #34170e; font-family: Arial; overflow:hidden; padding:2px; font-size: 11px;line-height: 11px;color:#9a9c9b; text-align: center;
display:inline-block; float:bottom; clear:bottom; margin-bottom:2px; height:25px;
width:100px; overflow: auto; padding-top:3px; text-align:center; text-transform:uppercase;
line-height:normal;opacity:0.5; }
.AB3C label:hover {opacity:1; filter:grayscale(0); -webkit-filter:grayscale(0);}
.contentAB3C {background-color:#1c1716; margin: auto; max-width:400px!important; border: 3px solid #34170e; font-family: Arial; text-align: justify; overflow:hidden;padding: 10px!important;font-size: 11px;line-height: 11px;color:#9a9c9b;
display:none; width:415px; height:250px; padding:10px; overflow-y:auto; margin:auto;}
.contentAB3C span { font-size: 12px;border:2px #34170e solid; text-align:justify; border:none;}
.AB3C {margin-left: 50px; width:460px; text-align:left; font-family:Arial; line-height:16px; }
.AB3C::after {content:''; display:table; clear:both;}
.AB3C input[type=radio] {display:none;}
.AB3C [id^="OAB3C"]:checked + label { opacity:1;}
#OAB3C1:checked ~ #contentAB3C1,
#OAB3C2:checked ~ #contentAB3C2,
#OAB3C3:checked ~ #contentAB3C3{display:inline-block;}
#fa_left,#fa_search,#fa_share, #fa_welcome, #fa_hide, #fa-show{display:none!important;}
#fa_toolbar a:hover {
text-decoration: none;
}
/*** PA ***/
.es{box-sizing:border-box;}
.staffar{display:inline-block;overflow:hidden;width: 83px; height: 133px;margin-left:-150px; margin-top:-133px;}
.staffar div{background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;background-color:#1c1716;border: 1px solid #34170e;box-sizing:border-box;height:133px;padding-top:15px;position:relative;top:0;transition:.5s;width:83px}
.staffar:hover div{top:-133px;transition:.5s}
.staffho{display:inline-block;overflow:hidden;width: 83px; height: 133px;margin-left:20px; margin-top:-133px;}
.staffho div{background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;background-color:#1c1716;border: 1px solid #34170e;box-sizing:border-box;height:133px;padding-top:15px;position:relative;top:0;transition:.5s;width:83px}
.staffho:hover div{top:-133px;transition:.5s}
.blocPA{background-image:url(https://www.zupimages.net/up/20/26/fohu.png);
background-repeat:no-repeat;background-position: center;width:684px;height:350px;text-align:center;}
.blocbienvenue{margin:auto; background-color:#1c1716;border: 1px solid #34170e;width: 650px;font-family: 'Baskervville', italic!important;color: #6e6e6d;font-size: 14px;line-height: 11px; margin-top: -10px; padding: 5px;font-weight: bold;}
.bloccontexte{background-color:#1c1716;border: 1px solid #34170e;width: 200px;font-family: Arial;color: #6e6e6d;font-size: 11px;margin-left: 20px;text-align: justify;height:133px;overflow: auto;padding: 5px;}
.titre_police{font-family: 'Libre Baskerville', serif;font-size:11px;color:#786655;}
.staff{width:110px; height:133px;position: absolute;margin-left:320px; margin-top:-133px;background-color:#1c1716;border: 1px solid #34170e;}
.staffimg{width: 100px!important;height: 100px!important;}
.pseudostaff{font-family: 'Morva';font-size:13px;color:#786655;margin-top: 35px;}
.rangstaff{font-family: 'Baskervville', italic;color:#6e6e6d; line-height: 1px; font-size:12px;font-weight: bold;margin-top:-5px;}
.rangstaff a{color:#786655!important;}
select {margin-top:-133px;margin-left:425px;
background-color: #1c1716;
cursor: pointer;
vertical-align: middle;
border: 1px solid #34170e!important;
font-family: Arial;
color: #6e6e6d;
font-size: 10px!important; width: 225px!important;
}
.partenaires{background-color: #1c1716;border: 1px solid #34170e;width: 110px;color:#5a2814;margin-left:443px;margin-top:-100px;font-size:11px;}
.nousliers{background-color: #1c1716;border: 1px solid #34170e;width: 100px;color:#5a2814;margin-left:557px;margin-top:-18px;font-size:11px;width: 110px;}
.news{background-color: #1c1716;border: 1px solid #34170e;width:224px; margin-left:444px;margin-top:10px;height:73px;overflow:auto;text-align: justify;padding: 5px;font-size:11px;color: #6e6e6d;}
.wanted{width: 200px!important; height: 50px!important;position:relative;margin-left: 20px;text-align: center;}
.pointMaison{width:220px; text-align:center;margin-left:220px; margin-top:-50px;}
.housePoint{display:inline-block; width: 50px; position:relative;}
.housePoint:nth-child(1n){margin-right:0px;}
.housePoint img{display:block; width:100%;}
.housePoint span{display:none; }
.housePoint:hover span{display:block; color:#b8cae6; text-align:center; background: #041028; padding:2px 0; font-size:9px; width: 58px; position:absolute; bottom:5px; left: 5px;z-index:5; }
.blocmaison{width:207px; position: absolute;margin-left:228px; margin-top:-80px;background-color:#1c1716;border: 1px solid #34170e;font-family: 'Baskervville', italic;font-size: 14px;color: #6e6e6d!important;text-align: center;font-weight:bold;padding: 5px;}
.topsite{width:200px!important; height:50px!important; position:absolute;margin-left:317px!important; margin-top:-140px;!important;text-align: center;}
/**** SCROLLBAR ****/
::-webkit-scrollbar {
width: 3px; /*largeur de la scrollbar verticale*/
height: 3px; /*hauteur de la scrollbar horizontale*/
background-color: transparent !important;}
::-webkit-scrollbar-track {
background-color:#5a2814 !important; /*couleur du fond de la scrollbar*/}
::-webkit-scrollbar-thumb { /*la petite bande qui monte/descend*/
background-color: #34170E; /*couleur de l'ascenseur*/;
}
::-webkit-scrollbar-button {
background-color: #;
}
/**** FIN SCROLLBAR ****/
@font-face{
font-family: 'Morva';
src: url('https://dl.dropbox.com/s/modzd9xe42z5ndb/MORVA.ttf?') ;}
/** fin PA ** /
/* CB*/
.chatbox-options li a, .chatbox-options li label {
color: #9A9C9B;}
#chatbox_header {
background-color: #1C1716;
color:#9A9C9B;}
.chatbox-title .chat-title {
color: #9A9C9B!important;}
#chatbox>p {
border-bottom: 1px solid #9A9C9B;
}
.button, .button1, .button2, input[type="submit"] {
background-color: #9A9C9B;}
a:link {
color: #9A9C9B!important;
font-family: 'Baskervville', italic;
font-size: 11px;
font-weight: bold;
}
/* header*/
#page-header {
text-align: center;
margin-top:-12px;
}
#logo img {
width: 100%;
max-width: 1500px;
}
.boutonhautbas {
bottom: 40px;
right: 10px; /* remplacez right par left pour afficher les boutons à gauche */
position: fixed;
z-index: 100;
}
/** QEEL PAR ARYA ET MODIFIE PAR HOPE**/
.Queelfonds {
width: 680px;
height: 220px;
background-color: #201C19;
background-image: url(https://www.zupimages.net/up/20/26/fohu.png);
background-size: cover;
background-position: bottom;
margin: auto;
}
.QEELcadrestats { position: relative;
top: 10px;
left: 18px;
width: 190px;
height: 125px;
background-color: #1c1716;
border: 2px solid #34170e;
padding: 5px;
font-size: 11px;
font-family: 'Arial';
color: #6e6e6d;
text-align: justify;
overflow: auto;
}
.QEELcadreh24{ margin-top:20px;
background-color: #1c1716;
border: 2px solid #34170e;
position: relative;
padding: 5px;
font-size: 11px;
font-family: 'Arial';
color: #6e6e6d;
text-align: justify;
top: -135; left: 460px;
width: 200px;
height: 160px;
overflow: auto;
}
.qeelqel{
background-color: #1c1716;
border: 2px solid #34170e;
font-size: 11px;
font-family: 'Arial';
color: #6e6e6d;overflow: hidden;position: relative;
text-align: center ;
left: 18px;
width: 643px;
display:inline-block;
}
.qeelbienvenue {background-color: #1c1716; background-position: center;
position:relative;
border: 2px solid #34170e;
font-size: 11px;
font-family: 'Arial';
color: #6e6e6d;overflow: hidden;position: relative;
text-align: center ;top: -209px; left: 210px;
width: 182px; height: 50px;
}
.qeel_ava img { object-fit:cover;position:relative;
top:-214px; left: 210px;
height: 50px;
width: 50px;
border: 1px solid #34170e;
}
.qeelanniversaire{background-color: #1c1716;
border: 2px solid #34170e;
font-size: 11px;
font-family: 'Arial';
color: #6e6e6d;overflow: hidden;position: relative;
text-align: center ;top: -159px;
left: 17px;
width: 190px;
}
.contenu_onglet{
background-color: #1c1716;
border: 2px solid #34170e;
width: 235px;
margin-top:-392px;
height:80px;
padding:5px;
font-size: 11px;
font-family: 'Arial';
color: #6e6e6d;
text-align: justify;
overflow: auto;
margin-left:-15px;
display: none;}
.onglet{
background-color: #1c1716;
border: 2px solid #34170e;
font-size: 11px;
font-family: 'Libre Baskerville', serif!important;
text-align: center;
margin: 1px;display: inline-block;
position:relative;top:-287px; left:-37px;
height:20px;}
.copyright-body {
border-color: #1D262C;
border-style: solid;
border-width: 0 0 0;
margin: 18px 0 0;
padding: 18px 0 0;
}
/** fin du QEEL***/
@font-face{
font-family: 'Morva';
src: url('https://dl.dropbox.com/s/modzd9xe42z5ndb/MORVA.ttf?') ;}
/*** catégories par Arya ***/
.lienscategories{
width:850px;
margin:auto;
padding: -5px;} /*** correspond aux liens juste avant le début des catégories ***/
.lienscategories a{
color: #9a9c9b!important;
font-family: 'Libre Baskerville', serif!important;
font-size:9px!important;} /*** correspond aux liens juste avant le début des catégories ***/
.linklist.top {
border-width: 0 0 0px;} /*** correspond aux liens juste avant le début des catégories ***/
.linklist.bottom {
border-width: 0px 0 0;} /*** correspond aux liens juste avant le début des catégories ***/
/*** début des catégories ***/
.title{
background-image:url(https://zupimages.net/up/20/26/e58u.png);
font-size: 30px;
color: #9f9795;
font-family: 'Morva'!important;
width: 683px;
height:51px;
text-align: center;}
.title h2 {
color: #9a9c9b;
font-family: 'Morva'!important;
font-size: 30px;
font-weight: 400;
margin-top: 10px;
line-height: 55px;}
.catesstitre {font-family: 'Libre Baskerville', serif!important;font-size: 12px; color: #5a2814;}
.categorie {
width:683px; height: 130px;
background-image:url(https://images2.imgbox.com/e8/27/sHdPJ4Mx_o.png);
}
.sousforum{background-color: #201C19;
border: 1px solid #34170e;width:260px!important;
height:25px!important;
text-align: left;
margin-left: -50px;
margin-bottom: 5px;}
.sousforum a{
color: #786655!important;
font-family: 'Baskervville', italic;
font-size: 14px!important;
padding: 5px;
font-weight: bold;
text-decoration: none;}
.descriptionforum{
background-color: #201C19;
border: 1px solid #34170e;
width:260px!important;
height:70px!important;
font-family: Arial;
color: #6e6e6d;
font-size: 11px;
text-align: justify;
overflow: auto;
padding: 5px;
margin-left: -50px;}
.imgcategorie{
width: 100%;
height: 100%;
margin-left:5px!important;
position:relative;}
.listeforum{background-color: #201C19;
border: 1px solid #34170e;
overflow: auto;
width:100px!important;
height:100px!important;
margin-left: 335px;
margin-top: -100px;
display: flex;
flex-flow: wrap; /* retour à la ligne de chaque balise */
align-content: center; /* le contenu est centré verticalement */
justify-content: center; /* le contenu est centré horizontalement */
font-size: 0;}
.listeforum a{
display: block!important;
color: #6e6e6d!important;
font-family: 'Libre Baskerville', serif!important;
font-size: 10px!important;
font-weight: bold!important;
text-decoration: none!important;}
.derniermessage{
background-color: #201C19;
border: 1px solid #34170e;
width: 130px;
margin-left: 520px;
text-align:center;
margin-top:-91px;
display: flex;
flex-flow: wrap; /* retour à la ligne de chaque balise */
align-content: center; /* le contenu est centré verticalement */
justify-content: center; /* le contenu est centré horizontalement */
padding: 5px;
line-height: 12px;
height:70px;
font-size: 10px;}
.nbsujetsmessages{
background-color: #201C19;
border: 1px solid #34170e;
float:right;
width: 100px;
display: inline-block;
width: 130px;
position: absolute;
top: 100px;
left: 536px;
font-family: Arial;
font-size: 10px;
font-style: normal;}
ul.topiclist dfn {
display: inline-block;
font-family: Arial;
font-size: 10px;
font-style: normal;}
.avatardernierposteur {
display: inline-block;
height: 100px;
width: 62px;
margin: 7px 0 0 100px;}
.avatardernierposteur img {
height: 100%;
width: 100%;}
.dterm1 { position: absolute;
margin-top: 15px;
margin-left: -30px;}
/*** fin des catégories ***/
/*** footer ***/
.cadre{
width: 800px;
margin:auto;
text-align: center;
padding: 2px;}
.cadre a{
color: #786655!important;
font-family: 'Libre Baskerville', serif!important;}
.copyright {
margin-top: 15px;}
.copyright a{
color: #786655!important;
font-family: 'Libre Baskerville', serif!important;}
/*** fin footer ***/
/*---------- MESSAGES ET PROFIL : NOUVEAU/RÉPONDRE ---------*/
.msg_bloc {
background-color: #201C19;
border: 3px solid #201C19;
}
.topic_action_msg .watch a {
color: #4f768b;
font: 11px Fira Sans Condensed;
float: right;
}
.topic_action_msg span a {
color: #4f768b;
font: 11px Fira Sans Condensed;
}
/*---------- TITRE ET NAV ---------*/
.title_nav {
background-image:url(https://zupimages.net/up/20/26/e58u.png);
background-repeat:no-repeat;background-position: center;
position: relative;
text-align: center!important;}
.title_nav .navigation {
font: 12px 'Baskervville';
color: #9A9C9B;
text-align: center!important;
margin-top: -5px!important;
}
.title_nav .navigation a {
font: 12px 'Baskervville';
color: #9A9C9B;
margin-top: -15px!important;
text-align: center!important;
}
.fow_title > a {
color: #9A9C9B;
font: 20px 'Morva';
text-align: center!important;
}
h1.fow_title a[href=""] {
display: none;
}
/*---------- MESSAGES ET PROFIL : CADRE NOM, RANG, BOUTONS ----------*/
.topic-actions.top{
margin-bottom: 48px;
margin-top: -50px;
}
.msg_top {
height: 70px;
padding-top: 10px;
margin-top: 60px;
}
.msg_top p, .msg_top > div {
display: inline-block;
height: 70px;
overflow: hidden;
margin-bottom: -10px;
}
.msg_name span strong {
font: 20px 'Morva';
color: #fdfefe;
}
.msg_top p:first-of-type {
margin-left: 255px;
margin-top: 5px;
margin-bottom: 0px!important;
}
.profile-icons {
margin: -6px -6px 0 65px;
}
.profile-icons li a:hover {
background: none;
box-shadow: none;
}
.profile-icons li a {
border: none;
box-shadow: none;
font: 12px Fira Sans Condensed;
color: #fdfefe;
margin: 0px -6px;
}
.msg_top .profile-icon:first-of-type {
padding-left: 110px;
padding-right: 20px;
}
hr.separate_titledate_msg {
border: .5px solid #d0d1d2;
clear: none;
margin: 0 auto;
}
.msg_top .rank {
display: block;
width: 250px;
font: 12px Fira Sans Condensed;
font-style: italic;
color: #fdfefe;
font-weight:300;
margin: 1px 0px 0px 25px;
}
/*---------- MSG ET PROFILS : AVATAR ET TEXTE ----------*/
.msg_bloc {
background: #fdfefe;
min-height: 300px;
}
/*Bloc de l'avatar et champs du profil*/
.msg_avatar {
float: left;
margin-top: -60px;
margin-left: 20px;
height: 320px;
overflow: hidden;
}
.msg_avatar > div {
width: 180px;
padding: 20px 10px;
margin-top: -310px;
margin-left: 10px;
height: 300px;
position: relative;
background-color: rgba(253, 254, 254, 0.8);
opacity: 0;
transition: 0.6s linear;
font-size: 11px;
font-family: Fira Sans Condensed;
}
.msg_avatar:hover > div {
opacity: 1;
}
.msg_avatar a img {
width: 200px;
height: 320px;
transition: all 0.5s;
}
.msg_avatar:hover a img {
filter: blur(3px);
transform: scale(1.2);
}
.msg_avatar .rpg a {
font: 22px Cookie;
color: #6c3651;
text-align: center;
display: block;
margin-bottom: -15px;
}
.msg_avatar .label {
font: 11px Fira Sans Condensed;
color: #1d1f22;
text-transform: uppercase;
font-weight: 500;
line-height: 20px;
}
.msg_avatar h3 {
border: 1px solid #1d1f22;
font: 16px Fjalla One;
color: #1d1f22;
margin: -7px auto 5px;
text-align: center;
width: 100px;
padding-top: 5px;
text-transform: uppercase;
}
.msg_avatarperso > a {
display: block;
border: 1px solid #1d1f22;
font: 16px Fjalla One;
color: #1d1f22;
text-align: center;
width: 100px;
padding-top: 5px;
padding-bottom: 4px;
text-transform: uppercase;
margin: -8px auto -10px;
}
.msg_avatar textarea {
width: 160px;
height: 50px;
background-color: rgba(253, 254, 254, 0.4);
}
/*Bloc du message*/
.msg_text {
margin-left: 255px;
padding-top: 3px;
width: 510px;
}
.msg_text a{
font-weight: bold;
}
span.topic-date {
float: right;
display: inline-block;
font: 11px Fira Sans Condensed;
font-weight:300;
color: #c1c1c1;
}
.topic-title {
display: inline-block;
text-align: left;
width: 390px;
font: 11px Fira Sans Condensed;
font-weight:300;
}
.topic-title a {
color: #c1c1c1;
font-weight: 300;
}
.msg_text > div:first-of-type{
padding-bottom: 5px;
margin-top: 2px;
width: 100%;
}
.msg_text .the_msg {
min-height: 330px;
font-size: 12px;
text-align: justify;
color: #000;
width: 100%;
margin-top: 15px;
padding-bottom: 15px;
}
/* SIGNATURE */
.signature_div {
background: #fdfefe;
max-height: 250px;
margin: auto;
overflow: auto;
padding: 0px 20px 10px;
}
.signa_separateur {
width: 800px;
border-top: 1px solid #1d1f22;
margin: auto;
}
.signature_div > div, .signature_div > center {
margin-top: -30px;
}
.signa_espace {
width: 100%;
height: 7px;
}
/*---------- RÉPONSE RAPIDE ----------*/
form#quick_reply {
margin-bottom: 40px;
}
form#quick_reply .row2 {
background: none;
}
.quickreply .h3 {
display: none;
}
form#quick_reply .sceditor-container.ltr.sourceMode {
border-radius: 0!important;
background: #F6F8F8!important;
box-shadow: none!important;
}
form#quick_reply .sceditor-toolbar {
background-color: #F4F4F4!important;
}
form#quick_reply div.sceditor-group {
background: none;
border-bottom: none;
border-radius: 3px;
}
form#quick_reply input.button2 {
margin-right: 10px;
background: #1C1716;
padding: 3px;
box-shadow: none;
border-radius: 0px;
color: #773A21;
font: 16px Fjalla One;
text-transform: uppercase;
}
/*==================================== BLOC ERREUR BY KAYL ========================= */
.error div[class^="ion-"]:first-child {
left: 18px;
position: relative!important;
top: 22px!important;
}
.error {
padding: 22px!important;
position: inherit!important;
}
/*==================================== FIN BLOC ERREUR BY KAYL ========================= */
a++
Invité- Invité
Re: positionnement barre de navigation + fusion avec les notifications
par AryaLestrange Dim 9 Aoû 2020 - 8:50
Coucou
Merci encore pour ton retour
J'ai retiré la partie du code qui supprime la partie droite de la toolbar.
ça donne ceci connectée : https://nsa40.casimages.com/img/2020/08/09/200809083955450839.png
et déconnectée : https://nsa40.casimages.com/img/2020/08/09/200809083954293340.png
Tu vois donc plus facilement le "doublon" que j'évoque le fait d'avoir les boutons à droite qui sont les mêmes à gauche (donc si je les enlève, normalement j'aurais toujours ceux de la navigation)
C'est pour ça que je cherche un moyen de les enlever sans retirer la notification.
Second point que je n'ai peut-être pas évoqué, je ne parviens pas à personnaliser "la notification" (le style d'écriture surtout) et l'intérieure si tu as la solution ?
Pour l'absence de position de la navigation dans les autres pages > mais comment dois-je faire si j'ai des codes justement qui nécessite le fonctionnement du JS ? (dans le doute je n'ai rien fait)
j'ai remplacé le CSS actuel avec celui que tu viens de modifier, mais la notification a à présent disparut :/ à priori par contre tout refonctionne dans un sens pour que la navigation apparaisse sur chacune des pages, mais je constate également des différences lorsque je chance de page sur la hauteur du fonds à l'arrière, je souhaiterai qu'il soit identique et ce quelque soit l'endroit où nous sommes
(celle que je souhaite c'est d'avoir la même taille que sur l'index par exemple, si besoin de capture d'écran n'hésitez pas)
merci encore
Merci encore pour ton retour
J'ai retiré la partie du code qui supprime la partie droite de la toolbar.
ça donne ceci connectée : https://nsa40.casimages.com/img/2020/08/09/200809083955450839.png
et déconnectée : https://nsa40.casimages.com/img/2020/08/09/200809083954293340.png
Tu vois donc plus facilement le "doublon" que j'évoque le fait d'avoir les boutons à droite qui sont les mêmes à gauche (donc si je les enlève, normalement j'aurais toujours ceux de la navigation)
C'est pour ça que je cherche un moyen de les enlever sans retirer la notification.
Second point que je n'ai peut-être pas évoqué, je ne parviens pas à personnaliser "la notification" (le style d'écriture surtout) et l'intérieure
si tu as la solution ?Pour l'absence de position de la navigation dans les autres pages > mais comment dois-je faire si j'ai des codes justement qui nécessite le fonctionnement du JS ? (dans le doute je n'ai rien fait)
j'ai remplacé le CSS actuel avec celui que tu viens de modifier, mais la notification a à présent disparut :/ à priori par contre tout refonctionne dans un sens pour que la navigation apparaisse sur chacune des pages, mais je constate également des différences lorsque je chance de page sur la hauteur du fonds à l'arrière, je souhaiterai qu'il soit identique et ce quelque soit l'endroit où nous sommes
(celle que je souhaite c'est d'avoir la même taille que sur l'index par exemple, si besoin de capture d'écran n'hésitez pas)merci encore
AryaLestrange- *
- Messages : 40
Inscrit(e) le : 14/06/2020 -
Re: positionnement barre de navigation + fusion avec les notifications
par Invité Dim 9 Aoû 2020 - 9:02
Re,
pour les invités ajoutes ceci dans ta feuille de style:
Pour les Javascripts, merci de me les fournir afin que je teste sur mon fofo et me dire a quel endroit sont ils cochés.
Pour le texte "Notifications", tu as ceci dans ta feuille de style:
Il faut par contre ajouter un hack !important
.
Pour la Notification disparue, il faut jouer avec ce style:
et ensuite l'affichage des notifications ici:
a++
pour les invités ajoutes ceci dans ta feuille de style:
- Code:
a.rightHeaderLink[href$="login"],a.rightHeaderLink[href$="register"]{display:none!important;}
Pour les Javascripts, merci de me les fournir afin que je teste sur mon fofo et me dire a quel endroit sont ils cochés.
Pour le texte "Notifications", tu as ceci dans ta feuille de style:
- Code:
#fa_right #fa_notifications
Il faut par contre ajouter un hack !important
.Pour la Notification disparue, il faut jouer avec ce style:
- Code:
#fa_right
{
z-index: 111111111111111 !important;
position: absolute;
left: 90%;
font-size:11px!important;
}
et ensuite l'affichage des notifications ici:
- Code:
.fa_tbMainElement.notification ul#notif_list{left: -290px!important;}
a++
Invité- Invité
Re: positionnement barre de navigation + fusion avec les notifications
par AryaLestrange Dim 9 Aoû 2020 - 9:25
Re
Voici les JS :
affichage de la dernière personne arrivée dans le QEEL > (affichage du toutes les pages)
bouton haut et bas (sur l'index) :
Bannières aléatoires :
Par contre, même avec tout ce que tu viens de me donner, il y a rien à faire, la notification revient pas :/
revoici le CSS :
je réfléchis également de mon coter, mais je ne vois pas d'où proviendrait le problème
j'ai fait deux captures, pour que tu puisses constater la différence de taille entre l'index et les autres pages (j'aimerai que se soit comme sur l'index niveau taille du bloc) :
taille index : https://nsa40.casimages.com/img/2020/08/09/200809093526689781.png
petite taille : https://nsa40.casimages.com/img/2020/08/09/200809093526840573.png (je veux que ce soit comme la première)
mici :3
Voici les JS :
affichage de la dernière personne arrivée dans le QEEL > (affichage du toutes les pages)
- Code:
$(function(){
$.get($("#dernier_membre a[href^='/u']")[0].href,function(d){
(a=$("#avatar_membre img",$(d))).length&&$("#avatar_dernier_membre").html(a);})
});
bouton haut et bas (sur l'index) :
- Code:
$(function(){
$("body").append('<div class="boutonhautbas"><a href="#top"><img src="https://www.zupimages.net/up/20/26/ndvx.png" style="width:70px; height:100px" alt="Aller en haut" /></a> <a href="#bottom"><img src="https://www.zupimages.net/up/20/26/5l3d.png" style="width:70px; height:100px" alt="Aller en bas" /></a></div>');
});
Bannières aléatoires :
- Code:
$(document).ready(function() {
var classes = ["https://www.zupimages.net/up/20/24/ozq5.png", "https://www.zupimages.net/up/20/24/naak.png", ];
$('#logo').find('img').attr('src', classes[~~(Math.random() * classes.length)]);
});
Par contre, même avec tout ce que tu viens de me donner, il y a rien à faire, la notification revient pas :/
revoici le CSS :
- Code:
.navbar {
background-color: #201C19!important;
top:0px;
left: 0px;
right: 0px;
position: fixed;
z-index: 99999 !important;
}
.navbar li,#fa_right a.rightHeaderLink{margin:0px!important;}
.navbar a{padding:2px!important;height: 30px;line-height:30px!important;color: #9a9c9b!important; font-size:11px!important; font-family: 'Libre Baskerville', serif!important;font-weight:bold!important;}
.navbar a:hover{ background-color:transparent!important; color:#9a9c9b!important; }
#fa_right #fa_notifications, #notif_list .content div
{font-family: 'Libre Baskerville', serif!important;
color: #9a9c9b!important;}
.fa_tbMainElement.notification ul#notif_list{left: -290px!important;}
#fa_right
{
z-index: 111111111111111 !important;
position: absolute;
left: 90%;
font-size:11px!important;
}
a.rightHeaderLink[href$="login"],a.rightHeaderLink[href$="register"]{display:none!important;}
je réfléchis également de mon coter, mais je ne vois pas d'où proviendrait le problèmej'ai fait deux captures, pour que tu puisses constater la différence de taille entre l'index et les autres pages (j'aimerai que se soit comme sur l'index niveau taille du bloc) :
taille index : https://nsa40.casimages.com/img/2020/08/09/200809093526689781.png
petite taille : https://nsa40.casimages.com/img/2020/08/09/200809093526840573.png (je veux que ce soit comme la première)
mici :3
AryaLestrange- *
- Messages : 40
Inscrit(e) le : 14/06/2020 -
Re: positionnement barre de navigation + fusion avec les notifications
par Invité Dim 9 Aoû 2020 - 19:08
Re,
les scripts ne font pas en cause si ils sont bien positionnés.
Le qeel doit être positionné sur l'index et les autres sur toutes les pages .
Il faut peut être modifier ainsi le header:
a++
les scripts ne font pas en cause si ils sont bien positionnés.
Le qeel doit être positionné sur l'index et les autres sur toutes les pages
.j'ai fait deux captures, pour que tu puisses constater la différence de taille entre l'index et les autres pages (j'aimerai que se soit comme sur l'index niveau taille du bloc) :
Il faut peut être modifier ainsi le header:
- Code:
#page-header {
text-align: center;
margin-top:-12px;
}
- Code:
#page-header{
text-align: center;
top: -30px;
position: relative;
}
a++
Invité- Invité
Re: positionnement barre de navigation + fusion avec les notifications
par AryaLestrange Dim 9 Aoû 2020 - 19:31
Hello
Merci grâce à toi j'ai débloqué un autre soucis
Je t'embête bientôt plus, mais la notification est toujours je ne sais où :/
Merci grâce à toi j'ai débloqué un autre soucis
Je t'embête bientôt plus, mais la notification est toujours je ne sais où :/
AryaLestrange- *
- Messages : 40
Inscrit(e) le : 14/06/2020 -
Re: positionnement barre de navigation + fusion avec les notifications
par Invité Dim 9 Aoû 2020 - 19:41
Re,
Je viens de m'enregistrer sur ton fofo .
a++
Ben vi mais sans compte je ne rien voir!!!Je t'embête bientôt plus, mais la notification est toujours je ne sais où :/
Je viens de m'enregistrer sur ton fofo
.a++
Invité- Invité
Re: positionnement barre de navigation + fusion avec les notifications
par Invité Dim 9 Aoû 2020 - 20:15
Re,
à ce style:
Ajoutes un width:90%;
Edit:
d'ailleurs, il faut aussi regarder le z-index qui est faussé sur cet ID:
remplaces le par:
à ce style:
- Code:
.navbar {
background-color: #201C19!important;
top:0px;
left: 0px;
right: 0px;
position: fixed;
z-index: 99999 !important;
}
Ajoutes un width:90%;
- Code:
.navbar {
background-color: #201C19!important;
top:0px;
left: 0px;
right: 0px;
position: fixed;
z-index:99999!important;
width:90%;
}
Edit:
d'ailleurs, il faut aussi regarder le z-index qui est faussé sur cet ID:
- Code:
#fa_right
remplaces le par:
- Code:
z-index:1111111111111!important;
Invité- Invité
Re: positionnement barre de navigation + fusion avec les notifications
par AryaLestrange Dim 9 Aoû 2020 - 20:27
Merci j'avais zappé ce détail *sort*
Un dernier point et je pourrai mettre le sujet en résolu
pour bidouiller la forme et le contenu quand on appuie sur la notif, c'est bien ici :
.fa_tbMainElement.notification ul#notif_list ?
ici : #fa_right #fa_notifications, #notif_list .content div j'ai vu que c'était pour l'apparence externe ? J'ai presque fini d'obtenir ce que je veux, mais je voulais savoir, je peux rajouter quoi comme "truc" pour que ce soit sur la même ligne que la navigation ? (à l'oeil ça se voit pas trop mais ça plante un peu)
Sinon tout est bon si je me suis pas trompée :=)
encore merci et d'avance bonne soirée
Édit : jviens de voir ton édition je regarde ça demain
Un dernier point et je pourrai mettre le sujet en résolu
pour bidouiller la forme et le contenu quand on appuie sur la notif, c'est bien ici :
.fa_tbMainElement.notification ul#notif_list ?
ici : #fa_right #fa_notifications, #notif_list .content div j'ai vu que c'était pour l'apparence externe ? J'ai presque fini d'obtenir ce que je veux, mais je voulais savoir, je peux rajouter quoi comme "truc" pour que ce soit sur la même ligne que la navigation ? (à l'oeil ça se voit pas trop mais ça plante un peu)
Sinon tout est bon si je me suis pas trompée :=)
encore merci et d'avance bonne soirée
Édit : jviens de voir ton édition je regarde ça demain
AryaLestrange- *
- Messages : 40
Inscrit(e) le : 14/06/2020 -
Re: positionnement barre de navigation + fusion avec les notifications
par AryaLestrange Dim 9 Aoû 2020 - 22:54
Double poste pour signaler que normalement tout est bon
Encore merci pour ton aide sur ces points le problème est à présent regler
Je reviendrai probablement sous peu
Encore merci pour ton aide sur ces points le problème est à présent regler
Je reviendrai probablement sous peu
AryaLestrange- *
- Messages : 40
Inscrit(e) le : 14/06/2020 -
Re: positionnement barre de navigation + fusion avec les notifications
par Invité Lun 10 Aoû 2020 - 7:10
Hello AryaLestrange,
de rien et à bientôt alors .
a++
de rien et à bientôt alors
.a++
Invité- Invité
Sujets similaires» Fusion toolbar et barre de navigation: absence de notifications messages privées
» Afficher avatar, messages privés et notifications sur la barre de navigation
» Ajout des notifications dans la barre de navigation et vu du profil en cliquant sur l'avatar
» probleme avec CSS pour une barre de navigation avec boutons reactifs
» Toolbar notifications dans la barre de navigation
» Afficher avatar, messages privés et notifications sur la barre de navigation
» Ajout des notifications dans la barre de navigation et vu du profil en cliquant sur l'avatar
» probleme avec CSS pour une barre de navigation avec boutons reactifs
» Toolbar notifications dans la barre de navigation
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum