Page 11 sur 14

Re: Un Thème pour le forum

Publié : 05 Mars 2016 14:25
par Max
Bon, je viens d'essayer, et tout semble fonctionner. ;)
Pitou a écrit :J'ai juste un problème avec les bulles de discutions dans les listes de sujets qui disparaissent lors de ma prévisualisation, alors que je ne touche pas à leurs paramètres :nono:
Par contre, sur ce point j'ai pas trop compris, si tu pouvait m'en dire plus (ou un petit screen)

Re: Un Thème pour le forum

Publié : 05 Mars 2016 19:12
par Pitou
Je viens de comprendre d'où venais mon problème :
Je voyais la page comme ceci :
Image
C'était du au fait que j'importais mon css en plus, et je désactivais seulement l'autre au lieu de le modifier par le mien (sous firefox). (bref, c'est ma faute :perv: )
Effectivement, il n'y a pas de problème !
Image

Petite correction, j'ai oublié la page pour poster et les zones de code : :gene:

colours.css :

Code : Tout sélectionner

/*
--------------------------------------------------------------
Colours and backgrounds for common.css
--------------------------------------------------------------
*/

html, body {
   color: #ffffff;
   background-color: #0B1725;
}

h1 {
   color: #FFFFFF;
}

h2 {
   color: #F5F4F4;
}

h3 {
   /*border-bottom-color: #DADADA;*/
}

hr {
   border-color: #F5F5F5;
   border-top-color: #F5F5F5;
}

/* Search box
--------------------------------------------- */

.search-box .inputbox,
.search-box .inputbox:hover,
.search-box .inputbox:focus,
.search-box .button:hover {
   border-color: #DADADA;
}

.search-header input#keywords {
   background-color: #222C37;
   color: #8494A3;
}

/* Round cornered boxes and backgrounds
---------------------------------------- */
#wrap {
}

.headerbar {
}

.navbar {
}

.navbar ul#nav-main {
   background-color: #3C4855;
   border-bottom-color: #54606E;
}

.forabg {
   background-color: #162331;
}

.forumbg {
   background-color: #162331;
}

.panel {
   background-color: #3C4855;
}

.post:target .content {
   color: #FFFFFF;
}

.post:target h3 a {
   color: #000000;
}

.bg1 {
   background-color: #3C4855;
}

table.zebra-list tr:nth-child(odd) td, ul.zebra-list li:nth-child(odd) {
   background-color: #FBFBFB;
}

.bg2 {
   background-color: #3C4855;
}

table.zebra-list tr:nth-child(even) td, ul.zebra-list li:nth-child(even) {
   background-color: #EAEDF1;
}

.bg3   {
   background-color: #3C4855;
}

.ucprowbg {
   background-color: #DCDEE2;
}

.fieldsbg {
   background-color: #E7E8EA;
}

/* Horizontal lists
----------------------------------------*/

ul.navlinks {
   border-top-color: #FFFFFF;
}

/* Table styles
----------------------------------------*/
table.table1 thead th {
   color: #FFFFFF;
}

table.table1 tbody tr {
   border-color: #F5F5F5;
}

table.table1 tbody tr:hover, table.table1 tbody tr.hover {
   color: #000;
}

table.table1 td {
   color: #FFFFFF;
}

table.table1 tbody td {
   border-top-color: #F5F5F5;
}
.section-viewonline table.table1 tbody td,
.section-memberlist table.table1 tbody td {
   border-top-color: #F5F5F5;
}

table.table1 tbody th {
   border-bottom-color: #000000;
   color: #333333;
   background-color: #FFFFFF;
}

table.info tbody th {
   color: #000000;
}

/* Misc layout styles
---------------------------------------- */
dl.details dt {
   color: #000000;
}

dl.details dd {
   color: #828282;
}

.sep {
   color: #1198D9;
}

/* Pagination
---------------------------------------- */

.pagination li a {
   background-color: #EBEBEB;
   color: #555555;
}

.pagination li.ellipsis span {
   background-color: transparent;
   color:   #000000;
}

.pagination li.active span {
   background-color: #727D89;
   border-color: #005554;
   color: #FFFFFF;
}

.pagination li a:hover, .pagination .dropdown-visible a.dropdown-trigger, .nojs .pagination .dropdown-container:hover a.dropdown-trigger {
   background-color: #727D89;
   color: #F5F5F5;
}

/*.pagination li.next a, .pagination li.previous a, .pagination li.page-jump a {
   
}*/

/* Pagination in viewforum for multipage topics */
.row .pagination:before {
   content: "\f0c5";
   font-family: FontAwesome;
}

/* Miscellaneous styles
---------------------------------------- */

#prefooter + .copyright {
   background-color: #026766;
}
.copyright {
   background-color: #0B1725;
}

.error {
   color: #BC2A4D;
}

.reported {
    background-color: #FFFFFF;
}
li.reported {
       background-color: #FFF1EA;
}
li.reported + li.reported {
   border-top: 0 !important;
}
li.reported:hover {
   background-color: #FFF !important;
}
.sticky, .announce {
   /* you can add a background for stickies and announcements*/
}

div.rules {
   background-color: #EBEBEB;
}

p.post-notice {
   background-color: #ECD5D8;
   background-image: none;
}

p.post-notice.deleted:before {
   font-family: FontAwesome;
   content: "\f1b8";
   font-size: 14px;
   color: #3CA83C;
}

p.post-notice.unapproved:before {
   font-family: FontAwesome;
   content: "\f059";
   font-size: 14px;
   color: #5D8DFF;
}

p.post-notice.reported:before, p.post-notice.error:before {
   font-family: FontAwesome;
   content: "\f071";
   font-size: 14px;
   color: #FD5E01;
}
p.post-notice.reported {
   border-color: transparent;
}

/*
--------------------------------------------------------------
Colours and backgrounds for links.css
-------------------------------------------------------------- */

a {color: #F5F4F4;}
a:hover   { text-decoration: underline; }


a.forumtitle {
   color: #FFFFFF;
   font-weight: bold;
}
a.topictitle {
   color: #FFFFFF;
}   

/* Links on gradient backgrounds */
.forumbg .header a, .forabg .header a, th a {
   color: #FFFFFF;
}

.forumbg .header a:hover, .forabg .header a:hover, th a:hover {
   
}

.navbar ul#nav-main > li > a {
    color: #ffffff;
    font-weight: bold;
}
.navbar ul#nav-main > li:not(.rightside) > a:hover,
.navbar ul#nav-main > li.icon-register > a:hover,
.navbar ul#nav-main > li.icon-logout > a:hover {
   background-color: #162331;
   border-bottom-color: #3E4D5D;
}

/* Notification mark read link */
.dropdown-extended a.mark_read {
   background-color: #FFFFFF;
}

/* Post body links */
.postlink {
   /*border-bottom-color: #368AD2;
   color: #368AD2;*/
}

