Trop de blanc, un thème sombre SVP

[WildOne]

J'essayais de lire le max, de remonter le max, de faire le tri

J'ai pas toujours le temps de répondre à tout.

 

Ayez juste conscience qu'il y a des priorités : on a des gros soucis comme des problèmes de connexion, des soucis de conversion de photos, des attaques de spam qu'on souhaite régler au plus vite.

Alors pour vous malheureusement ça parait long, mais croyez bien qu'on fait au mieux et qu'on doit juste prioriser les choses.

 

Le fait que le fond soit un peu flashy, c'est un peu moins prioritaire que résoudre les soucis de réception de mot de passe pour nos membres.

En attendant, je tiens à remercier tous ceux qui ont partagé leurs tutos, pris le temps d'abaisser leur luminosité.

 

Je suis comme vous : je suis salarié du Groupe LaCentrale, mon taf c'est de gérer le forum, ma journée de travail c'est 5h sur le forum au bas mot par jour

Donc je vois de quoi vous parlez, j'ai du baisser ma luminosité d'écran également.

[WildOne]

@patrick51520je sais que "la place libre" t'agace, mais as-tu consulté ce lien ? 

Il détaille clairement quelle est son utilité en réalité.

[christiandunord]

Finalement, j'ai réalisé un thème sombre en attendant une version native. Il est adapté pour n'importe quelle taille d'écran de PC

 

Toujours selon la procédure décrite précédemment, voici le code à copier-coller :

 

Thème sombre avec optimisation de l'espace

