Theme Sombre Pour le forum (V1)

Parce qu'il n'y a pas que les jeux vidéos et HyperSpin dans la vie...forum libre.

Modérateurs : kefran69, Modérateurs

Avatar de l’utilisateur
Doctor
Gourou
Gourou
Messages : 574
Inscription : 29 nov. 2013 - 00:00
Localisation : Cherbourg-en-Cotentin
A remercié : 1 fois
A été remercié : 20 fois

Theme Sombre Pour le forum (V1)

Message par Doctor » 23 oct. 2019 - 15:59

Bonjours les gents ! Aalors comme j'était parti pour faire un thème sombre pour la Bd j'me suis dit que j'allais faire pareil pour le forum ^^

Voici ce que ça donne

Image
Image

et maintenant voila comment faire !

1 : Installer cette extensions
https://chrome.google.com/webstore/deta ... gmne?hl=fr
ou
https://addons.mozilla.org/fr/firefox/addon/styl-us/

2 : Une fois installé vous cliqué sur l'addon et vous cliquez sur
Écrire un style pour :
forumhfsplay.fr


(cliquez bien sur le premier mot du lien [forum en l’occurrence])

3 : Vous copiez le code en dessous et le collez dans la zone de texte

4 : c'est fait !


* {
color: #858585 !important;
background-color: rgba(117, 74, 74, 0) !important;
border-color: #000 !important;
border-top-color: #000 !important;
border-bottom-color: #000 !important;
border-left-color: #000 !important;
border-right-color: #000 !important;
}

body {
background: #0b0b0b !important;
}

a,
a * {
color: #764811 !important;
}

a:hover,
a:hover *,
a:visited:hover,
a:visited:hover *,
span[onclick]:hover,
div[onclick]:hover,
[role="link"]:hover,
[role="link"]:hover *,
[role="button"]:hover *,
[role="menuitem"]:hover,
[role="menuitem"]:hover *,
.link:hover,
.link:hover * {
color: #dc7300 !important;
}

a:visited,
a:visited * {
color: #6c6c6c !important;
}

a.highlight,
a.highlight *,
a.active,
a.active *,
.selected,
.selected *,
[href="#"] {
color: #b4b4b4 !important;
font-weight: bold !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
h1 *,
h2 *,
h3 *,
strong,
[id*="headline"],
[class*="headline"],
[id*="header"],
[class*="header"],
[class*="header"] td {
color: #b4b4b4 !important;
}

a h1,
a h2,
a h3,
a h4,
a h5,
a h6,
h1 a,
h2 a,
h3 a,
a strong,
a[id*="headline"],
a[class*="headline"],
a[id*="header"],
a[class*="header"] {
text-decoration: underline !important;
}

[class*="error"],
[class*="alert"],
code,
span[onclick],
div[onclick] {
color: #900 !important;
}

::-moz-selection {
background: #b4b4b4 !important;
color: #000 !important;
}

::selection {
background: #b4b4b4 !important;
color: #000 !important;
}

:focus {
outline: none !important;
}


/*----- MENU & CO BACKGROUND-COLORS -----*/
div[style="display: block;"],
div[role="navigation"] {
background: rgba(0, 0, 0, .5) !important;
}

table {
background: rgba(40, 30, 30, .6) !important;
border-radius: 6px !important;
}

table > tbody > tr:nth-child(even),
table > tbody > tr > td:nth-child(even) {
background-color: rgba(0, 0, 0, .2) !important;
}

iframe,
embed,
nav,
label [onclick],
nav ul,
div[style*="position:"][style*="left:"][style*="visible"],
div[style*="z-index:"][style*="left:"][style*="visible"],
div[style*="-moz-user-select"],
div[role="menu"],
div[role="dialog"],
span[class*="script"] div,
[id*="menu"],
[id*="Menu"],
[class*="dropdown"],
[class*="popup"],
[class="title"],
ul[style*="display:"],
ul[style*="visibility:"] ul,
[id*="nav"] ul,
[class*="nav"] ul,
ul[class*="menu"],
a[onclick][style*="display"],
a[id*="ghosteryfirefox"],
#ghostery-purple-bubble,
#translator-popup,
.menu,
.tooltip,
.hovercard,
.vbmenu_popup {
background: rgba(5, 5, 5, .9) !important;
border-radius: 5px;
box-shadow: 1px 1px 5px #000 !important;
}

header,
#header,
footer,
#footer {
background: rgba(19, 19, 19, .9) !important;
box-shadow: 0 0 5px #000 !important;
}

body > #dialog,
body > .xenOverlay {
background: rgba(19, 19, 19, .96) !important;
background-clip: padding-box !important;
box-shadow: 0 0 15px #000, inset 0 0 0 1px rgba(200, 200, 200, .5), inset 0 0 5px #111 !important;
border: 10px solid rgba(99, 99, 99, .7) !important;
border-radius: 0 !important;
}