.postlink:visited {
   /*border-bottom-color: #5D8FBD;
   color: #5D8FBD;*/
}

.postlink:hover {
   /*background-color: #D0E4F6;
   color: #0D4473;*/
}

.signature a, .signature a:hover {
   background-color: transparent;
}

/* Back to top of page */
a.top {
   color: #A7A7AA;
}
a.top:before {
   font-family: FontAwesome;
   content: "\f139";
   display: inline-block;
   color: #A7A7AA;
}

a.top2 {
   color: #139895;
}
a.top2:before {
   font-family: FontAwesome;
   content: "\f139";
   display: inline-block;
   color: #A7A7AA;
   font-size: 12px;
   width: 14px;
   padding: 0 1px;
}

/* Arrow links  */
a.arrow-up:before         { content: "\f102"; }
a.arrow-down:before         { content: "\f103"; }
a.arrow-left:before         { content: "\f100"; }
a.arrow-right:after         { content: "\f101"; }

a.arrow-up:hover {
   background-color: transparent;
}

a.arrow-left:hover {
   
}

a.arrow-right:hover {
   
}

/*
--------------------------------------------------------------
Colours and backgrounds for content.css
-------------------------------------------------------------- */

ul.forums {
   background-color: #3C4855;
}

ul.topiclist li {
   color: #C6C9CD;
}
#cp-main ul.topiclist li.header {
   background-color: #005554;
   color: #FFFFFF;
}

ul.topiclist dd {

}

.rtl ul.topiclist dd {
   border-right-color: transparent;
   border-left-color: transparent;
}

ul.topiclist li.row dt a.subforum.read:before {
   content:"\f15b";
   color: #D5D8D9;
}

ul.topiclist li.row dt a.subforum.unread:before {
   content:"\f15b";
   color: #FD5E01;
}

li.row {
   border-bottom-color: #79bfb5;
}

li.row strong {
   color: #C6C9CD;
}

li.row:hover {
   background-color: #556372;
}

li.row:hover dd {
   border-left-color: transparent;
}

.rtl li.row:hover dd {
   border-right-color: transparent;
   border-left-color: transparent;
}

li.header dt {
   color: #FFFFFF;
}
li.header dd {
   color: #FFFFFF;
}

/* Post body styles
----------------------------------------*/
.postbody {
   color: #C6C9CD;
}

/* Content container styles
----------------------------------------*/
.content {
   color: #ffffff;
}

.content h2, .panel h2 {
   border-bottom-color:  transparent;
}

dl.faq dt {
   color: #FFFFFF;
}

.posthilit {
   background-color: #F3BFCC;
   color: #BC2A4D;
}

.announce, .unreadpost {
   /* Highlight the announcements & unread posts box */
}

/* Post signature */
.signature {
   border-top-color: #F5F5F5;
}

/* Post noticies */
.notice {
   border-top-color:  #F5F5F5;
}

/* BB Code styles
----------------------------------------*/
/* Quote block */
blockquote {
   background-color: #556372;
   border-color: #00A0A0;
}

.rtl blockquote {
   
}

blockquote blockquote {
   /* Nested quotes */
   background-color: #F5F5F5;
}

blockquote blockquote blockquote {
   /* Nested quotes */
   background-color: #FFFFFF;
}

/* Code block */
.codebox {
   background-color: #556372;
   border-color: #00A0A0;
}

.codebox p {
   border-bottom-color:  #CCCCCC;
}

.codebox code {
   color: #FFFFFF;
}