/* Optimisation écrans larges */
.main, #ipsLayout_body, .container1200Desktop {max-width:1800px;}
/* Thème sombre */
body, .ipsPageHeader, .header-cara, #conteneurStation, #ipsLayout_header nav::after, #ipsLayout_body, .ipsQuote_citation, .footer-cara, #ipsLayout_footer {background:#1a1d23 !important;color:#868686;}    
.cPost, .ipsAreaBackground_light, .ipsButtonBar, .ipsBox, .ipsDataItem, .ipsTabs_panel, .ipsAreaBackground_reset, .cara-sousCataList .cForumRow a, .ipsTabs_activeItem, .ipsType_richText, .cke_wysiwyg_div {background:#262a33 !important;color:#d3d3d3 !important;}
.ipsType_pageTitle, .ipsNavBar_secondary >li>a, .ipsDataItem_subList a, .ipsType_normal a, .ipsType_dark, .ipsStreamItem_title a {color:#657ee4 !important;}
.ipsQuote, .ipsFieldRow_content, #elInput_guest_name, #elFooterLinks, #elCopyright {background-color: #0f1115;color:#717171;} 
.ipsNavBar_secondary, .ipsType_blendLinks a {color:#00D2A7;}   
a{color:#d3d3d3} a:hover{color:#e5e5e5;}

 

Ce qui donne :

 

 

 

Thème sombre avec optimisation de l'espace et sans widgets

/* Optimisation écrans larges */
.main, #ipsLayout_body, .container1200Desktop {max-width:1800px;}
/* Affichage sans widgets */
#ipsLayout_sidebar.ipsLayout_sidebarright {display:none}
/* Thème sombre */
body, .ipsPageHeader, .header-cara, #conteneurStation, #ipsLayout_header nav::after, #ipsLayout_body, .ipsQuote_citation, .footer-cara {background:#1a1d23 !important;color:#868686;}    
.cPost, .ipsAreaBackground_light, .ipsButtonBar, .ipsBox, .ipsDataItem, .ipsTabs_panel, .ipsAreaBackground_reset, .cara-sousCataList .cForumRow a, .ipsTabs_activeItem, .ipsType_richText, .cke_wysiwyg_div {background:#262a33 !important;color:#d3d3d3 !important;}
.ipsType_pageTitle, .ipsNavBar_secondary >li>a, .ipsDataItem_subList a, .ipsType_normal a, .ipsType_dark, .ipsStreamItem_title a {color:#657ee4 !important;}
.ipsQuote, .ipsFieldRow_content, #elInput_guest_name, #elFooterLinks, #ipsLayout_footer #elCopyright {background-color: #0f1115;color:#717171;} 
.ipsNavBar_secondary, .ipsType_blendLinks a {color:#00D2A7;}   
a{color:#d3d3d3} a:hover{color:#e5e5e5;}

 

Ce qui donne :

 

Voilà, n'hésitez pas à remonter vos éventuels bugs.

 

Modifié 17 janvier 2021 par christiandunord
Mise à jour des codes

[Lebricolo]

C'est sûr que de gérer un cite comme caradisiac ce n'est pas évident du tout. Bravo à ceux qui s'en occupe. Néanmoins, depuis le remaniement du site, je n'arrive plus à m'y retrouver comment au paravent. En plus comme déjà dit, c'est trop banc et avec trop de vide. Je n'aime plus tellement n'y connecter (un ancien membre réinscrit)
 

[christiandunord]

Petit tuto sur l'extension "Custom Style Script"

Cette extension, ultra-légère (50ko) et ne demandant que 2 permissions, présente l'avantage d'être disponible sur les navigateurs FireFox, Chrome, Edge et Opera
De plus elle permet d'y enregistrer plusieurs codes et dispose d'un bouton 'on/off'
Grâce au bouton 'on/off', il est ainsi possible d'activer et désactiver son thème personnalisé en 1 clic.

 

1/ installer l'extension "Custom Style Script" =>  FireFox, Chrome, Edge ou Opera 
2/ en haut à droite de votre navigateur, ouvrir l'extension en cliquant son icône </>
3/ cliquer sur 'Open options page' (sur Opera, cliquer sur les outils)
4/ indiquer l'adresse du forum dans la fenêtre de gauche URL = https://forum-auto.caradisiac.com
5/ copier-coller le code de thème choisi ( clair ou sombre) dans la fenêtre de droite STYLE(CSS)
6/ cliquer sur la barre grise anthracite (+) pour enregistrer le code

7/ fermer la fenêtre de l'extension. C'est prêt !

 

 

 

 

NB : Si vous ajoutez plusieurs codes pour un même domaine (tel le forum Caradisiac), il faudra décocher le ou les codes inactifs dans la case STATE. Seul le code actif doit rester coché dans STATE

 

*****

Alternativement, sur Chrome vous pouvez aussi installer l'extension "CSS and JavaScript Injection"

1/ installer l'extension "CSS and JavaScript Injection"
2/ aller à l'accueil du forum (pour que le code s'applique sur le forum)
3/ en haut à droite de votre navigateur, ouvrir l'extension en cliquant son icône

 

4/ copier-coller le code choisi dans la fenêtre noire qui s'ouvre

Exemple thème clair

 

Exemple thème sombre

 

5/ cliquer en dehors de la fenêtre pour la fermer. C'est prêt !

Le code est auto-sauvegardé et s'appliquera à chaque visite du forum.

 

Modifié 2 décembre 2020 par christiandunord
Améliorations et précisions sur la procédure

[fiestix85]

Salut

Merci d'avoir créé ce topic.

Première question, bête bien sur, quelle est l'URL de FA ?

Est-ce que c'est http://forum-auto.caradiasiac.com uniquement ou il faut que je rajoute un truc derrière ?

[christiandunord]

il y a 42 minutes, fiestix85 a dit :

Salut

Merci d'avoir créé ce topic.

Première question, bête bien sur, quelle est l'URL de FA ?

Est-ce que c'est http://forum-auto.caradiasiac.com uniquement ou il faut que je rajoute un truc derrière ?

Oui c'est bien cette URL, je viens d'éditer le tuto pour le préciser.

C'est également visible sur la capture d'écran (point 4)

[fiestix85]

Ok, merci.

J'ai oublié quelque chose, parce que c'est toujours blanc ?

 

J'ai édité, ça marche, j'avais oublié le code.

 

Modifié 29 novembre 2020 par fiestix85

[fiestix85]

Voilà, merci, en plus il n'y a plus les choses inutiles (pour moi) à droite.

[fiestix85]

Est-ce qu'il est possible de modifier quelque chose car notre amis @Fifty Five écrit en bleu et ce n'est pas très lisible, voir pas du tout avec le thème sombre ?

Merci 

ici-> https://forum-auto.caradisiac.com/topic/377434-restauration-citroën-dyane-6-de-1975/page/12/?tab=comments#comment-57380396

[christiandunord]

Il y a 7 heures, fiestix85 a dit :

Voilà, merci, en plus il n'y a plus les choses inutiles (pour moi) à droite.

Ah ah, content que tu y sois arrivé 😉

[Fifty Five]

il y a 41 minutes, fiestix85 a dit :

Est-ce qu'il est possible de modifier quelque chose car notre amis @Fifty Five écrit en bleu et ce n'est pas très lisible, voir pas du tout avec le thème sombre ?

Merci 

ici-> https://forum-auto.caradisiac.com/topic/377434-restauration-citroën-dyane-6-de-1975/page/12/?tab=comments#comment-57380396

Comme le dit si bien @WildOne il y a des priorités et chacun peut y mettre du sien. Perso, je n'écrirai plus en bleu foncé mais en noir foncé qui deviendra blanc clair en mode sombre

[christiandunord]

Ah ben oui, il y a des effets collatéraux 😁

[WildOne]

Le 28/11/2020 à 22:50, Lebricolo a dit :

C'est sûr que de gérer un cite comme caradisiac ce n'est pas évident du tout. Bravo à ceux qui s'en occupe. Néanmoins, depuis le remaniement du site, je n'arrive plus à m'y retrouver comment au paravent. En plus comme déjà dit, c'est trop banc et avec trop de vide. Je n'aime plus tellement n'y connecter (un ancien membre réinscrit)
 

Si tu as des soucis avec ton ancien pseudo tu peux suivre ce tuto :

 

 

Sinon on a des tutos ici pour t'aider : https://forum-auto.caradisiac.com/forum/1646-faq-tutoriaux-et-guides-pratiques/

 

Pour le blanc on est dessus

[fiestix85]

 

Un coucou pour remercier, le gars du chnord  @christiandunord

qui nous aide grandement.

Ça fonctionne parfaitement et tout est bien lisible.

Modifié 30 novembre 2020 par fiestix85

[philX]

Il y a 3 heures, fiestix85 a dit :

 

Un coucou pour remercier, le gars du chnord, qui nous aide grandement.

Ça fonctionne parfaitement et tout est bien lisible.

 

On dirait que tu as eu du mal quand même ... 

 

[pierregdlj]

Il y a 3 heures, fiestix85 a dit :

 

Un coucou pour remercier, le gars du chnord, qui nous aide grandement.

Ça fonctionne parfaitement et tout est bien lisible.

+1000, merci vraiment.

 

J'ajoute pour @fiestix85que pour virer le logo en haut de la page, tu peux utiliser Adblock Plus (clic droit sur le logo).

Je sais, cette solution n'est pas terrible parce-que la pub finance le forum, mais en attendant, ça permet de respirer un peu.

[fiestix85]

il y a 57 minutes, philX a dit :

 

On dirait que tu as eu du mal quand même ... 

 

Je ne vois pas pourquoi tu dis ça ?

il y a 10 minutes, pierregdlj a dit :

+1000, merci vraiment.

 

J'ajoute pour @fiestix85que pour virer le logo en haut de la page, tu peux utiliser Adblock Plus (clic droit sur le logo).

Je sais, cette solution n'est pas terrible parce-que la pub finance le forum, mais en attendant, ça permet de respirer un peu.

La pub ne me dérange pas car dès que je descends, donc presque tout le temps, la pub est en haut et invisible.

 

J'édite, depuis pas mal de jour adblock était désactivé pour FA, car ça posait des soucis, je le réactive à l'instant, tout fonctionne très bien et pas de bandeau publicitaire en haut.

Donc pour l'instant tout va pour le mieux.

Modifié 30 novembre 2020 par fiestix85

[WildOne]

 

il y a 13 minutes, pierregdlj a dit :

+1000, merci vraiment.

 

J'ajoute pour @fiestix85que pour virer le logo en haut de la page, tu peux utiliser Adblock Plus (clic droit sur le logo).

Je sais, cette solution n'est pas terrible parce-que la pub finance le forum, mais en attendant, ça permet de respirer un peu.

On a aussi prévu sur la version officielle de faire en sorte que le logo ne reste pas présent quand on fait défiler vers le bas  et également sur la partie éditoriale pour le coup.

 

J'aimerais vous proposer des solutions rapides, mais on préfère prendre le temps de bien faire les choses que d'avoir trop d'effets de bord et des choses mal chartées.

[pierregdlj]

il y a 1 minute, WildOne a dit :

 

On a aussi prévu sur la version officielle de faire en sorte que le logo ne reste pas présent quand on fait défiler vers le bas  et également sur la partie éditoriale pour le coup.

 

J'aimerais vous proposer des solutions rapides, mais on préfère prendre le temps de bien faire les choses que d'avoir trop d'effets de bord et des choses mal chartées.

J'avais bien compris.

 

La solution Adblock est vraiment provisoire, et je comprends bien que tu ne peux pas la promouvoir.

Donc, en attendant, perso je fais comme ça (et sans effet de bord), histoire de continuer à venir avec plaisir...

[christiandunord]

C'est très simple de faire disparaitre le logo quand on scroll vers le bas, puis le faire réapparaitre quand on remonte en haut de page.

Quelques lignes de javascript et le tour est joué. Je prépare ça et reviens donner les éléments pour ceux que cela intéresse.

[fiestix85]

Quand vous parliez logo, je pensais bandeau publicitaire, encore une fois j'étais à côté.

Donc oui, le logo caradisiac est un peu visible.

[christiandunord]

Alors pour rendre le logo dynamique (qui apparait/disparait au scroll), il faut ajouter un script à votre extension.

 

1/ copier-coller ce code dans le champ vide, situé sous celui de l'URL du forum

/* Logo dynamique */
var seuil = 150;
jQuery(document).ready(function(){
     $(window).scroll(function () {
        if ($(this).scrollTop() > seuil) {
              $('.logo-cara').hide();
        } else {
              $('.logo-cara').show();
        }
     });
   });

 

NB :  Pour Firefox et Opera il est nécessaire d'encapsuler le code comme ceci :

window.onload = function() {
          CODE
}

 

2/ cliquer sur "Reload active tab" en haut de page pour enregistrer les modifications (inutile sur Opera)

 

 

Et voilà ! 😀

 

Edit du 14/04/2021 : Ce script n'est plus utile depuis la fin mars 2021, la fonctionnalité étant devenu native sur le forum.

 

Modifié 14 avril 2021 par christiandunord

[fiestix85]

J'ai collé ton script sous la case de l'URL et ça ne change rien, c'estquoiquicloche?

Merci

 

 

Modifié 30 novembre 2020 par fiestix85

[christiandunord]

il y a 22 minutes, fiestix85 a dit :

J'ai collé ton script sous la case de l'URL et ça ne change rien, c'estquoiquicloche?

Merci

 

 

Je pense que tu as oublié de cliquer en haut pour enregistrer.

Regarde l'image 1. tu copie-colle  2. tu recharge la page

[christiandunord]

Pour celles et ceux qui utilisent plutôt "CSS and JavaScript Injection" sur Chrome, le script du logo dynamique est à copier-coller dans le 3ème onglet de l'extension nommé "Javascript", et voilà ce que ça donne dès qu'on scrolle un peu :

 

 

[fiestix85]

il y a 45 minutes, christiandunord a dit :

Je pense que tu as oublié de cliquer en haut pour enregistrer.

Regarde l'image 1. tu copie-colle  2. tu recharge la page

J'ai bien cliqué sur reload active tab après avoir collé le code, comprend pas.

Alors j'ai recommencé une deuxième fois, c'est pareil.

Modifié 30 novembre 2020 par fiestix85

[Ze Fifi]

Merci pour ces tutos qui rendent le forum moins usant pour nos p'tits yeux😵

Modifié 1 décembre 2020 par Ze Fifi

[fiestix85]

Le 30/11/2020 à 19:43, fiestix85 a dit :

J'ai bien cliqué sur reload active tab après avoir collé le code, comprend pas.

Alors j'ai recommencé une deuxième fois, c'est pareil.

C'est bon, tout fonctionne parfaitement, merci christiandunord.

[zorglub]

Le 30/11/2020 à 19:03, christiandunord a dit :

Pour celles et ceux qui utilisent plutôt "CSS and JavaScript Injection" sur Chrome, le script du logo dynamique est à copier-coller dans le 3ème onglet de l'extension nommé "Javascript",

 

 

Très bien très bonne idée,   et c'est très cool de faire partager ton code permettant de réécrire la page.

 

J'avoue que je n'y avais pas pensé à la réécriture de page, par injection de code CSS et Javascript.

 

 

 

 

[christiandunord]

Oui je ne pouvais pas attendre une évolution officielle et j'ai rapidement modifié mon affichage.
Après il me fallait une extension fiable pour me permette de partager au plus grand nombre mes codes.
Mais aussi faire en sorte d'expliquer à des personnes sans connaissance comment faire, j'espère y être arrivé. 😀

Modifié 2 décembre 2020 par christiandunord

[Tydav16]

Le 30/11/2020 à 17:39, christiandunord a dit :

Alors pour rendre le logo dynamique (qui apparait/disparait au scroll), il faut ajouter un script à votre extension.

 

1/ copier-coller ce code dans le champ vide, situé sous celui de l'URL du forum

var seuil = 150;
jQuery(document).ready(function(){
     $(window).scroll(function () {
        if ($(this).scrollTop() > seuil) {
              $('.logo-cara').hide();
        } else {
              $('.logo-cara').show();
        }
     });
   });

 

NB :  Pour Firefox et Opera il est nécessaire d'encapsuler le code comme ceci :

window.onload = function() {
          CODE
}

 

2/ cliquer sur "Reload active tab" en haut de page pour enregistrer les modifications (inutile sur Opera)

 

 

Et voilà !

 

Cette histoire de logo dynamique , j'y arrive pas.

Le précédent script fonctionne parfaitement pour la couleur et la largeur de la page mais je suis bloqué pour celui là.

Je suis sous Windows 10 avec l'extension  customcss injector sur firefox

[christiandunord]

il y a une heure, Tydav16 a dit :

Cette histoire de logo dynamique , j'y arrive pas.

Le précédent script fonctionne parfaitement pour la couleur et la largeur de la page mais je suis bloqué pour celui là.

Je suis sous Windows 10 avec l'extension  customcss injector sur firefox

Ah ah, il n'y a pas que mon Muppet préféré qui a du mal 😁

Trêve de plaisanterie, cette extension n'accepte pas de javascript. Il te faut changer pour "Custom Style Script"
Et du coup tu insères directement le script du logo dynamique en même temps que le reste, comme ceci :

[Tydav16]

Merci.
j'avais pas vu les derniers EDIT au dessus , c'est pour ca que je ne comprenais pas 

[christiandunord]

Première mise à jour des thèmes.
La page de la liste des sujets a évolué. De fait, la structure est différente et le fond des nouveaux conteneurs est Blanc. Cela se voit surtout avec le thème sombre (voir captures d'écran).

Toutefois il  est possible que votre navigateur vous serve une version en cache donc vous ne voyez pour l'instant que la version antérieure (1ère capture)
Pour obtenir la coloration des conteneurs de cette page (3ème capture), vous devez mettre à jour votre thème ( les codes sont à jour).

 

 

La liste des sujets AVANT

 

La liste des sujets MAINTENANT

 

La liste des sujets APRÈS correction

 

PS : Pensez à suivre le sujet afin d'être averti(e) des mises à jour