[id*="overlay"],
[id*="lightbox"],
blockquote {
background-color: rgba(35, 35, 35, .9) !important;
border-radius: 5px;
}

pre,
dl,
.Message code {
background-color: rgba(5, 5, 5, .5) !important;
}

input,
select,
button,
[role="button"],
a.button,
a.submit,
a.BigButton,
a.TabLink,
.install[onclick] {
-moz-appearance: none !important;
-webkit-appearance: none !important;
transition: border-color 0.5s !important;
color: #696969 !important;
border: 2px solid #333 !important;
border-radius: 8px !important;
box-shadow: 0 0 2px rgba(0, 0, 0, .9) !important;
}

a[href="javascript:;"],
a[class*="button"]:not(:empty),
a[id*="button"]:not(:empty),
a[id*="Button"]:not(:empty),
div[class*="button"][onclick] {
transition: border-color 0.3s !important;
background: #060606 !important;
color: #BBB !important;
text-shadow: 0 1px #000 !important;
border-color: #333 !important;
box-shadow: 0 0 2px rgba(0, 0, 0, .9) !important;
}

a[href="javascript:;"]:hover,
a[class*="button"]:not(:empty):hover,
a[id*="button"]:hover,
a[id*="Button"]:not(:empty):hover,
div[class*="button"][onclick]:hover {
background: #151515 !important;
color: #FFF !important;
}

input *,
select *,
button *,
a.button *,
a.submit * {
color: #BBB !important;
text-shadow: none !important;
}

input:hover,
input[type="button"]:hover,
select:hover,
button:hover,
[role="button"]:hover,
a.button:hover,
a.submit:hover,
a.BigButton:hover,
a.TabLink:hover {
border: 2px solid #555 !important;
border-top-color: #555 !important;
border-bottom-color: #555 !important;
border-left-color: #555 !important;
border-right-color: #555 !important;
}

input:focus,
select:focus {
box-shadow: 0 0 5px #485050 !important;
}

input *:hover * {
color: #F0F0F0 !important;
text-shadow: 0 0 2px #FFF !important;
}

input[disabled],
select[disabled],
button[disabled],
input[disabled]:hover,
select[disabled]:hover,
button[disabled]:hover,
input[disabled]:focus,
select[disabled]:focus,
button[disabled]:focus {
opacity: 0.5 !important;
border-color: #333 !important;
}

input[type="checkbox"] {
border-radius: 1px !important;
}

input[type="radio"],
input[type="radio"]:focus {
border-radius: 100% !important;
}

input[type="checkbox"],
input[type="radio"] {
min-width: 12px;
min-height: 12px;
}

input[type="checkbox"]:checked,
input[type="radio"]:checked {
border-color: #966a0a !important;
box-shadow: 0 0 5px #a12d03 !important;
}

select {
padding-right: 15px !important;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAECAYAAABCxiV9AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAeSURBVBhXY5g5c+Z/BiwALo6uAEMDTACXSWgSDAwA4jATh950E30AAAAASUVORK5CYII=) no-repeat right 4px center #060606 !important;
transition: border-color 0.3s, background-position 0.3s !important;
}

button:active,
input[type="submit"]:active,
input[type="button"]:active,
a.button:active,
a[class*="button"]:not(:empty):active,
a.submit:active,
a.BigButton:active,
a.TabLink:active,
.Active .TabLink {
background: #292929 !important;
color: #FFF !important;
}

textarea {
-moz-appearance: none !important;
-webkit-appearance: none !important;
background: rgba(0, 0, 0, .3) !important;
border-radius: 3px !important;
border: 1px solid #000 !important;
box-shadow: inset 0 0 8px #000 !important;
transition: border-color, background, 0.3s !important;
}

textarea,
textarea * {
color: #C8C8C8 !important;
text-shadow: 0 0 1px gray !important;
}

textarea:hover,
textarea:focus:hover {
border-color: #333 !important;
}

textarea:focus {
background: rgba(0, 0, 0, .5) !important;
border-color: #222 !important;
}

textarea:focus,
textarea:focus > * {
text-shadow: none !important;
box-shadow: none !important;
}

option,
optgroup {
-moz-appearance: none !important;
-webkit-appearance: none !important;
background: none !important;
color: #666 !important;
}

optgroup {
background: #222 !important;
color: #DDD !important;
}

option:not([disabled]):hover,
option:focus,
option:checked {
background: linear-gradient(#333, #292929) !important;
color: #DDD !important;
}

body,
*:not(:empty):not(html):not(span):not(a):not(b):not(option):not(select):not(img):not([style="display: block;"]):not([onclick*="open"]):not([onclick*="s_objectID"]):not([class*="stars"]):not([id*="stars"]):not([id="rating"]):not([class="rating"]):not([class*="SPRITE"]):not([id*="SPRITE"]):not([class*="item"]):not([id*="item"]):not([class*="thumb"]):not([class*="icon"]):not([class*="photo"]):not(.view):not(.text):not([id*="lbImage"]):not([class*="cc-in"]):not([class*="gr-body"]):not([id*="watch"]):not(#globalsearch),
.r3_hm,
.gmbutton2 b,
.gtab-i,
.ph,
.bstab-iLft,
.csb,
#pagination div,
[style*="sprite2.png"],
#mw-head-base,
#mw-page-base {
background-image: none !important;
}

img {
opacity: .8 !important;
transition: opacity .5s;
}

img:hover,
a:hover img,
#mpiv-popup {
opacity: 1 !important;
}
Bien sur c'est pas parfait , mais justement si vous voulez le modifier ou l’améliorer n’hésitez pas ^^
Il faut profiter de la vie, je me tue à le dire !

Avatar de l’utilisateur
wildpumpk1n
Connaisseur
Connaisseur
Messages : 421
Inscription : 04 févr. 2018 - 19:01
Localisation : Région Parisienne
A remercié : 123 fois
A été remercié : 62 fois

Re: Theme Sombre Pour le forum (V1)

Message par wildpumpk1n » 23 oct. 2019 - 16:09

Oh c'est top! Tain y'a vraiment pas mal de chose top en ce moment :)

Perso' le fond un peu plus gris que noir et ca serait parfait :)

Avatar de l’utilisateur
Doctor
Gourou
Gourou
Messages : 574
Inscription : 29 nov. 2013 - 00:00
Localisation : Cherbourg-en-Cotentin
A remercié : 1 fois
A été remercié : 20 fois

Re: Theme Sombre Pour le forum (V1)

Message par Doctor » 23 oct. 2019 - 17:45

ligne 12 tu modifie
#0b0b0b
par
#0b0b0beb

:)
Il faut profiter de la vie, je me tue à le dire !

Avatar de l’utilisateur
wildpumpk1n
Connaisseur
Connaisseur
Messages : 421
Inscription : 04 févr. 2018 - 19:01
Localisation : Région Parisienne
A remercié : 123 fois
A été remercié : 62 fois

Re: Theme Sombre Pour le forum (V1)

Message par wildpumpk1n » 23 oct. 2019 - 18:22

Ah c'est top, c'est fou ce truc :) Faudra juste que je trouve comment mettre le texte un chouille plus blanc Et Bim

Avatar de l’utilisateur
Doctor
Gourou
Gourou
Messages : 574
Inscription : 29 nov. 2013 - 00:00
Localisation : Cherbourg-en-Cotentin
A remercié : 1 fois
A été remercié : 20 fois

Re: Theme Sombre Pour le forum (V1)

Message par Doctor » 23 oct. 2019 - 20:34

Ligne 2 tu met #d6d6d6 a la place de #858585
Il faut profiter de la vie, je me tue à le dire !

Avatar de l’utilisateur
bakaskal
Virtuose
Virtuose
Messages : 1316
Inscription : 08 nov. 2017 - 05:32
Localisation : Compiègne,Oise
A remercié : 475 fois
A été remercié : 406 fois

Re: Theme Sombre Pour le forum (V1)

Message par bakaskal » 23 oct. 2019 - 21:10

wildpumpk1n a écrit :
23 oct. 2019 - 18:22
Ah c'est top, c'est fou ce truc :) Faudra juste que je trouve comment mettre le texte un chouille plus blanc Et Bim
Punaise les gars vous sortez de vos cercueils tous les matins ?!!!!

Image

Avatar de l’utilisateur
wildpumpk1n
Connaisseur
Connaisseur
Messages : 421
Inscription : 04 févr. 2018 - 19:01
Localisation : Région Parisienne
A remercié : 123 fois
A été remercié : 62 fois

Re: Theme Sombre Pour le forum (V1)

Message par wildpumpk1n » 23 oct. 2019 - 21:19

bakaskal a écrit :
23 oct. 2019 - 21:10
wildpumpk1n a écrit :
23 oct. 2019 - 18:22
Ah c'est top, c'est fou ce truc :) Faudra juste que je trouve comment mettre le texte un chouille plus blanc Et Bim
Punaise les gars vous sortez de vos cercueils tous les matins ?!!!!
Bouaaaahhhhhhhhh :mrgreen:

Image

Avatar de l’utilisateur
serviettzky62
Connaisseur
Connaisseur
Messages : 247
Inscription : 29 juin 2018 - 10:36
Localisation : Divion, Pas-De-Calais
A remercié : 27 fois
A été remercié : 38 fois

Re: Theme Sombre Pour le forum (V1)

Message par serviettzky62 » 24 oct. 2019 - 18:44

Génial ca marche impec, ca sooo 2019 ;) : mes yeux te remercient :geek:

Avatar de l’utilisateur
toddwarch
noob
noob
Messages : 1
Inscription : 11 nov. 2019 - 03:57

Re: Theme Sombre Pour le forum (V1)

Message par toddwarch » 11 nov. 2019 - 03:59

Génial ca marche.
lenny face

Répondre

Revenir à « Forum Libre »