.syntaxbg      { color: #FFFFFF; }
.syntaxcomment   { color: #FF8000; }
.syntaxdefault   { color: #0000BB; }
.syntaxhtml      { color: #000000; }
.syntaxkeyword   { color: #007700; }
.syntaxstring   { color: #DD0000; }

/* Attachments
----------------------------------------*/
.attachbox {
   background-color: #FFFFFF;
   border-color:  #C9D2D8;
}

.pm-message .attachbox {
   background-color: #F2F3F3;
}

.attachbox dd {
   border-top-color: #EBEBEB;
}

.attachbox p {
   color: #666666;
}

.attachbox p.stats {
   color: #666666;
}

.attach-image img {
   border-color: #999999;
}

/* Inline image thumbnails */

dl.file dd {
   color: #666666;
}

dl.thumbnail img {
   border-color: #666666;
   background-color: #FFFFFF;
}

dl.thumbnail dd {
   color: #666666;
}

dl.thumbnail dt a:hover {
   background-color: #EEEEEE;
}

dl.thumbnail dt a:hover img {
   border-color: #368AD2;
}

/* Post poll styles
----------------------------------------*/

fieldset.polls dl {
   border-top-color: #F5F5F5;
   color: #FFFFFF;
}

fieldset.polls dl.voted {
   color: #000000;
}

fieldset.polls dd div {
   color: #FFFFFF;
}

.rtl .pollbar1, .rtl .pollbar2, .rtl .pollbar3, .rtl .pollbar4, .rtl .pollbar5 {
   border-right-color: transparent;
}

.pollbar1 {
   background-color: #556372;
   border-bottom-color: #556372;
   border-right-color: #556372;
}

.rtl .pollbar1 {
   border-left-color: #556372;
}

.pollbar2 {
   background-color: #556372;
   border-bottom-color: #556372;
   border-right-color: #556372;
}

.rtl .pollbar2 {
   border-left-color: #556372;
}

.pollbar3 {
   background-color: #556372;
   border-bottom-color: #556372;
   border-right-color: #556372;
}

.rtl .pollbar3 {
   border-left-color: #556372;
}

.pollbar4 {
   background-color: #556372;
   border-bottom-color: #556372;
   border-right-color: #556372;
}

.rtl .pollbar4 {
   border-left-color: #556372;
}

.pollbar5 {
   background-color: #556372;
   border-bottom-color: #556372;
   border-right-color: #556372;
}

.rtl .pollbar5 {
   border-left-color: #556372;
}

/* Poster profile block
----------------------------------------*/
.postprofile {
   color: #ffffff;
   border-color: #FFFFFF;
}

.pm .postprofile {
   border-color: #FFFFFF;
}

.postprofile strong {
   color: #ffffff;
}

.online {
   background-image: none;
}

dd.profile-warnings {
   color: #BC2A4D;
}

/*
--------------------------------------------------------------
Colours and backgrounds for buttons.css
-------------------------------------------------------------- */
.button {
   background-color: #3C4855;
   color: #FFFFFF;
}
.search-box button.search-icon {
   background-color: #3C4855;
}
.headerbar .search-box button.search-icon {
   background-color: #3C4855;
}
.headerbar .search-box button.search-icon:hover,
.headerbar .search-box input#keywords:focus + button.search-icon {
   background-color: #222C37;
}
.headerbar .search-box button.search-icon:hover:before,
.headerbar .search-box input#keywords:focus + button.search-icon:before {
   opacity: 1;
}
.search-box a.button.search-adv-icon {
   background-color: #3C4855;
}
.headerbar .search-box a.button.search-adv-icon:hover,
.headerbar .search-box input#keywords:focus + button.search-icon {
   background-color: #222C37;
}


.post-icon, .newpm-icon, .reply-all,
.reply-icon,
.pmreply-icon, .forwardpm-icon {
   background-color: #3C4855;
   border: solid 3px #3C4855;
}
.post-icon:hover, .newpm-icon:hover, .reply-all:hover,
.reply-icon:hover,
.pmreply-icon:hover, .forwardpm-icon:hover {
   background-color: #FFFFFF !important;
   border-color: #3C4855;
   color: #3C4855;
}
form#login p > .button2 {
   background-color: #FF3800;
   border: 3px solid #FF3800;
   color: #FFFFFF;
}
form#login p > .button2:hover {
   background-color: #FFFFFF;
   border: 3px solid #FF3800;
   color: #FF3800;
}
.dropdown-select {
   color: #FFFFFF;
}

.button:hover, .dropdown-visible .dropdown-select, .nojs .dropdown-container:hover .dropdown-select {
   background-color: #727D89;
}

.dropdown-select:after   {border-color: #556372;}
.dropdown-select:hover   {border-color: #9ACCC8;}

.dropdown-visible .dropdown-select, .dropdown-visible .dropdown-select:hover, .nojs .dropdown-container:hover .dropdown-select {
   border-color: #A6B2BA;
   color: #FFFFFF;
}

.contact-icons a      { border-color: #EBEBEB; }
.contact-icons a:hover   { background-color: #EAEDF1; }

/* Icon images
---------------------------------------- */

.icon-acp:before, #nav-main > .icon-acp > a:before, .icon-faq > a:before, .icon-home:before, .icon-logout:before, #nav-main > .icon-logout > a:before, .icon-mcp > a:before, .icon-notification > a:first-child:before, .icon-pm > a:first-child:before, .icon-register > a:before {
   color: #79BFB5;
}
.icon-bookmark:before, .icon-bump:before, .icon-contact:before, .icon-delete-cookies:before, .icon-download:before, .dropdown-contents .icon-logout:before, .icon-mark:before, .icon-members:before, .icon-pages:before, .icon-print:before, .icon-profile:before, .icon-search:before, .responsive-search a:before, .icon-search-active:before, .icon-search-new:before, .icon-search-self:before, .icon-search-unanswered:before, .icon-search-unread:before, .icon-sendemail:before, .icon-subscribe:before, .icon-team:before, .icon-ucp:before, .icon-unsubscribe:before {
   color: #A7A7A7;
}
.dropdown-contents > .small-icon.clone a:before,
.dropdown-contents > .clone:before,
.dropdown-contents > .small-icon.clone:before {
   color: #A7A7A7;
}
#page-footer-links li:not(.clone):before {
   color: #79BFB5;
}

#nav-main > .icon-acp > a:before      { content:"\f135" !important; }
#nav-main > .icon-acp:before      { content: none !important; }
.icon-acp:before      { content:"\f135" !important; }
.icon-bookmark:before      { content:"\f02e" !important; }
.icon-bump:before         { content:"\f256" !important; }
.icon-contact:before      { content:"\f0e0" !important; }
.icon-delete-cookies:before   { content:"\f1f8" !important; }
.icon-download            { background-image: url("./images/icon_download.gif"); }
.icon-faq > a:before      { content:"\f059" !important; }
.icon-logout:before         { content:"\f011" !important; }
#nav-main > .icon-logout > a:before      { content:"\f084" !important; }
#nav-main > .icon-logout:before         { content: none !important; }
.icon-mark:before         { content:"\f058" !important; }
.icon-mcp > a:before      { content:"\f06e" !important; }
.icon-members:before      { content:"\f007" !important; }
.icon-notification         { background-image: none; }
.icon-notification > a:first-child:before   { content:"\f0a2" !important; }
.icon-pages               { background-image: url("./images/icon_pages.gif"); }
.icon-pm > a:first-child:before         { content:"\f003" !important; }
.icon-print:before         { content:"\f02f" !important; }
.icon-profile:before      { content:"\f007" !important; }
.icon-register > a:before   { content:"\f234" !important; }
.icon-search:before, .responsive-search a:before   { content:"\f002" !important; }
.icon-search-active:before   { content:"\f27a" !important; }
.icon-search-new:before      { content:"\f24d" !important; }
.icon-search-self:before   { content:"\f016" !important; }
.icon-search-unanswered:before   { content:"\f15c" !important; }
.icon-search-unread:before   { content:"\f15b" !important; }
.icon-sendemail:before      { content:"\f0e0" !important; }
.icon-subscribe:before      { content:"\f046" !important; }
.icon-team:before         { content:"\f0c0" !important; }
.icon-ucp:before         { content:"\f013" !important; }
.icon-unsubscribe:before   { content:"\f057" !important; }

/* Profile & navigation icons */
.contact-icon                                       { background-image: url("./images/icons_contact.svg"); }
.icon-button:before                                    { /*background-image: url("./images/icons_button.png");*/ }

.dropdown-select:after                                 { content:"\f078"; }

/* Forum icons & Topic icons */
.global_read                                       { background-image: url("./images/announce_read.svg"); }
.global_read_mine                                    { background-image: url("./images/announce_read_mine.svg"); }
.global_read_locked                                    { background-image: url("./images/announce_read_locked.svg"); }
.global_read_locked_mine                              { background-image: url("./images/announce_read_locked_mine.svg"); }
.global_unread                                       { background-image: url("./images/announce_unread.svg"); }
.global_unread_mine                                    { background-image: url("./images/announce_unread_mine.svg"); }
.global_unread_locked                                 { background-image: url("./images/announce_unread_locked.svg"); }
.global_unread_locked_mine                              { background-image: url("./images/announce_unread_locked_mine.svg"); }

.announce_read                                       { background-image: url("./images/announce_read.svg"); }
.announce_read_mine                                    { background-image: url("./images/announce_read_mine.svg"); }
.announce_read_locked                                 { background-image: url("./images/announce_read_locked.svg"); }
.announce_read_locked_mine                              { background-image: url("./images/announce_read_locked_mine.svg"); }
.announce_unread                                    { background-image: url("./images/announce_unread.svg"); }
.announce_unread_mine                                 { background-image: url("./images/announce_unread_mine.svg"); }
.announce_unread_locked                                 { background-image: url("./images/announce_unread_locked.svg"); }
.announce_unread_locked_mine                           { background-image: url("./images/announce_unread_locked_mine.svg"); }

.forum_link                                          { background-image: url("./images/forum_link.svg"); }
.forum_read                                          { background-image: url("./images/forum_read.svg"); }
.forum_read_locked                                    { background-image: url("./images/forum_read_locked.svg"); }
.forum_read_subforum                                 { background-image: url("./images/forum_read_subforum.svg"); }
.forum_unread                                       { background-image: url("./images/forum_unread.svg"); }
.forum_unread_locked                                 { background-image: url("./images/forum_unread_locked.svg"); }
.forum_unread_subforum                                 { background-image: url("./images/forum_unread_subforum.svg"); }

.sticky_read                                       { background-image: url("./images/sticky_read.svg"); }
.sticky_read_mine                                    { background-image: url("./images/sticky_read_mine.svg"); }
.sticky_read_locked                                    { background-image: url("./images/sticky_read_locked.svg"); }
.sticky_read_locked_mine                              { background-image: url("./images/sticky_read_locked_mine.svg"); }
.sticky_unread                                       { background-image: url("./images/sticky_unread.svg"); }
.sticky_unread_mine                                    { background-image: url("./images/sticky_unread_mine.svg"); }
.sticky_unread_locked                                 { background-image: url("./images/sticky_unread_locked.svg"); }
.sticky_unread_locked_mine                              { background-image: url("./images/sticky_unread_locked_mine.svg"); }

.topic_moved                                       { background-image: url("./images/topic_moved.svg"); }
.topic_read                                          { background-image: url("./images/topic_read.svg"); }
.topic_read_mine                                    { background-image: url("./images/topic_read_mine.svg"); }
.topic_read_hot                                       { background-image: url("./images/topic_read_hot.svg"); }
.topic_read_hot_mine                                 { background-image: url("./images/topic_read_hot_mine.svg"); }
.topic_read_locked                                    { background-image: url("./images/topic_read_locked.svg"); }
.topic_read_locked_mine                                 { background-image: url("./images/topic_read_locked_mine.svg"); }
.topic_unread                                       { background-image: url("./images/topic_unread.svg"); }
.topic_unread_mine                                    { background-image: url("./images/topic_unread_mine.svg"); }
.topic_unread_hot                                    { background-image: url("./images/topic_unread_hot.svg"); }
.topic_unread_hot_mine                                 { background-image: url("./images/topic_unread_hot_mine.svg"); }
.topic_unread_locked                                 { background-image: url("./images/topic_unread_locked.svg"); }
.topic_unread_locked_mine                              { background-image: url("./images/topic_unread_locked_mine.svg"); }

.pm_read                                          { background-image: url("./images/topic_read.svg"); }
.pm_unread                                          { background-image: url("./images/topic_unread.svg"); }

/*
--------------------------------------------------------------
Colours and backgrounds for cp.css
-------------------------------------------------------------- */

/* Main CP box
----------------------------------------*/

.panel-container h3, .panel-container hr, #cp-menu hr {
   border-color: #EBEBEB;
}

.panel-container .panel li.row {
   border-bottom-color: #F5F5F5;
   border-top-color: transparent;
}

ul.cplist {

}

.panel-container .panel li.header dd, .panel-container .panel li.header dt,
.panel-container .panel li.header dd a, .panel-container .panel li.header dt a {
   color: #FFFFFF;
}

.panel-container table.table1 thead th {
   color: #FFFFFF;
   border-bottom-color: transparent;
   background-color: #005554;
}

#cp-main .pm-message {
   border-color: #DBDEE2;
   background-color: #FFFFFF;
}

/* CP tabbed menu
----------------------------------------*/
#tabs .tab > a {
   background-color: #556372;
   color: #FFFFFF;
}

