Un mode sombre pour AwesomeBB
2 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 2 • Partagez
Page 1 sur 2 • 1, 2
Un mode sombre pour AwesomeBB
Détails techniques
Version du forum : AwesomeBB
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : https://jeuxvideo-club.forumactif.com/
Description du problème
Bonjour,Je souhaite intégrer un mode sombre sur mon forum.
Je n'ai pas trouvé un tutoriel ou des codes déjà "toute faites" pour pouvoir permettre aux membres de choisir entre le mode clair (normal) et le mode sombre. Oui je vais être honnête avec vous, le codage, ce n'est pas vraiment mon truc.
Le thème de forum à part la couleur des catégories que j'ai mis en noir au lieu de bleu, je n'ai rien changé.
Est-ce que c'est possible ? Si oui, comment ?
Merci par avance de votre aide
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Je relance.
Quelqu'un a pu trouver une solution ? Si ce n'est pas possible, ce n'est pas grave....
Quelqu'un a pu trouver une solution ? Si ce n'est pas possible, ce n'est pas grave....
Invité- Invité
Re: Un mode sombre pour AwesomeBB
N'ayant toujours pas de réponse au bout de 3 jours, je relance à nouveau
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Je reviens vers vous.
Mais cette fois, ce n'est pas une simple relance. Je ne comprends pas tout mais j'ai cherché.
J'ai utilisé le tutoriel pour le sélecteur de style : https://forum.forumactif.com/t308631-selecteur-de-style
Mais je bloque complètement sur le CSS.
J'ai trouvé un thème sombre, déjà créé : https://help.forumotion.com/t158803-awesomebb-midnightawe#1104842
Comment je peux avoir le CSS ? Ou comment je peux intégrer ce thème dans le sélecteur de style ?
Mais cette fois, ce n'est pas une simple relance. Je ne comprends pas tout mais j'ai cherché.
J'ai utilisé le tutoriel pour le sélecteur de style : https://forum.forumactif.com/t308631-selecteur-de-style
Mais je bloque complètement sur le CSS.
J'ai trouvé un thème sombre, déjà créé : https://help.forumotion.com/t158803-awesomebb-midnightawe#1104842
Comment je peux avoir le CSS ? Ou comment je peux intégrer ce thème dans le sélecteur de style ?
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Bonjour,
Il me semble que le thème sombre choisi est un thème complet pour forum avec les éléments du panneau d'administration couleurs, images, css. Il n'est pas fait pour être installé seulement en css. Je ne pense pas qu'il soit possible de switcher d'un thème à l'autre à l'aide du sélecteur, le panneau ne permettant qu'un seul thème à la fois, donc il vaudrait mieux un thème sombre uniquement en css.
Par exemple, voici un css permettant d'obtenir en majorité les mêmes couleurs que le thème que vous avez choisi (j'ai fait rapidement avec les pages principales, il risque de manquer des choses et de devoir compléter) :
Il me semble que le thème sombre choisi est un thème complet pour forum avec les éléments du panneau d'administration couleurs, images, css. Il n'est pas fait pour être installé seulement en css. Je ne pense pas qu'il soit possible de switcher d'un thème à l'autre à l'aide du sélecteur, le panneau ne permettant qu'un seul thème à la fois, donc il vaudrait mieux un thème sombre uniquement en css.
Par exemple, voici un css permettant d'obtenir en majorité les mêmes couleurs que le thème que vous avez choisi (j'ai fait rapidement avec les pages principales, il risque de manquer des choses et de devoir compléter) :
- Code:
body {
background-color: #2c3e50;
color: #f5f7fa;
}
.forum-header, .posts-header {
background-color: #8067b7;
}
.forum-section, .posts-section {
background-color: #34495e;
}
.block-topics .block-topics-posts i, .block-topics .block-topics-views i, .forum-lastpost-header i, .forum-statistics-header i, .posts-lastpost-header i, .posts-statistics-header i, .posts-lastpost i, .forum-lastpost-author i, .forum-lastpost-location i, .forum-lastpost-time i, .posts-lastpost-author i, .posts-lastpost-time i, select, .input, input, .sceditor-container iframe, .sceditor-container textarea, .inputbox, a, a:visited, .forum-description h3, .posts-description h3 {
color: white;
}
.forum-description p, .posts-description p, .forum-statistics-posts span, .forum-statistics-topics span, .posts-statistics-replies span, .posts-statistics-views span, .profile-advanced-stats dt span[style*="536482"] {
color: #e0d6d6;
}
#tabs ul, .tabs ul, .box-body, .block .block-content, .block-subtle, .post, .post-aside, .panel, .post-section, .fb-or-text, .mod-news, .mod-news-footer, .social_login_group .fb-or-text, #chatbox_contextmenu, #help-button, .fontbutton, #header-user img, .avatar-big img, .avatar-default img, .avatar-mini img, .cb-avatar img, .mod-login-avatar img, input, .forumline tbody tr, .table1 tbody tr, .calendar-cell {
background-color: #34495E;
}
.select-wrap select:hover, .jumpbox-wrap select:hover, .quickmod-wrap select:hover {
border-color: #8067b7;
}
.block-market .market-item-price, .block .block-secondary-content, .block .sub-head, .block .block-footer, .post-aside, .attachbox, .box-foot, .post-footer, .sceditor-group, .posts-lastpost, .quick-reply .textarea, .jumpbox-wrap select, .quickmod-wrap select, .select-wrap select, #divcolor, #divsmilies, #help-button, #submit_button, .format-message+label, #tabs li:hover, .tabs li:hover {
background-color: #2c3e50!important;
border-color: #2c3e50;
color: #fff;
}
.fa_like_list, .fa_dislike_list, .option_voters_list, blockquote cite {
color: rgba(255,255,255,0.6);
}
dl.post-author-details span.label span, #block-online .headline a {
color: white !important;
}
blockquote {
background: #2c3e50;
}
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Un mode sombre pour AwesomeBB
Enfin du concret, je suis super content ! Merci.
Je vais regarder les couleurs de base et je reviendrai vers vous pour le reste
Je vais regarder les couleurs de base et je reviendrai vers vous pour le reste
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Je reviens vers vous.
D'abord merci beaucoup @MlleAlys
J'ai modifié une ou deux couleurs :
Bien sûr, il y a encore pas mal de choses à compléter. D'abord les plus gros morceaux. Je vous ai fais quelques captures d'écran
Tous les boutons sont en noir, y compris ceux de la modération. Je ne sais pas si c'est possible mais j'aimerais pouvoir les voir. En gris ou blanc de préférence...
Sur la réponse rapide, j'aimerais changer la couleur du cadre et aussi le fond du message, j'aimerais qu'il soit en bleu et non blanc, le même que :
Les balises, si possible le fond en gris/blanc et le bouton prévisualiser pareil que les autres, en gris ou blanc de préférence.
Et la couleur de texte en blanc, quand on tape notre message.
Voilà pour commencer.
Ne vous inquiétez pas pour les couleurs, je peux changer si besoin. C'est surtout les codes que j'ai besoin d'aide. Je suis un vrai débutant là-dessus.
Merci beaucoup de votre aide par avance !
D'abord merci beaucoup @MlleAlys
J'ai modifié une ou deux couleurs :
- Code:
body {
background-color: #2c3e50;
color: #f5f7fa;
}
.forum-header, .posts-header {
background-color: #172329;
}
.forum-section, .posts-section {
background-color: #34495E;
}
.block-topics .block-topics-posts i, .block-topics .block-topics-views i, .forum-lastpost-header i, .forum-statistics-header i, .posts-lastpost-header i, .posts-statistics-header i, .posts-lastpost i, .forum-lastpost-author i, .forum-lastpost-location i, .forum-lastpost-time i, .posts-lastpost-author i, .posts-lastpost-time i, select, .input, input, .sceditor-container iframe, .sceditor-container textarea, .inputbox, a, a:visited, .forum-description h3, .posts-description h3 {
color: white;
}
.forum-description p, .posts-description p, .forum-statistics-posts span, .forum-statistics-topics span, .posts-statistics-replies span, .posts-statistics-views span, .profile-advanced-stats dt span[style*="536482"] {
color: white;
}
#tabs ul, .tabs ul, .box-body, .block .block-content, .block-subtle, .post, .post-aside, .panel, .post-section, .fb-or-text, .mod-news, .mod-news-footer, .social_login_group .fb-or-text, #chatbox_contextmenu, #help-button, .fontbutton, #header-user img, .avatar-big img, .avatar-default img, .avatar-mini img, .cb-avatar img, .mod-login-avatar img, input, .forumline tbody tr, .table1 tbody tr, .calendar-cell {
background-color: #34495E;
}
.select-wrap select:hover, .jumpbox-wrap select:hover, .quickmod-wrap select:hover {
border-color: #172329;
}
.block-market .market-item-price, .block .block-secondary-content, .block .sub-head, .block .block-footer, .post-aside, .attachbox, .box-foot, .post-footer, .sceditor-group, .posts-lastpost, .quick-reply .textarea, .jumpbox-wrap select, .quickmod-wrap select, .select-wrap select, #divcolor, #divsmilies, #help-button, #submit_button, .format-message+label, #tabs li:hover, .tabs li:hover {
background-color: #2c3e50!important;
border-color: #2c3e50;
color: #fff;
}
.fa_like_list, .fa_dislike_list, .option_voters_list, blockquote cite {
color: rgba(255,255,255,0.6);
}
dl.post-author-details span.label span, #block-online .headline a {
color: white !important;
}
blockquote {
background: #2c3e50;
}
Bien sûr, il y a encore pas mal de choses à compléter. D'abord les plus gros morceaux. Je vous ai fais quelques captures d'écran
Tous les boutons sont en noir, y compris ceux de la modération. Je ne sais pas si c'est possible mais j'aimerais pouvoir les voir. En gris ou blanc de préférence...
Sur la réponse rapide, j'aimerais changer la couleur du cadre et aussi le fond du message, j'aimerais qu'il soit en bleu et non blanc, le même que :
Les balises, si possible le fond en gris/blanc et le bouton prévisualiser pareil que les autres, en gris ou blanc de préférence.
Et la couleur de texte en blanc, quand on tape notre message.
Voilà pour commencer.
Ne vous inquiétez pas pour les couleurs, je peux changer si besoin. C'est surtout les codes que j'ai besoin d'aide. Je suis un vrai débutant là-dessus.
Merci beaucoup de votre aide par avance !
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Essayez le css ainsi :
- Code:
body {
background-color: #2c3e50;
color: #f5f7fa;
}
.forum-header, .posts-header {
background-color: #172329;
}
.forum-section, .posts-section {
background-color: #34495E;
}
.block-topics .block-topics-posts i, .block-topics .block-topics-views i, .forum-lastpost-header i, .forum-statistics-header i, .posts-lastpost-header i, .posts-statistics-header i, .posts-lastpost i, .forum-lastpost-author i, .forum-lastpost-location i, .forum-lastpost-time i, .posts-lastpost-author i, .posts-lastpost-time i, select, .input, input, .sceditor-container iframe, .sceditor-container textarea, .inputbox, a, a:visited, .forum-description h3, .posts-description h3 {
color: white;
}
.forum-description p, .posts-description p, .forum-statistics-posts span, .forum-statistics-topics span, .posts-statistics-replies span, .posts-statistics-views span, .profile-advanced-stats dt span[style*="536482"] {
color: white;
}
#tabs ul, .tabs ul, .box-body, .block .block-content, .block-subtle, .post, .post-aside, .panel, .post-section, .fb-or-text, .mod-news, .mod-news-footer, .social_login_group .fb-or-text, #chatbox_contextmenu, #help-button, .fontbutton, #header-user img, .avatar-big img, .avatar-default img, .avatar-mini img, .cb-avatar img, .mod-login-avatar img, input, .forumline tbody tr, .table1 tbody tr, .calendar-cell {
background-color: #34495E;
}
.select-wrap select:hover, .jumpbox-wrap select:hover, .quickmod-wrap select:hover {
border-color: #172329;
}
.block-market .market-item-price, .block .block-secondary-content, .block .sub-head, .block .block-footer, .post-aside, .attachbox, .box-foot, .post-footer, .posts-lastpost, .quick-reply .textarea, .jumpbox-wrap select, .quickmod-wrap select, .select-wrap select, #divcolor, #divsmilies, #help-button, #submit_button, .format-message+label, #tabs li:hover, .tabs li:hover {
background-color: #2c3e50!important;
border-color: #2c3e50;
color: #fff;
}
.fa_like_list, .fa_dislike_list, .option_voters_list, blockquote cite {
color: rgba(255,255,255,0.6);
}
dl.post-author-details span.label span, #block-online .headline a {
color: white !important;
}
blockquote {
background: #2c3e50;
}
.btn, input[type="submit"], input[type="button"] {
background: white;
color: black !important;
}
.quick-reply .quick-reply-btn {
background: none;
color: white !important;
}
.sceditor-container textarea {
color: white !important;
}
.quick-reply-textarea-wrap .sceditor-container {
border: none !important;
}
.quick-reply .sceditor-button {
background: white;
}
.quick-reply-textarea-wrap .sceditor-container iframe, .quick-reply-textarea-wrap .sceditor-container textarea {
background-color: unset !important;
color: white;
}
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Un mode sombre pour AwesomeBB
MlleAlys a écrit:Essayez le css ainsi :
Super content. Parce que je suis très satisfait du résultat et parce qu'on avance !
Je continue. Je m'excuse de faire petit à petit mais j'essaye comprendre un minimum ce qu'on fait
Que ce soit dans les messages rapides ou messages classiques (répondre ou créer un sujet), j'écris en noir (pas de problème avec les citations ou code). Et j'aimerais que ce soit en blanc
Ensuite, il reste encore des morceaux à corriger avant de passer aux petits détails :
Le profil.
Voir profil :
Dans modifier profil.
J'ai installé un module Evenement. Le seul que j'installerai et j'ai un problème :
Les liens et l'écriture sont en blanc sur un fond blanc....
Merci beaucoup par avance, encore une fois !
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Pour le profil et les évènements, ajoutez cela à votre css :
Pour la couleur du texte dans l'éditeur, pardon j'ai travaillé en mode source et j'ai oublié le mode wysiwyg. Pour ce mode, il faut passer par un javascript :
- dans modules > javascripts
- vérifiez que l'option "activer la gestion des javascripts" est cochée sur OUI
- créez un nouveau code javascript :
- nom : ce que vous souhaitez (par exemple "éditeur wysiwyg")
- placement : sur toutes les pages
- code :
Cependant, ce code pour l'instant s'active automatiquement, peut importe mode clair ou sombre, il faudra le modifier en fonction de la façon dont vous allez installer le css.
- Code:
#profile-tab-field-profil dt span, #profile-menu a, .profile-field label span, .cp-sidebar a {
color: white !important;
}
.EV_List .EV_Item {
background: #34495E;
}
Pour la couleur du texte dans l'éditeur, pardon j'ai travaillé en mode source et j'ai oublié le mode wysiwyg. Pour ce mode, il faut passer par un javascript :
- dans modules > javascripts
- vérifiez que l'option "activer la gestion des javascripts" est cochée sur OUI
- créez un nouveau code javascript :
- nom : ce que vous souhaitez (par exemple "éditeur wysiwyg")
- placement : sur toutes les pages
- code :
- Code:
$(function(){
$(function(){
$(".sceditor-container iframe").contents().find("head").append("<style>body,html,code:before,p,table{color:#fff!important;} blockquote,code{color:black;}</style>");
});
});
Cependant, ce code pour l'instant s'active automatiquement, peut importe mode clair ou sombre, il faudra le modifier en fonction de la façon dont vous allez installer le css.
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Un mode sombre pour AwesomeBB
MlleAlys a écrit:
Cependant, ce code pour l'instant s'active automatiquement, peut importe mode clair ou sombre, il faudra le modifier en fonction de la façon dont vous allez installer le css.
OK. Avant de répondre à cette question (vu qu'on passe au Javascript), je voudrais régler quelques petits détails sur le graphique encore.
Quand je passe la souris sur "Sélectionner un forum" ou "Sélctionner", je voudrais que le cadre soit blanc
Quand je sélectionne un événement, en haut à gauche, il y a la date. J'aimerais si possible l'écriture en noir. (ou un fond d'une autre couleur)
Et pour finir mais c'est peut-être plus complexe voire impossible :
Les couleurs bleu, rouge, vert, etc.... (ce sont des couleurs qu'on a sur la balise : ⁾
Est-ce qu'il est possible de changer automatiquement selon le thème ?
Merci par avance !
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Couleur de la bordure des sélections :
Dans le css, changez cette couleur-ci pour du blanc :
Pour la couleur des dates des évènements en noir, ajoutez le code suivant :
Pour ce qui est de changer les couleurs.... je suppose que c'est faisable en css, avec des codes de ce type :
Dans le css, changez cette couleur-ci pour du blanc :
- Code:
.select-wrap select:hover, .jumpbox-wrap select:hover, .quickmod-wrap select:hover {
border-color: #172329;
}
Pour la couleur des dates des évènements en noir, ajoutez le code suivant :
- Code:
.date-block {
color: black;
}
Pour ce qui est de changer les couleurs.... je suppose que c'est faisable en css, avec des codes de ce type :
- Code:
*[style="color:#004599"] { /*couleur d origine*/
color: #5ea7ff !important; /*nouvelle couleur*/
}
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Un mode sombre pour AwesomeBB
Super !
Je voudrais revenir sur deux choses, si ça ne dérange pas parce que j'ai beaucoup embêté aujourd'hui
Oui, c'est gênant pour ceux qui utilise le mode clair (par défault) :/ J'ai suivi le tutoriel.
J'ai mis un Javascript pour le selecteur de style
Le CSS complet du mode sombre :
Et le CSS à mettre dans FA :
Deuxième chose :
Je veux bien essayé mais il faut mettre ça où ? Dans le CSS de FA ou le CSS du mode sombre ?
Je voudrais revenir sur deux choses, si ça ne dérange pas parce que j'ai beaucoup embêté aujourd'hui
MlleAlys a écrit:Pour la couleur du texte dans l'éditeur, pardon j'ai travaillé en mode source et j'ai oublié le mode wysiwyg. Pour ce mode, il faut passer par un javascript :
- dans modules > javascripts
- vérifiez que l'option "activer la gestion des javascripts" est cochée sur OUI
- créez un nouveau code javascript :
- nom : ce que vous souhaitez (par exemple "éditeur wysiwyg")
- placement : sur toutes les pages
- code :- validez.
- Code:
$(function(){
$(function(){
$(".sceditor-container iframe").contents().find("head").append("<style>body,html,code:before,p,table{color:#fff!important;} blockquote,code{color:black;}</style>");
});
});
Cependant, ce code pour l'instant s'active automatiquement, peut importe mode clair ou sombre, il faudra le modifier en fonction de la façon dont vous allez installer le css.
Oui, c'est gênant pour ceux qui utilise le mode clair (par défault) :/ J'ai suivi le tutoriel.
J'ai mis un Javascript pour le selecteur de style
- Code:
$("head").append('<link rel="stylesheet" type="text/css" id="tstyle" />');
if (my_getcookie("sstyle")) {
$("#tstyle").attr("href", my_getcookie('sstyle'));
}
function addstyle(nom, lien) {
$("#sstyle").append('<option value="' + lien + '">' + nom + '</option>');
}
function changestyle(cssurl) {
var chatbox = true;
my_setcookie('sstyle', $('#tstyle')[0].href = cssurl, 1, 0);
if(chatbox == true) {
$('#frame_chatbox').attr('data', $('#frame_chatbox').attr('data'));
}
}
$(function() {
$(function() {
var version = 'awesomebb';
var mobile = false;
var selectors = {
'phpbb2': 'table:has(a.mainmenu[href^="/login"]) + div',
'phpbb3': '#search-box',
'punbb': '#pun-visit ul',
'invision': '#submenu li a',
'modernbb': 'ul.linklist.top a',
'awesomebb': '#main-menu a',
'mobilemodern': 'main'
};
if ($("#mpage-body-modern").length) {
version = 'mobilemodern';
if(mobile == false) {
$("#tstyle").remove();
return;
}
}
$("iframe[name=smilies]").load(function() {
$("iframe[name=smilies]").contents().find("head").append($("#tstyle").clone()).append('<style type="text/css">body{margin:0!important;}</style>');
});
$(selectors[version]).first().before('<select id="sstyle" onChange="changestyle(this.value);"><option value="">MODE CLAIR</option></select>');
addstyle("MODE SOMBRE (test)", "LIEN");
if (my_getcookie("sstyle")) {
$('#sstyle option[value="' + my_getcookie("sstyle") + '"]').attr("selected", "selected");
}
});
});
Le CSS complet du mode sombre :
- Code:
body {
background-color: #2c3e50;
color: #f5f7fa;
}
.forum-header, .posts-header {
background-color: #172329;
}
.forum-section, .posts-section {
background-color: #34495E;
}
.block-topics .block-topics-posts i, .block-topics .block-topics-views i, .forum-lastpost-header i, .forum-statistics-header i, .posts-lastpost-header i, .posts-statistics-header i, .posts-lastpost i, .forum-lastpost-author i, .forum-lastpost-location i, .forum-lastpost-time i, .posts-lastpost-author i, .posts-lastpost-time i, select, .input, input, .sceditor-container iframe, .sceditor-container textarea, .inputbox, a, a:visited, .forum-description h3, .posts-description h3 {
color: white;
}
.forum-description p, .posts-description p, .forum-statistics-posts span, .forum-statistics-topics span, .posts-statistics-replies span, .posts-statistics-views span, .profile-advanced-stats dt span[style*="536482"] {
color: white;
}
#tabs ul, .tabs ul, .box-body, .block .block-content, .block-subtle, .post, .post-aside, .panel, .post-section, .fb-or-text, .mod-news, .mod-news-footer, .social_login_group .fb-or-text, #chatbox_contextmenu, #help-button, .fontbutton, #header-user img, .avatar-big img, .avatar-default img, .avatar-mini img, .cb-avatar img, .mod-login-avatar img, input, .forumline tbody tr, .table1 tbody tr, .calendar-cell {
background-color: #34495E;
}
.select-wrap select:hover, .jumpbox-wrap select:hover, .quickmod-wrap select:hover {
border-color: white;
}
.block-market .market-item-price, .block .block-secondary-content, .block .sub-head, .block .block-footer, .post-aside, .attachbox, .box-foot, .post-footer, .posts-lastpost, .quick-reply .textarea, .jumpbox-wrap select, .quickmod-wrap select, .select-wrap select, #divcolor, #divsmilies, #help-button, #submit_button, .format-message+label, #tabs li:hover, .tabs li:hover {
background-color: #2c3e50!important;
border-color: #2c3e50;
color: #fff;
}
.fa_like_list, .fa_dislike_list, .option_voters_list, blockquote cite {
color: rgba(255,255,255,0.6);
}
dl.post-author-details span.label span, #block-online .headline a {
color: white !important;
}
blockquote {
background: #2c3e50;
}
.btn, input[type="submit"], input[type="button"] {
background: white;
color: black !important;
}
.quick-reply .quick-reply-btn {
background: none;
color: white !important;
}
.sceditor-container textarea {
color: white !important;
}
.quick-reply-textarea-wrap .sceditor-container {
border: none !important;
}
.quick-reply .sceditor-button {
background: white;
}
.quick-reply-textarea-wrap .sceditor-container iframe, .quick-reply-textarea-wrap .sceditor-container textarea {
background-color: unset !important;
color: white;
}
#profile-tab-field-profil dt span, #profile-menu a, .profile-field label span, .cp-sidebar a {
color: white !important;
}
.EV_List .EV_Item {
background: #34495E;
}
.date-block {
color: black;
}
Et le CSS à mettre dans FA :
- Code:
#sstyle {
position: relative;
left: 32px;
width: auto;
color: #fff;
border-color: #fff;
width: 235px;
max-width: 235px;
}
#sstyle option {
color: initial;
}
Deuxième chose :
Pour ce qui est de changer les couleurs.... je suppose que c'est faisable en css, avec des codes de ce type :
Je veux bien essayé mais il faut mettre ça où ? Dans le CSS de FA ou le CSS du mode sombre ?
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Dans le css du mode sombre ^^Zlork a écrit:Je veux bien essayé mais il faut mettre ça où ? Dans le CSS de FA ou le CSS du mode sombre ?
Pour ce qui est du reste.... Je vais peut être passer la main !
Ici le tutoriel vous propose d'héberger votre feuille css via Archive-Host avant d'indiquer le lien de celle-ci dans le javascript : Lors du choix du mode sombre, le lien vers la feuille de style sera automatiquement ajoutée à la page, et votre css mode sombre s'appliquera donc.
Je dois avouer que la dernière fois que j'ai touché à un sélecteur de style, il ne liait pas une feuille de style hébergée ailleurs, mais il se contentait de modifier la class du body, et donc tous mes codes css passaient par la feuille de style du forum... Je ne peux donc pas tellement vous aider pour ce côté hébergement ^^"
Quant au javascript pour l'éditeur wysiwyg, le javascript n'est pas mon fort... En théorie, je suppose qu'il "suffit" de récupérer un marqueur du thème sombre (le cookie ? autre chose ?) pour le mettre en condition de déclenchement de la fonction... Relativement simple, mais en pratique, je ne maîtrise pas hyper bien le javascript, et je n'ai pas vraiment assez de temps ni de courage pour me pencher dessus.... Et je pense que quelqu'un de plus compétent que moi pourra le faire bien plus efficacement et rapidement que moi ! ^^"
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Un mode sombre pour AwesomeBB
Et ça marche ! Merci beaucoup, je vais faire tout ça demain !MlleAlys a écrit:Dans le css du mode sombre ^^
Pour ce qui est du reste.... Je vais peut être passer la main !
---
Quant au javascript pour l'éditeur wysiwyg, le javascript n'est pas mon fort... En théorie, je suppose qu'il "suffit" de récupérer un marqueur du thème sombre (le cookie ? autre chose ?) pour le mettre en condition de déclenchement de la fonction... Relativement simple, mais en pratique, je ne maîtrise pas hyper bien le javascript, et je n'ai pas vraiment assez de temps ni de courage pour me pencher dessus.... Et je pense que quelqu'un de plus compétent que moi pourra le faire bien plus efficacement et rapidement que moi ! ^^"
Je ne sais pas si ça peut servir
Mais sur Mobile et Chrome, ça écrit en blanc..... Sur Firefox ou Edge, ça écrit en noir....
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Bonjour,
Je m'excuse pour le double post mais je viens de rencontrer un bug :
Quand je navigue sur mobile, une partie du tableau (uniquement en page d’accueil) passe en fond blanc/gris. Est-il possible de corriger s'il vous plait ?
Et dans les messages privées (boite de réception, messages envoyés, boîte d'envoi et archives) :
Les cases sont en blancs alors qu'elles devraient être de la même couleur que les autres (comme celle juste au dessus).
Et le bouton à côté et tout blanc. J'aimerais l'écriture "Nouveau" et le petit crayon en noir si possible
Et enfin, je voudrais savoir si on peut supprimer complètement la bannière (pas la barre de navigation) ?
Merci par avance
Je m'excuse pour le double post mais je viens de rencontrer un bug :
Quand je navigue sur mobile, une partie du tableau (uniquement en page d’accueil) passe en fond blanc/gris. Est-il possible de corriger s'il vous plait ?
Et dans les messages privées (boite de réception, messages envoyés, boîte d'envoi et archives) :
Les cases sont en blancs alors qu'elles devraient être de la même couleur que les autres (comme celle juste au dessus).
Et le bouton à côté et tout blanc. J'aimerais l'écriture "Nouveau" et le petit crayon en noir si possible
Et enfin, je voudrais savoir si on peut supprimer complètement la bannière (pas la barre de navigation) ?
Merci par avance
Dernière édition par Zlork le Dim 13 Nov 2022 - 17:04, édité 1 fois
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Pour le fond blanc apparaissant en navigation mobile, j'ai ajouté ce code dans le css du mode sombre :
Pour le bouton blanc dans les messages privés, j'ai complété le css déjà présent :
.cp-sidebar a
en :
.cp-sidebar a:not(.btn)
Pour la liste des mp blanche, j'ai complété le css déjà présent :
.forum-section, .posts-section
en :
.forum-section, .posts-section, .notification-row
Pour supprimer la bannière, si vous souhaitez faire disparaitre tout le bloc, titre du forum compris, vous pouvez ajouter ce code css :
Sinon, j'ai retrouvé le vieux code dont je parlais pour choisir un mode sombre ou clair : Il fonctionne non pas avec un menu déroulant mais avec un "interrupteur" (donc seulement deux styles possible, contrairement à celui proposé par forumactif), et ajoute simplement une classe au body : tout le css du mode sombre est à mettre dans le css habituel du forum en précédant les sélecteur par cette class.
(ce qui évite de devoir héberger la feuille de style ailleurs, mais charge un peu plus celle du forum déjà parfois bien fournie).
Le code est vieux et sans doute pas optimal, mais a priori fonctionnel.
- Code:
@media (max-width: 750px) {
.forum-lastpost, .posts-lastpost {
background: none;
}
}
Pour le bouton blanc dans les messages privés, j'ai complété le css déjà présent :
.cp-sidebar a
en :
.cp-sidebar a:not(.btn)
Pour la liste des mp blanche, j'ai complété le css déjà présent :
.forum-section, .posts-section
en :
.forum-section, .posts-section, .notification-row
Pour supprimer la bannière, si vous souhaitez faire disparaitre tout le bloc, titre du forum compris, vous pouvez ajouter ce code css :
- Code:
#header-banner {
display: none;
}
- Code:
#header-banner {
background: no-repeat;
}
Sinon, j'ai retrouvé le vieux code dont je parlais pour choisir un mode sombre ou clair : Il fonctionne non pas avec un menu déroulant mais avec un "interrupteur" (donc seulement deux styles possible, contrairement à celui proposé par forumactif), et ajoute simplement une classe au body : tout le css du mode sombre est à mettre dans le css habituel du forum en précédant les sélecteur par cette class.
(ce qui évite de devoir héberger la feuille de style ailleurs, mais charge un peu plus celle du forum déjà parfois bien fournie).
Le code est vieux et sans doute pas optimal, mais a priori fonctionnel.
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Un mode sombre pour AwesomeBB
MlleAlys a écrit:Pour le fond blanc apparaissant en navigation mobile, j'ai ajouté ce code dans le css du mode sombre :
- Code:
@media (max-width: 750px) {
.forum-lastpost, .posts-lastpost {
background: none;
}
}
Cela a été corrigé, merci !
MlleAlys a écrit:Pour le bouton blanc dans les messages privés, j'ai complété le css déjà présent :
.cp-sidebar a
en :
.cp-sidebar a:not(.btn)
Pour la liste des mp blanche, j'ai complété le css déjà présent :
.forum-section, .posts-section
en :
.forum-section, .posts-section, .notification-row
Pour supprimer la bannière, si vous souhaitez faire disparaitre tout le bloc, titre du forum compris, vous pouvez ajouter ce code css :Si vous souhaitez seulement supprimer l'image de fond et garder le titre du forum :
- Code:
#header-banner {
display: none;
}
- Code:
#header-banner {
background: no-repeat;
}
J'ai un problème. Je ne sais pas si c'est dû à la suppression de la bannière mais pour les MP, j'ai ça :
C'est collé à la barre de navigation.
Les autres pages, c'est la petite publicité qui colle à la barre de navigation mais sinon, c'est OK. Peut-être mettre un espace entre la barre de navigation et le reste du forum ?
Puis le titre du MP est noir. De même pour le menu à côté, quand on clique sur un des 4 onglets, ça devrait s'écrire en blanc et non noir
MlleAlys a écrit:Sinon, j'ai retrouvé le vieux code dont je parlais pour choisir un mode sombre ou clair : Il fonctionne non pas avec un menu déroulant mais avec un "interrupteur" (donc seulement deux styles possible, contrairement à celui proposé par forumactif), et ajoute simplement une classe au body : tout le css du mode sombre est à mettre dans le css habituel du forum en précédant les sélecteur par cette class.
(ce qui évite de devoir héberger la feuille de style ailleurs, mais charge un peu plus celle du forum déjà parfois bien fournie).
Le code est vieux et sans doute pas optimal, mais a priori fonctionnel.
Je suis très intéressé ! Mais il faudra m'expliquer comment faire
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Mince, c'est bien suite à la suppression de la bannière, je n'avais pas pensé aux marges.
Remplacez le code précédent :
Pour le menu à côté des mp, j'ajoute le sélecteur "#privmsgs-menu li" à la liste de tous ceux auxquels ont a déjà appliqué "color: white;".
Pour le titre des mp eux même, c'est un peu étrange, chez moi ils sont bien blancs
Pour l'interrupteur jour/nuit sur mon forum test :
Le javascript, à mettre sur toutes les pages, est le suivant
Le css pour la mise en forme de l'interrupteur, à mettre dans le css du forum :
En thème "nuit", le javascript ajoute la class" darkmode" à la balise "body", c'est à dire à l'ensemble de la page du forum.
A partir de là, il faut modifier votre css pour indiquer au début de chaque élément que c'est seulement dans le cas où la page est en darkmode.
Ce qui donne ce css-ci (que j'ai construit à partir des modifs faites dans ce sujet et qui est actuellement sur mon fo test), à mettre également dans le css de votre forum :
Comme je disais, je ne suis pas certaine que ce soit hyper optimisé, mais c'est relativement simple à gérer et a priori ça fonctionne ^^
ET de ce fait avec cette technique, on peut utiliser la même méthode dans le javascript qui modifiait la couleur de l'éditeur :
Remplacez le code précédent :
- Code:
#header-banner {
display: none;
}
- Code:
#header-banner {
height: 0;
visibility: hidden;
}
Pour le menu à côté des mp, j'ajoute le sélecteur "#privmsgs-menu li" à la liste de tous ceux auxquels ont a déjà appliqué "color: white;".
Pour le titre des mp eux même, c'est un peu étrange, chez moi ils sont bien blancs
Pour l'interrupteur jour/nuit sur mon forum test :
Le javascript, à mettre sur toutes les pages, est le suivant
- Code:
$(function() {
if (my_getcookie("cookiemode")) {
$('body').addClass('darkmode');
}
});
$(function() {
$('body #main-menu').append('<div id="modeselect"> ☼ <label class="switch"><input type="checkbox"><span class="slider"></span></label> ☽ </div>');
if (my_getcookie("cookiemode")) {
$('#modeselect input').prop("checked", true );
}
});
$(function() {
$('#modeselect input').on('change', function() {
$('body').toggleClass('darkmode');
my_setcookie('cookiemode', $('body').attr('class') , { expires : 100 } );
});
});
Le css pour la mise en forme de l'interrupteur, à mettre dans le css du forum :
- Code:
/***************************** DEBUT INTERRUPTEUR DARKMODE **************/
#modeselect {
color: white;
font-size: 20px;
text-align: center;
margin-bottom: 20px;
}
/* The switch - the box around the slider */
.switch {
position: relative;
display: inline-block;
width: 50px;
height: 20px;
vertical-align: middle;
margin: 0 5px;
}
/* Hide default HTML checkbox */
.switch input {
opacity: 0;
width: 0;
height: 0;
}
/* The slider */
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: white;
-webkit-transition: .4s;
transition: .4s;
border-radius: 34px;
}
.slider:before {
position: absolute;
content: "";
height: 16px;
width: 16px;
left: 4px;
bottom: 2px;
background-color: #c7c7c7;
-webkit-transition: .4s;
transition: .4s;
border-radius: 50%;
}
input:checked + .slider {
background-color: #3a474e;
outline: 1pt solid white;
}
input:focus + .slider {
box-shadow: 0 0 1px #2196F3;
}
input:checked + .slider:before {
background:white;
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}
/************************************* FIN INTERRUPTEUR DARKMODE *************************/
En thème "nuit", le javascript ajoute la class" darkmode" à la balise "body", c'est à dire à l'ensemble de la page du forum.
A partir de là, il faut modifier votre css pour indiquer au début de chaque élément que c'est seulement dans le cas où la page est en darkmode.
Ce qui donne ce css-ci (que j'ai construit à partir des modifs faites dans ce sujet et qui est actuellement sur mon fo test), à mettre également dans le css de votre forum :
- Code:
/*************************** CSS DARKMODE *************************/
body.darkmode {
background-color: #2c3e50;
color: #f5f7fa;
}
.darkmode .forum-section, .darkmode .posts-section, .darkmode .notification-row {
background-color: #34495E;
}
.darkmode .forum-header, .darkmode .posts-header {
background-color: #172329;
}
.darkmode #privmsgs-menu li, .darkmode .block-topics .block-topics-posts i, .darkmode .block-topics .block-topics-views i, .darkmode .forum-lastpost-header i, .darkmode .forum-statistics-header i, .darkmode .posts-lastpost-header i, .darkmode .posts-statistics-header i, .darkmode .posts-lastpost i, .darkmode .forum-lastpost-author i, .darkmode .forum-lastpost-location i, .darkmode .forum-lastpost-time i, .darkmode .posts-lastpost-author i, .darkmode .posts-lastpost-time i, .darkmode select, .darkmode .input, .darkmode input, .darkmode .sceditor-container iframe, .darkmode .sceditor-container textarea, .darkmode .inputbox, .darkmode a, .darkmode a:visited, .darkmode .forum-description h3, .darkmode .posts-description h3 {
color: white;
}
.darkmode .forum-description p, .darkmode .posts-description p, .darkmode .forum-statistics-posts span, .darkmode .forum-statistics-topics span, .darkmode .posts-statistics-replies span, .darkmode .posts-statistics-views span, .darkmode .profile-advanced-stats dt span[style*="536482"] {
color: white;
}
.darkmode #tabs ul, .darkmode .tabs ul, .darkmode .box-body, .darkmode .block .block-content, .darkmode .block-subtle, .darkmode .post, .darkmode .post-aside, .darkmode .panel, .darkmode .post-section, .darkmode .fb-or-text, .darkmode .mod-news, .darkmode .mod-news-footer, .darkmode .social_login_group .fb-or-text, .darkmode #chatbox_contextmenu, .darkmode #help-button, .darkmode .fontbutton, .darkmode #header-user img, .darkmode .avatar-big img, .darkmode .avatar-default img, .darkmode .avatar-mini img, .darkmode .cb-avatar img, .darkmode .mod-login-avatar img, .darkmode input, .darkmode .forumline tbody tr, .darkmode .table1 tbody tr, .darkmode .calendar-cell {
background-color: #34495E;
}
.darkmode .select-wrap select:hover, .darkmode .jumpbox-wrap select:hover, .darkmode .quickmod-wrap select:hover {
border-color: #172329;
}
.darkmode .block-market .market-item-price, .darkmode .block .block-secondary-content, .darkmode .block .sub-head, .darkmode .block .block-footer, .darkmode .post-aside, .darkmode .attachbox, .darkmode .box-foot, .darkmode .post-footer, .darkmode .posts-lastpost, .darkmode .quick-reply .textarea, .darkmode .jumpbox-wrap select, .darkmode .quickmod-wrap select, .darkmode .select-wrap select, .darkmode #divcolor, .darkmode #divsmilies, .darkmode #help-button, .darkmode #submit_button, .darkmode .format-message+label, .darkmode #tabs li:hover, .darkmode .tabs li:hover {
background-color: #2c3e50!important;
border-color: #2c3e50;
color: #fff;
}
.darkmode .fa_like_list, .darkmode .fa_dislike_list, .darkmode .option_voters_list, .darkmode blockquote cite {
color: rgba(255,255,255,0.6);
}
.darkmode dl.post-author-details span.label span, .darkmode #block-online .headline a, .darkmode .cp-sidebar a:not(.btn) {
color: white !important;
}
.darkmode blockquote {
background: #2c3e50;
}
.darkmode .btn, .darkmode input[type="submit"], .darkmode input[type="button"] {
background: white;
color: black !important;
}
.darkmode .quick-reply .quick-reply-btn {
background: none;
color: white !important;
}
.darkmode .sceditor-container textarea {
color: white !important;
}
.darkmode .quick-reply-textarea-wrap .sceditor-container {
border: none !important;
}
.darkmode .quick-reply .sceditor-button {
background: white;
}
.darkmode .quick-reply-textarea-wrap .sceditor-container iframe, .darkmode .quick-reply-textarea-wrap .sceditor-container textarea {
background-color: unset !important;
color: white;
}
.darkmode #profile-tab-field-profil dt span, .darkmode #profile-menu a, .darkmode .profile-field label span {
color: white !important;
}
.darkmode .EV_List .EV_Item {
background: #34495E;
}
.darkmode .select-wrap select:hover, .darkmode .jumpbox-wrap select:hover, .darkmode .quickmod-wrap select:hover {
border-color: #172329;
}
.darkmode .date-block {
color: black;
}
.darkmode .block-faq .faq-answer {
background: #2c3e50;
border: none;
}
.darkmode *[style="color:#004599"] { /*couleur d origine*/
color: #5ea7ff !important; /*nouvelle couleur*/
}
@media (max-width: 750px) {
.darkmode .forum-lastpost, .darkmode .posts-lastpost {
background: none;
}
}
/***************************** FIN CSS DARKMODE ******************/
Comme je disais, je ne suis pas certaine que ce soit hyper optimisé, mais c'est relativement simple à gérer et a priori ça fonctionne ^^
ET de ce fait avec cette technique, on peut utiliser la même méthode dans le javascript qui modifiait la couleur de l'éditeur :
- Code:
$(function(){
$(function(){
$(".darkmode .sceditor-container iframe").contents().find("head").append("<style>body,html,code:before,p,table{color:#fff!important;} blockquote,code{color:black;}</style>");
});
});
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Un mode sombre pour AwesomeBB
J'ai testé et ça marche à merveille ! Bien mieux que le script avec la liste déroulante.
Bon, le changement de thème quand on change de page n'est pas invisible, il y a un petit flash blanc qui vient du thème clair mais ce n'est pas trop gênant
J'ai une question. j'ai 13 couleurs à adapter. Faut-il utiliser un script par couleur ? Ou on peut utiliser 13 en un seul ? Si oui, comment ?
Et pour la énième fois, merci beaucoup pour ton aide et ta patience
Bon, le changement de thème quand on change de page n'est pas invisible, il y a un petit flash blanc qui vient du thème clair mais ce n'est pas trop gênant
J'ai une question. j'ai 13 couleurs à adapter. Faut-il utiliser un script par couleur ? Ou on peut utiliser 13 en un seul ? Si oui, comment ?
Et pour la énième fois, merci beaucoup pour ton aide et ta patience
Dernière édition par Zlork le Dim 13 Nov 2022 - 23:10, édité 1 fois
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Pour le petit flash blanc, oui, malheureusement, ça vient du court moment de récupération du cookie et d'application du css, je n'ai aucune idée de s'il est possible d'éviter ça, peut être que quelqu'un de plus doué en javascript saura répondre à cette question... (si solution il y a, je suis preneuse également ! )
Pour les couleurs, si vous voulez modifier chaque couleur spécifiquement par une autre, alors oui, malheureusement en css il faudra autant de code correspondant.
Un javascript pourrait sans doute être plus compact à l'équilibre, je ne sais pas cependant si ça serait intéressant d'un point de vue "lourdeur" de la page... Et pareil que précédemment, pour ce qui est d'écrire des javascripts, je vais laisser le soin à quelqu'un d'autre de répondre ^^"
Pour les couleurs, si vous voulez modifier chaque couleur spécifiquement par une autre, alors oui, malheureusement en css il faudra autant de code correspondant.
Un javascript pourrait sans doute être plus compact à l'équilibre, je ne sais pas cependant si ça serait intéressant d'un point de vue "lourdeur" de la page... Et pareil que précédemment, pour ce qui est d'écrire des javascripts, je vais laisser le soin à quelqu'un d'autre de répondre ^^"
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Un mode sombre pour AwesomeBB
MlleAlys a écrit:Pour les couleurs, si vous voulez modifier chaque couleur spécifiquement par une autre, alors oui, malheureusement en css il faudra autant de code correspondant.
Alors, j'ai essayé cet CSS avec cette couleur par exemple :
- Code:
.darkmode *[style="color:##660000"] { /*couleur d origine*/
color: #a00000 !important; /*nouvelle couleur*/
}
Et ça ne marche pas
Les couleurs que je souhaite adapter viennent du BBCode :
Je précise car je ne sais pas si ces couleurs viennent du CSS ?
Après s'il faut absolument passer par un script, j'attends s'il y a un expert prêt à m'aider
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Il est écrit dans votre code "color:##660000" avec deux "#" dans le code couleur au lieu de un seul.
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Un mode sombre pour AwesomeBB
MlleAlys a écrit:Il est écrit dans votre code "color:##660000" avec deux "#" dans le code couleur au lieu de un seul.
J'ai bien corrigé et toujours pas
Ca marche chez vous ?
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Effectivement, dans les messages, le code correspondant aux couleurs appliquées via l'éditeur est en fait le suivant :
Le code précédent fonctionnait pour les couleurs des groupes.
- Code:
.darkmode *[color="#660000"] {
color: #a00000 !important;
}
Le code précédent fonctionnait pour les couleurs des groupes.
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Un mode sombre pour AwesomeBB
MlleAlys a écrit:Effectivement, dans les messages, le code correspondant aux couleurs appliquées via l'éditeur est en fait le suivant :
- Code:
.darkmode *[color="#660000"] {
color: #a00000 !important;
}
Le code précédent fonctionnait pour les couleurs des groupes.
Toujours pas
La couleur change bien dans la liste des couleurs BBCode mais pas dans le texte....
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Auriez-vous un lien vers le message concerné ?
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Un mode sombre pour AwesomeBB
MlleAlys a écrit:Auriez-vous un lien vers le message concerné ?
> https://jeuxvideo-club.forumactif.com/
Page d'accueil en haut, juste en dessous de la barre des navigations.
Invité- Invité
Re: Un mode sombre pour AwesomeBB
Ah, l'éditeur de la PA n'est pas le même que celui des messages, il faut un code encore différent... ^^"
Voici le code :
En fait, si on réunit les trois versions de ce code qui correspond chaque fois à la même couleur (rouge foncé), on peut les fusionner ainsi, en séparant les différents sélecteurs par une virgule :
Voici le code :
- Code:
.darkmode *[style="color: rgb(102, 0, 0);"] {
color: #a00000 !important;
}
En fait, si on réunit les trois versions de ce code qui correspond chaque fois à la même couleur (rouge foncé), on peut les fusionner ainsi, en séparant les différents sélecteurs par une virgule :
- Code:
.darkmode *[style="color: rgb(102, 0, 0);"], .darkmode *[style="color:#660000"], .darkmode *[color="#660000"] {
color: #a00000 !important;
}
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Un mode sombre pour AwesomeBB
MlleAlys a écrit:Ah, l'éditeur de la PA n'est pas le même que celui des messages, il faut un code encore différent... ^^"
Voici le code :
- Code:
.darkmode *[style="color: rgb(102, 0, 0);"] {
color: #a00000 !important;
}
En fait, si on réunit les trois versions de ce code qui correspond chaque fois à la même couleur (rouge foncé), on peut les fusionner ainsi, en séparant les différents sélecteurs par une virgule :
- Code:
.darkmode *[style="color: rgb(102, 0, 0);"], .darkmode *[style="color:#660000"], .darkmode *[color="#660000"] {
color: #a00000 !important;
}
A première vue, ça a l'air de fonctionner !
Je testerai mieux demain avec tous les couleurs et je vous dis.
Et je vous dirai si le script pour l'écriture en blanc marche ou pas :
- Code:
$(function(){ $(function(){ $(".darkmode .sceditor-container iframe").contents().find("head").append("<style>body,html,code:before,p,table{color:#fff!important;} blockquote,code{color:black;}</style>"); });});
En attendant, merci beaucoup. On a vraiment fait le plus gros !
Invité- Invité
Page 1 sur 2 • 1, 2
Sujets similaires
» [AwesomeBB] Mode sombre pour le chatbox
» [AwesomeBB] Problème avec l'intégration d'un bouton mode sombre
» Mode Sombre pour Phpbb2
» Mode nuit-sombre
» Mode sombre pour les forums Forumactif
» [AwesomeBB] Problème avec l'intégration d'un bouton mode sombre
» Mode Sombre pour Phpbb2
» Mode nuit-sombre
» Mode sombre pour les forums Forumactif
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 2
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum