feat : autre méthode avec js pour le bouton retour top

Retour sur 21ad2b89 qui n'était finalement pas optimum

javascripts.js.html

@@ -219,6 +219,15 @@ function myInitPages() {
 	// Surligner l'evenement en cours
 	var id_anchor  = location.hash.substr(1); //Get the word after the hash from the url
 	if (id_anchor) jQuery('#'+id_anchor).addClass('highlight_anchor'); // ajoute la classe highlight_anchor à l'element autour de l'ancre
+	
+	// retourtop
+	jQuery(window).scroll(function () {
+		if (jQuery(this).scrollTop() > 300) {
+			jQuery('.retourtop').fadeIn();
+		} else {
+			jQuery('.retourtop').fadeOut();
+		}
+	});
 
 [(#CONFIG{soyezcreateurs/native_tooltips}|=={on}|non)
 	jQuery(function() { jQuery( document ).tooltip({

noisettes/footer/footer.html

@@ -12,8 +12,11 @@
 ]
 <INCLURE{fond=noisettes/footer/#GET{noisettefooter},env}>
 <//B_TheRub>
-</div><!-- id="contenu" -->	
+</div><!-- id="contenu" -->
 <INCLURE{fond=noisettes/footer/footer_pied,env}>
+<div class="retourtop">
+  <a class="retourtop-link triadeA" href="[(#SELF|trim{'/'})]#[(#ENV{titretop}|sinon{<:soyezcreateurs:sommaire|sc_nettoyer_marqueur:>})]" title="<:soyezcreateurs:retourtop:>" aria-label="<:soyezcreateurs:retourtop:>"><svg class="svg-icon"><use xlink:href="#icon-chevron-thin-up"></use></svg><span class="hide"><:soyezcreateurs:retourtop:></span></a>
+</div>
 [<script src="(#PRODUIRE{fond=javascripts.js})" type="text/javascript"></script>]
 [(#PLUGIN{SIDR}|oui)
 [<script src="(#CHEMIN{javascript/jquery.sidr.js}|timestamp)" type="text/javascript"></script>]

noisettes/footer/footer_modeedito.html

-	<div class="retourtop">
-	  <a class="retourtop-link" href="[(#SELF|trim{'/'})]#[(#ENV{titretop}|sinon{<:soyezcreateurs:sommaire|sc_nettoyer_marqueur:>})]" title="<:soyezcreateurs:retourtop:>" aria-label="<:soyezcreateurs:retourtop:>"><svg class="svg-icon"><use xlink:href="#icon-chevron-thin-up"></use></svg><span class="hide"><:soyezcreateurs:retourtop:></span></a>
-	</div>
-</div><!-- id="content" -->
+		</div><!-- id="content" -->
 	</div><!-- id="wrapper" -->
 	<nav><div id="navigation" class="equilibre stackable">
 	<h1 class="nocontent offscreen">Menu de la section</h1>

stylessoyezcreateurs.css.html

@@ -25,7 +25,6 @@
 * a:focus-visible {
 	outline: 3px dashed rgba(80,80,80,0.68);
 	outline-offset: 4px;
-	background: transparent;
 }
 .offscreen {
     position: absolute;
@@ -467,41 +466,30 @@ a[href*="mailto"]:hover { cursor:url("data:image/png;base64,iVBORw0KGgoAAAANSUhE
 
 a:active { color: #GET{c_active}; }
 .retourtop {
-  position: absolute;
-  top: 100vh;
-  right: 0;
-  bottom: 0;
-  width: 0;
-  pointer-events: none;
-}
-
-.retourtop-link {
-  position: fixed;
-  position: sticky;
-  pointer-events: all;
-  top: calc(100vh - 3rem);
-  display: inline-block;
-  text-decoration: none;
-  font-size: 2rem;
-  line-height: 3rem;
-  text-align: center;
-  width: 3rem;
-  height: 3rem;
-  translate: -3rem;
-  border-radius: 50% 0 0 50%;
-  padding: 0.25rem;
-  box-shadow: inset 2px 0px 16px 0px rgb(0 0 0 / 14%);
-  color: #666;
-  background-color: rgb(255 255 255 / 60%);
-  transition: transform 80ms ease-in;
-}
-.retourtop-link:hover, .retourtop-link:focus {
-  transform: scale(1.1);
-  background-color: rgb(255 255 255 / 100%);
-}
-.retourtop-link:focus {
-  outline: none;
-  box-shadow: 0 0 0 3px #4e85c0;
+	display: inline-block;
+	clear: both;
+	position: sticky;
+	float: right;
+	bottom: 2rem;
+	right: 2rem;
+	width: fit-content;
+	color: #ffffff;
+	text-align: center;
+	font-size: 2rem;
+	font-weight: bold;
+	text-decoration: none;
+	border-right: none;
+	opacity: .8;
+	filter: alpha(opacity=80);
+	transition: opacity 500ms ease-out;
+	z-index: 99999;
+}
+.retourtop a {
+	padding: 1rem;
+	border: 1px solid transparent;
+}
+.portailcognac .retourtop a[href]:focus {
+	background-color: [(#GET{c_triadea}|couleur_extreme|=={000000}|?{#000000,#FFFFFF})]!important;
 }
 
 /*************** STRUCTURE - GENERAL */