#tabs .tab > a:hover {
   opacity: .7;
}

#tabs .activetab > a,
#tabs .activetab > a:hover {
   background-color: #FFFFFF;
   color: #333333;
   opacity: 1;
}

#tabs .activetab > a:hover {
   color: #000000;
}

/* Mini tabbed menu used in MCP
----------------------------------------*/
#minitabs .tab > a {
   background-color: #323A45;
   color: #FFFFFF;
}

#minitabs .activetab > a,
#minitabs .activetab > a:hover {
   background-color: #F9F9F9;
   color: #333333;
}

/* Responsive tabs
----------------------------------------*/
.responsive-tab .responsive-tab-link:before {
   border-color: #FFFFFF;
}

.responsive-tab .responsive-tab-link:hover:before {
   border-color: #FFFFFF;
}
#tabs .activetab > .responsive-tab-link:before,
#tabs .activetab > .responsive-tab-link:hover:before {
   border-color: #333333;
}

/* UCP navigation menu
----------------------------------------*/

/* Link styles for the sub-section links */
#navigation a {
   color: #FFFFFF;
   background: #556372;
}

.rtl #navigation a {
   background: #323A45;
}

#navigation a:hover {
   opacity: 0.7;
}

#navigation #active-subsection a {
   background: #F5F5F5;
   color: #333333;
}

#navigation #active-subsection a:hover {
   color: #333333;
   opacity: 1;
}


/* Preferences pane layout
----------------------------------------*/
.panel-container h2 {
   color: #FFFFFF;
}

.panel-container .panel {
   background-color: #F9F9F9;
}
#file-list-container.panel {
   background-color: transparent;
}
#cp-main .pm {
   background-color: #F5F5F5;
}
#cp-main .panel {
   background-color: #222C37;
}
/* Friends list */
.cp-mini {
   background-color: #FFFFFF;
}

dl.mini dt {
   color: #425067;
}

/* PM Styles
----------------------------------------*/
/* PM Message history */
.current {
   color: #000000 !important;
}

/* PM marking colours */
.pmlist li.pm_message_reported_colour, .pm_message_reported_colour {
   border-left-color: #BC2A4D;
   border-right-color: #BC2A4D;
}

.pmlist li.pm_marked_colour, .pm_marked_colour {
   border-color: #FF6600;
}

.pmlist li.pm_replied_colour, .pm_replied_colour {
   border-color: #A9B8C2;
}

.pmlist li.pm_friend_colour, .pm_friend_colour {
   border-color: #5D8FBD;
}

.pmlist li.pm_foe_colour, .pm_foe_colour {
   border-color: #000000;
}

/* Avatar gallery */
#gallery label {
   background: #FFFFFF;
   border-color: #CCC;
}

#gallery label:hover {
   background-color: #EEE;
}

/*
--------------------------------------------------------------
Colours and backgrounds for forms.css
-------------------------------------------------------------- */

/* General form styles
----------------------------------------*/
select {
   border-color: #DADADA;
   background-color: #FAFAFA;
}

label {
   /*color: #425067;*/
}

option.disabled-option {
   color: graytext;
}

/* Definition list layout for forms
---------------------------------------- */
dd label {
   color: #FFF;
}

fieldset.fields1 {
   background-color: transparent;
}

/* Hover effects */
fieldset dl:hover dt label {
   color: #CECECE;
}

fieldset.fields2 dl:hover dt label {
   color: inherit;
}

/* Quick-login on index page */
fieldset.quick-login input.inputbox {
   background-color: #F2F3F3;
}

/* Posting page styles
----------------------------------------*/

#message-box textarea {
   color: #333333;
}

#message-box textarea.drag-n-drop {
   outline-color: rgba(102, 102, 102, 0.5);
}

#message-box textarea.drag-n-drop-highlight {
   outline-color: rgba(17, 163, 234, 0.5);
}

/* Input field styles
---------------------------------------- */
.inputbox {
   background-color: #F5F5F5;
   border-color: #DADADA;
   color: #333333;
}

.inputbox:-moz-placeholder {
   color: #333333;
}
.search-header input#keywords::-moz-placeholder {
   color: #8494A3;
   opacity: 1 !important;
}
.inputbox::-webkit-input-placeholder {
   color: #333333;
}
.search-header input#keywords::-webkit-input-placeholder {
   color: #8494A3;
}

.inputbox:hover {
   border-color: #DADADA;
   background-color: #FFFFFF;
}

.inputbox:focus {
   border-color: #DADADA;
   background-color: #FFFFFF;
}

.inputbox:focus:-moz-placeholder {
   color: transparent;
}

.inputbox:focus::-webkit-input-placeholder {
   color: transparent;
}


/* Form button styles
---------------------------------------- */

a.button1, input.button1, input.button3 {
   background-color: #00A0A0;
   border: 3px solid #00A0A0;
   color: #FFFFFF;
}
a.button2, input.button2 {
    background-color: #00A0A0;
    color: #FFFFFF;
    border-color: #00A0A0;
}
.button2#refresh_vc {
    background-color: #FF3800;
    border: transparent;   
}
a.button1, input.button1 {
   /*! border-color: #666666; */
}

input.button3 {
   background-image: none;
}

/* Alternative button */
a.button2, input.button2, input.button3 {
   border-color: #DADADA;
}

/* <a> button in the style of the form buttons */
a.button1, a.button2 {
   color: #FFFFFF;
}

/* Hover states */
/*a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, */input.button3:hover {
   color: #FFFFFF;
   opacity: .7;
}
a.button1:hover, input.button1:hover {
    background-color: #FFFFFF;
    /*border: 3px solid #19E3B1;*/
    color: #000000;
}
a.button2:hover, input.button2:hover {
    background-color: #FFFFFF;
    /*border: 3px solid #FF3800;*/
    color: #000000;
}

/* Focus states */
input.button1:focus, input.button2:focus, input.button3:focus {
   /*color: #FFFFFF;*/
}

input.search {
   /*background-image: url("./images/icon_textbox_search.gif");*/
}

input.disabled {
   color: #666666;
}

/* jQuery popups
---------------------------------------- */
.phpbb_alert {
   background-color: #FFFFFF;
}
.phpbb_alert .alert_close {
   
}
.phpbb_alert .alert_close:before {
   font-family: FontAwesome;
   content: "\f057";
   font-size: 20px;
   color: #A7A7A7;
   display: inline-block;
}
.phpbb_alert .alert_close:hover:before {
   color: #FF3800;
}
#darken {
   background-color: #000000;
}

#loading_indicator {
   background-color: #000000;
   background-image: url("./images/loading.gif");
}

.dropdown-extended ul li {
   border-top-color: #E5E5E5;
}

.dropdown-extended ul li:hover {
   background-color: #EAEDF1;
}

.dropdown-extended .header, .dropdown-extended .footer {
   color: #FFFFFF;
}

.dropdown-extended .footer {
   border-top-style: solid;
   border-top-width: 1px;
   background-color: #FF3800;
}

.dropdown-extended .header {
   background: #026362;
   color: #FFFFFF !important;
}

.dropdown-extended .header a,
.dropdown-extended .footer a {
   color: #FFFFFF;
}

.dropdown .pointer {
   border-color: #E3E3E3 transparent;
}

.icon-notification .dropdown .pointer {
   border-color: #026362 transparent;
}

.dropdown .pointer-inner {
   border-color: #FFF transparent;
}

.dropdown-extended .pointer-inner {
   border-color: #026362 transparent;
}

ul.linklist li.responsive-menu a.responsive-menu-link:before {
   color: #FF3800;
}

/*ul.linklist li.responsive-menu a.responsive-menu-link:hover:before, ul.linklist li.responsive-menu.visible a.responsive-menu-link:before {
   color: #FE9B0E;
}*/
ul#nav-main.linklist li.responsive-menu a.responsive-menu-link {
   background-color: #556372;
   border-bottom-color: #727D89;
}
ul.linklist li.responsive-menu a.responsive-menu-link:before {
   color: #FFFFFF;
   opacity: .7;
}
ul.linklist li.responsive-menu a.responsive-menu-link:hover:before,
ul.linklist li.responsive-menu.dropdown-visible a.responsive-menu-link:before {
   opacity: 1;
}

.dropdown .dropdown-contents {
   background: #3C4855;
   border-color: #b9b9b9;
   box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.2);
}

.dropdown-up .dropdown-contents {
   box-shadow: 1px 0 5px rgba(0, 0, 0, 0.2);
}

.dropdown li, .dropdown li li {
   border-color: #DCDCDC;
}

.dropdown li.separator {
   border-color: #DCDCDC;
}

/* Notifications
---------------------------------------- */

.notification_list p.notification-time {
   color: #323A45;
}

li.notification-reported strong, li.notification-disapproved strong {
   color: #D31141;
}

/* Ajouts par Pitou */

.pagination {
   color: #FFFFFF;
}
.stat-block p {
    background-color: #162331;
}
quarto.css :

Code : Tout sélectionner

/* Body background
---------------------------------------- */


/* Main block 
---------------------------------------- */

#page-body {
	background-color: #222C37;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 20px;
}

/* Popup Login
---------------------------------------- */

#mask {
	display: none;
	background: #000; 
	position: fixed; left: 0; top: 0; 
	z-index: 10;
	width: 100%; height: 100%;
	opacity: 0.6;
	z-index: 999;
}

.login-popup {
	display: none;
	width: 300px;
	background: #FFFFFF;
	padding: 20px 20px 0; 	
	float: left;
	font-size: 1em;
	position: fixed;
	top: 50%; left: 50%;
	z-index: 99999;
	box-shadow: 0px 0px 20px #434343; /* CSS3 */
	-moz-box-shadow: 0px 0px 20px #434343; /* Firefox */
	-webkit-box-shadow: 0px 0px 20px #434343; /* Safari, Chrome */
}
#navbar_username,
#navbar_password_hint,
#navbar_password {
	width: 300px;
	padding: 0 10px;
	height: 40px;
	line-height: 40px;
	outline: none !important;
	box-sizing: border-box;
}
#navbar_username {
	background-position: 12px 0;
}

.navbar_username_outer,
.navbar_password_outer {
	padding: 10px 0;
}
#login-box .quick-login {
	margin-bottom: 5px;
}
#login-box #autologin_label {
	cursor: pointer;
}
#login-box .login-footer {
	padding: 15px 20px;
	margin: 0 -20px;
	background-color: #005554;
}
#login-box .login-footer a {
	color: #FFFFFF;
}
.rtl #login-box .register-link {
}
.rtl #login-box .restore-password {
	float: left;
	margin-left: 0 !important;
}
#login-box a.close { 
	display: block;
	float: right;
	margin-right: -15px;
	margin-top: -21px;
}
.rtl #login-box a.close { 
	float: left;
	margin-left: -15px;
}
#login-box a.close:before {
	font-family: FontAwesome;
	content: "\f057";
	font-size: 20px;
	color: #A7A7A7;
	display: inline-block;
}
#login-box a.close:hover:before {
	color: #FF3800;
}
#login-box .login-popup fieldset { 
	border:none; 
}
#login-box .login-link {
	display: none;
}
#login-box input[name="login"] {
	padding: 10px;
}
#login-box .button2 {
	background-color: #FF3800;
	border: 3px solid #FF3800;
	color: #FFFFFF;
	background-image: none !important;
	height: 42px;
	margin-bottom: 10px;
	margin-top: 5px;
	padding: 0 0 4px;
	width: 300px !important;
	line-height: 12px;
	box-shadow: none;
	outline: none;
}

#login-box .button2:hover {
	background-color: #FFFFFF;
	border: 3px solid #FF3800;
	color: #005554;
	opacity: 1;
}
.login-buttons {
	overflow: hidden;
	margin-bottom: 10px;
}

/* Notifications
---------------------------------------- */


li.icon-notification,
li.icon-pm,
li#username_logged_in {
	position: relative;
	margin-left: 25px !important;
}
li.icon-notification strong.notification-count,
li.icon-pm strong.private-message-count {
	background-color: #ff5500;
	border-radius: 12px;
	color: #ffffff;
	display: inline-block;
	line-height: 15px;
	min-width: 12px;
	padding: 2px 4px;
	text-align: center;
	font-weight: bold;
	position: absolute;
	right: -9px;
	top: 13px;
	font-size: 14px;
}

/* Stat blocks
---------------------------------------- */

.stat-block {
	background-color: #FFFFFF;
}
.stat-block h3 {
	margin: 0;
	padding: 0 20px;
	border-bottom-width: 0;
	background-color: #3C4855;
	height: 50px;
	color: #FFFFFF;
	text-transform: none;
	font-size: 1.077em;
	line-height: 50px;
	font-weight: normal;
}
.stat-block h3 a {
	color: #FFFFFF;
}
.stat-block p {
	padding: 20px;
}

/* Icons
---------------------------------------- */

.dropdown-contents > .small-icon:before,
.dropdown-contents > .clone:before,
.dropdown-contents > .small-icon.clone a:before {
	margin-right: 6px;
}
.icon-acp > a,  .icon-bookmark > a, .icon-bump > a, .icon-contact > a, .icon-delete-cookies > a,/* .icon-download > a, */.icon-faq > a, .icon-logout > a, .icon-mark > a, .icon-mcp > a, .icon-members > a, .icon-notification > a:first-child,/* .icon-pages > a,*/ .icon-pm > a:first-child, .icon-print > a, .icon-profile > a, .icon-register > a, .icon-search > a, .responsive-search a > a, .icon-search-active > a, .icon-search-new > a, .icon-search-self > a, .icon-search-unanswered > a, .icon-search-unread > a, .icon-sendemail > a, .icon-subscribe > a, .icon-team > a, .icon-ucp > a, .icon-unsubscribe > a {
	padding: 0px;
} 
#nav-main > .icon-acp > a:before, .icon-acp:before, .icon-bookmark:before, .icon-bump:before, .icon-contact:before, .icon-delete-cookies:before, /*.icon-download:before, */.icon-faq > a:before, .icon-logout:before, #nav-main > .icon-logout > a:before, .icon-mark:before, .icon-mcp > a:before, .icon-members:before, .icon-notification > a:first-child:before,/* .icon-pages:before,*/ .icon-pm > a:first-child:before, .icon-print:before, .icon-profile:before, .icon-register > a:before, .icon-search:before, .responsive-search a:before,  .icon-search-active:before,.icon-search-new:before, .icon-search-self:before, .icon-search-unanswered:before, .icon-search-unread:before, .icon-sendemail:before, .icon-subscribe:before, .icon-team:before, .icon-ucp:before, .icon-unsubscribe:before {
	display: inline-block !important;
	font-family: FontAwesome;
}
 .icon-home > a {}
 .icon-home:before {}

 #nav-breadcrumbs {
 	padding: 15px 20px;
 	border-top-width: 0;
 	background-color: #162331;
 }
.icon-mark:before {
	font-size: 16px;
	margin-top: 4px;
	color: #FF3800;
}
.icon-notification > a:first-child:before,
.icon-pm > a:first-child:before {
	font-size: 28px;
	line-height: 10px;
	vertical-align: middle;
}
.icon-notification > a:first-child:hover:before,
.icon-pm > a:first-child:hover:before {
	color: #FFFFFF;
}

/* Navbar
---------------------------------------- */

.header-avatar .username,
.header-avatar .username-coloured {
	color: #FFFFFF !important;	
	font-weight: normal;
}


/* Prefooter
---------------------------------------- */
#prefooter {
	display: table;
	padding: 30px 20px;
	width: 100%;
	box-sizing: border-box;
}
#prefooter .prefooter-block {
	display: table-cell;
	vertical-align: top;
}
#prefooter .prefooter-block:not(:first-child) {
	padding-left: 15px;
}
#prefooter .prefooter-block:not(:last-child) {
	padding-right: 15px;
}
.prefooter-block.width-33 {
	width: 33%;
}
.prefooter-block.width-50 {
	width: 50%;
}
.prefooter-block.width-100 {
	width: 100%;
}
#prefooter .prefooter-block:last-child {
	padding-right: 0;
}
#prefooter h1, #prefooter h2, #prefooter h3, #prefooter h4 {
	color: #FFF;
	margin-bottom: 15px;
}
#prefooter h2 {
	font-size: 1.538em;
}
#prefooter ul {
	list-style: none;
}
#prefooter ul li {
	margin-bottom: 5px;
}
#prefooter ul li:last-child {
	margin-bottom: 0;
}
#prefooter ul li .fa {
	color: #79BFB5;
}
#prefooter .prefooter-block *:first-child {
	margin-top: 0;
}
#prefooter .prefooter-block *:last-child {
	margin-bottom: 0;
}

/* Social Links
---------------------------------------- */

#footer-social-links {
	position: absolute;
	right: 0;
	top: 22px;
}
#footer-social-links li {
	display: inline-block;
	font-size: 1.385em;
}

#footer-social-links li a:link, #footer-social-links li a:visited {
	color: #79BFB5;
}
#footer-social-links li a:hover {
	opacity: .7;
	text-decoration: none;
}

/* Footer
---------------------------------------- */

#page-footer {
	border-top: solid 5px #3C4855;
}

#page-footer {
	background-color: #005554;
	color: 	#ABC6C1;
}
#page-footer a,
.copyright a,
#page-footer-links a {
	color: #FFFFFF;
}
#page-footer-links {
	min-height: 60px;
}
#page-footer-links ul.linklist {
	padding-top: 20px;
}


/* Alerts
---------------------------------------- */

.alert_text {
	color: #000000;
}
h3.alert_title,
.alert_text > form > h3 {
	color: #555555;
	border-bottom: solid 1px #F5F5F5;
	padding-bottom: 10px;
	line-height: 34px;
}
p.alert_text,
.alert_text > form > p {
	color: #000000;
}

/* Posting buttons
---------------------------------------- */

#format-buttons [class^="button"] {
	background-color: #FFFFFF;
	border: 0;
	padding: 0;
	margin: 0;
	cursor: pointer;
	box-shadow: none;
}
#format-buttons input[class^="button"] {
    min-width: 24px;
    display: inline-block;
    box-sizing: border-box;
    background-color: #FFFFFF;
	  color: #000000;
    height: 24px;
    line-height: 20px;
    margin: 0 2px;
}
#format-buttons input[class^="button"]:hover {
	background-color: #E1E1E1;
}
#format-buttons button[class^="button"]:before {
	font-family: FontAwesome;
	color: #000000;
    min-width: 24px;
    padding: 4px 3px 0;
    display: inline-block;
    box-sizing: border-box;
    height: 24px;
}
#format-buttons [class^="button"]:hover:before {
	background-color: #E1E1E1;
}
#format-buttons .bbcode-b:before {
	content: "\f032";
}
#format-buttons .bbcode-i:before {
	content: "\f033";
}
#format-buttons .bbcode-u:before {
	content: "\f0cd";
}
#format-buttons .bbcode-quote:before {
	content: "\f10d";
}
#format-buttons .bbcode-code:before {
	content: "\f121";
}
#format-buttons .bbcode-list:before {
	content: "\f0ca";
}
#format-buttons .bbcode-list-:before {
	content: "\f0cb";
}
#format-buttons .bbcode-asterisk:before {
	content: "\f069";
}
#format-buttons .bbcode-img:before {
	content: "\f03e";
}
#format-buttons .bbcode-url:before {
	content: "\f0c1";
}
#format-buttons .bbcode-flash:before {
	content: "\f144";
}
#format-buttons .bbcode-color:before {
	content: "\f1fb";
}

/* Sidebar
---------------------------------------- */

.page-body-inner-with-sidebar {
	float: left;
	margin-right: 20px;
	width: calc(100% - 300px);
	width: -moz-calc(100% - 300px);
	width: -webkit-calc(100% - 300px);
}
#sidebar {
	float: left;
	width: 280px;
}
.sidebar-block {
	margin-bottom: 20px;
}

.sidebar-block-header {
	background-color: #005554;
	color: #ffffff;
	font-size: 	1.077em;
	line-height: 50px;
	padding-left: 20px;
	padding-right: 20px;
	margin: 0;
	box-sizing: border-box;
	letter-spacing: 0;
}
.sidebar-block-content {
	background-color: #FFFFFF;
	margin-bottom: 20px;
	padding: 20px;
}
.sidebar-block-content p:last-child {
	margin-bottom: 0;
}

#sidebar ul {
	list-style-position: inside;
	margin-bottom: 1.5em;
}


/* Misc
---------------------------------------- */

.divider-vertical {
	color: #A7A7A7;
}
#breadcrumb-footer {
	padding: 15px 20px;
	background-color: #162331;
}

.cron-block {
	background-color: #212D2D;
}

.postbody .content {
	border-top: solid 1px #F5F5F5;
}

.status-dot {
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: #C1C1C1;
	margin-bottom: 1px;
	margin-left: 5px;
}
.online .status-dot {
	background-color: #55BF00;
}
a.login-responsive-link {
	display: none;
}

.display-options input.button2[type="submit"] {
	border: 0 !important;
	height: 32px;
	background-color: #C8C8C8 !important;
}
.display-options input.button2[type="submit"]:hover {
	background-color: #3C4855 !important;	
	color: #FFFFFF;
}
a.button2,
input.button2 {
	/*border: solid 3px transparent !important;*/
	background-color: #222C37;
	color: #FFFFFF;
}
a.button1, input.button1 {
	background-color: #222C37;
	color: #FFFFFF;
}
a.button2:hover,
input.button2:hover {
	border-color: #005554 !important;
	color: #000000;
}
.button.dropdown-select {
	height: 38px;
	line-height: 38px;
}
.button.dropdown-select:after {
	height: 40px;
	line-height: 38px;
}
.button.locked-icon {
	border: solid 3px #C8C8C8;
}
.button.locked-icon:hover {
	border-color: #FF3800;
}
.search-box .inputbox {
	background-color: #556372;
	color: #ffffff;
}

.section-ucp .panel fieldset .inputbox,
.section-mcp .panel fieldset .inputbox,
.section-mcp .action-bar .inputbox {
	background-color: #FFFFFF;
}

.section-viewforum p.jumpbox-return {
	clear: both;
}

input[type=submit],
.attach-panel input[type=button] {
	-webkit-appearance: none;
	-webkit-border-radius: 0;
}


/* Transitions
----------------------------------------*/

.button,
a.button1, input.button1, input.button3, a.button2, input.button2,
input.inputbox,
#footer-social-links li a,
a.close:before,
.pagination li span,
.pagination li a,
.inputbox,
.post-buttons .icon-button:before,
#format-buttons button[class^="button"]:before,
#tabs .tab > a,
#navigation a,
#quick-links a.responsive-menu-link:before,
li.row,
.navbar ul#nav-main > li > a,
.icon-notification > a:first-child:before,
.icon-pm > a:first-child:before,
.headerbar .search-box button.search-icon:before {
	-webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}

.dropdown-select:after {
	-webkit-transition: border-color 0s ease 0s;
	-moz-transition: border-color 0s ease 0s;
	-ms-transition: border-color 0s ease 0s;
	-o-transition: border-color 0s ease 0s;
	transition: border-color 0s ease 0s;
}

/* Quarto RTL */

.rtl .navbar ul#nav-main {
	padding: 0 0 0 20px;
}
.rtl ul#nav-main.linklist > li:not(.rightside) > a:before,
.rtl ul#nav-main.linklist > li.icon-register > a:before,
.rtl ul#nav-main.linklist > li.icon-logout > a:before {
	margin-right: 0;
	margin-left: 5px;
}
.rtl #nav-main .dropdown-left .dropdown,
.rtl #nav-main .nojs .rightside .dropdown {
    right: 4px;
}
.rtl li.icon-notification strong.notification-count,
.rtl li.icon-pm strong.private-message-count {
	left: -9px;
	right: inherit !important;
}
.rtl .pagination li.next a:before {
	content: "\f104";
}
.rtl .pagination li.previous a:before {
	content: "\f105";
}
.rtl .dropdown-contents > .small-icon:before,
.rtl .dropdown-contents > .clone:before,
.rtl .dropdown-contents > .small-icon.clone a:before {
    margin-right: 0px;
    margin-left: 6px;
}
.rtl li.icon-notification,
.rtl li.icon-pm,
.rtl li#username_logged_in {
    margin-left: 0px !important;
    margin-right: 25px !important;
}

/* Quarto theme responsive rules
----------------------------------------*/
@media only screen and (max-width: 1152px) {
	.headerbar {
		padding: 0 20px;
	}
	#page-footer-links ul.linklist {
		padding-left: 20px;
		padding-right: 20px;
	}
}

@media only screen and (max-width: 1024px), only screen and (max-device-width: 1024px) {

	.page-body-inner-with-sidebar ul.topiclist li.header dd.topics,
	.page-body-inner-with-sidebar ul.topiclist dd.topics {
		display: none;
	}
	.page-body-inner-with-sidebar li.header dt .list-inner,
	.page-body-inner-with-sidebar ul.topiclist dt .list-inner {
		margin-right: 350px;
	}
	.page-body-inner-with-sidebar ul.topiclist dt {
		margin-right: -350px;
	}

}

@media only screen and (max-width: 900px) {
	.page-body-inner-with-sidebar {
		float: none !important;
		margin-right: 0;
		overflow: auto;
		width: 100%;
	}
	#sidebar {
		float: none !important;
		width: 100%;
		margin-bottom: 20px;
	}
	.sidebar-block-header {
		text-align: center;
	}
	.page-body-inner-with-sidebar ul.topiclist li.header dd.topics,
	.page-body-inner-with-sidebar ul.topiclist dd.topics {
		display: block;
	}
	.page-body-inner-with-sidebar li.header dt .list-inner,
	.page-body-inner-with-sidebar ul.topiclist dt .list-inner {
		margin-right: 440px;
	}
	.page-body-inner-with-sidebar ul.topiclist dt {
		margin-right: -440px;
	}
	#cp-main h2 {
		margin-left: 0px;
	}

}

@media only screen and (max-width: 875px) {
	#site-description {
		float: none;
		width: auto;
		text-align: center;
	}
	.logo {
		/* change display value to inline-block to show logo */
		display: inline-block;
		float: none;
	}
	#site-description p,
	.search-header {
	    display: none;
	}
	.responsive-search {
	    display: block !important;
	}
	.responsive-search a {
		display: block;
		width: 16px;
		height: 18px;
		overflow: hidden;
	}
}

@media only screen and (max-width: 700px) {
	a.login-window {
		display: none;
	}
	a.login-responsive-link {
		display: inherit;
	}
	.page-body-inner-with-sidebar ul.topiclist li.header dd.topics,
	.page-body-inner-with-sidebar ul.topiclist dd.topics {
		display: none;
	}
	#prefooter .prefooter-block {
		display: block;
		width: 100%;
		margin-bottom: 20px;
		padding-right: 0;
		padding-left: 0 !important;
	}
	#prefooter .prefooter-block:last-child {
		margin-bottom: 0px;
	}
	.copyright {
		text-align: center;
	}
	#footer-social-links {
		position: static;
		text-align: center;
		margin-bottom: 20px;
	}
	#page-footer-links .dropdown-contents > li > a {
		color: #139895;
	}
    .private-message-count,
    .notification-count {
    	display: inline-block !important;
    }
	.rtl ul.linklist > li:first-child {
		margin-left: 15px !important;
	}
}

@media only screen and (max-width: 500px) {
	dl.details dd {
		margin-left: 0px !important;
		padding-left: 0 !important;
		margin-bottom: 10px;
	}
	fieldset.display-options label {
		white-space: normal !important;		
	}
}

@media only screen and (max-width: 480px) {
	#cp-main ul.topiclist > li {
		padding: 0px 10px !important;
	}
	#cp-main ul.topiclist li.row dl {
		padding: 10px 0 !important;
	}
	fieldset.submit-buttons input {
		margin-bottom: 10px;
	}
}

@media only screen and (max-width: 360px) {
	#cp-main fieldset .inputbox {
		width: 217px !important;
	}
	fieldset.display-actions label {
		white-space: normal !important;
	}
	#quick-links a.responsive-menu-link {
		padding: 25px 20px 16px !important;
	}
	#quick-links a.responsive-menu-link:before {
		margin-right: 0 !important;
	}
	.rtl #page-footer-links ul.linklist > li:first-child {
		margin-left: 0 !important;
	}
}

Là c'est pas mal pour un premier thème sombre/dark !

PS : oui, les émoticones bavent un peu :
Image
Mais perso ça ne me dérange pas !

Re: Un Thème pour le forum

Publié : 05 Mars 2016 19:16
par Max
Oki, je met à jour les css avec ta dernière mouture, je teste, et si c'est bon alors je transmet au patron ;)

Re: Un Thème pour le forum

Publié : 05 Mars 2016 19:58
par Max
Bon, c'est tout bon pour moi, à priori pas de pb (très agréable à utiliser d'ailleurs).
C'est donc envoyé.

Re: Un Thème pour le forum

Publié : 05 Mars 2016 20:40
par MasterNovice
Merci Max pour le thème, c'est sympa ce que tu as fait et merci Pitou pour la version dark, ça manquait :)

Re: Un Thème pour le forum

Publié : 05 Mars 2016 21:21
par Max
Il y a une implication de pas mal de membres, c'est ça qui est bien ;)

Re: Un Thème pour le forum

Publié : 05 Mars 2016 22:38
par simonj
Pour les icônes, ils faut les détourer correctement ? Si c'est configurable, il suffit de me les envoyer et je vous les détours correctement si vous voulez.

Re: Un Thème pour le forum

Publié : 06 Mars 2016 11:34
par Max
simonj a écrit :Pour les icônes, ils faut les détourer correctement ? Si c'est configurable, il suffit de me les envoyer et je vous les détours correctement si vous voulez.
Pour les icons de base PhpBB3, ce sont ceux ci: smiliesbase.zip
Pour les autres, il sont issus du pack Dan.San Smileys Pack.
Le soucis, c'est que c'est au format GIF, donc ... :triste1:

Re: Un Thème pour le forum

Publié : 06 Mars 2016 12:53
par Franck
Salut.
Je viens de faire un essai sur un smiley.
Il est vrai que suivant la couleur de fond le résultat est plus ou moins réussi. :(

Re: Un Thème pour le forum

Publié : 07 Mars 2016 10:34
par Iwa
A part se les repalucher à la main, je crois qu'on y ait contraint avec un fond sombre