Sujet : Proposition de feuille css pour l'habillage du forum PunBB
Bonjour tout le monde
Donc comme je travaille aussi sur PunBB je vous propose ici une feuille css pour PunBB
L'avantage de PunBB sur phpBB en ce domaine, c'est qu'il y a une feuille séparée pour la structure et une autre pour la coloration des éléments de la structure.
donc là j'ai repris les colorations "gendarmerie nationale" du thème oxygène, pour leur donner une coloration un peu plus gaie, buccolique, sensible, etc...
c'est une ébauche que je fais dans l'idée de me familiariser avec la construction de la structure du thème afin de le développer ultérieurement.
mais bon
si ça peut inspirer l'équipe des Cigales pour leur forum, je suis à leur disposition pour préciser cette feuille pour leur projet.
/* General colour scheme
----------------------------------------------------------------*/
body {
background: #fff;
color: #333;
}
.brd a:link, .brd a:visited {
color: #00579C;
}
.brd p.feed a:link, .brd p.feed a:visited {
color: #DDDDDD;
}
.brd a:hover, .brd a:active, .brd a:focus,
.brd p.feed a:hover, .brd p.feed a:active, .brd p.feed a:focus {
color: #b42000;
text-decoration: none;
}
.brd .main-pagepost a:link, .brd .crumbs a:link,
.brd .main-pagepost a:visited, .brd .crumbs a:visited {
text-decoration: none;
}
.brd .main-pagepost a:hover, .brd .crumbs a:hover,
.brd .main-pagepost a:active, .brd .crumbs a:active,
.brd .main-pagepost a:focus, .brd .crumbs a:focus {
text-decoration: underline;
}
.brd .gen-content, .brd .main-content {
background: #FFFFFF;
border-color: #FF9325;
border-bottom-color: #FF9325;
}
.brd .main-pagepost {
background: #fff;
border-color: #FCA237;
}
.brd .crumbs {
background: #fff;
border-color: #fff;
}
.brd .main-item, .brd .main-item li, .brd .main-item div, .brd td {
border-color: #FCA237;
}
.brd .main-item li.info-posts,
.brd .main-item li.info-replies,
.brd .main-item li.info-views,
.brd .main-item li.info-topics {
}
.brd .main-content .main-item .item-nav {
color: #888;
}
.brd .main-content .sticky {
background: #FDFFCC;
}
.brd .main-content .main-item .hn .item-status em.sticky ,
.brd .main-content .main-item .hn .item-status em.closed{
color: #314B60;
font-weight: bold;
}
.brd .main-content .main-item .hn .item-status em.moved {
color: #666;
}
.brd .post * {
border-color: #FCA237
}
.brd .post {
border-color: #FCA237;
border-top-color: #fff;
border-bottom-color: #ccc;
}
#topic-review .firstpost, .brd .singlepost {
border-top-color: #FCA237;
border-bottom-color: #FCA237;
}
.brd .post {
background: #F3FFBE;
}
.brd .posthead, .brd .postbody, .brd .post-options {
background: #ffffff;
}
.brd .posthead .hn {
background: #FFF7BC;
}
.brd .posthead .post-title small {
color: #999;
}
.brd .online .userstatus span {
border-color: #FFA208;
}
.brd .ct-box, .brd .ct-set, .brd .ct-group, .brd .frm-group {
border-color: #FED165;
}
.brd .admin-page .ct-box {
background: #FEFFE6;
}
.brd .admin-page .ct-set .ct-box, .brd .report {
background: #FFF694;
}
.brd .admin-page .warn-set .warn-box {
background: #FEFFE6;
}
.brd .main-frm .ct-group, .brd #brd-announcement {
background: #FFF694;
}
.brd .main-content .info-box {
background: #FFFFE1;
}
.brd .main-extensions .extension, .brd .main-hotfixes .hotfix {
background: #FFF694;
}
.brd .main-extensions .disabled, .brd .main-hotfixes .disabled {
background: #FFFFE1;
}
.brd .warn-group, .brd .warn-set, .brd .warn-box, .brd .error-box, .brd #admin-alerts {
background: #FEFFE6;
border-color: #FF89F3;
}
.brd .warn-group, .brd .warn-set, .brd .warn-box, .brd .error-box {
border-color: #C9A5FF;
}
.brd ul.info-list li,
.brd ul.error-list li {
color: #6A97BF;
}
.brd ul.info-list li span,
.brd ul.error-list li span {
color: #666;
}
.brd ul li strong {
color: #333;
}
.brd .user-box {
background: #FFF694;
}
.brd .ct-box .hn, .brd .ct-box .sig-demo {
border-color: #FED165;
color: #DD91FF;
}
.brd .error-box .hn {
color: #333;
}
.brd .help-box {
background: #ffffff;
}
.brd .frm-buttons, .brd .extension .options, .brd .hotfix .options {
border-color: #FED165;
}
.brd .checklist {
background: #fff;
border-color: #ccc;
}
.brd label, .brd .aslabel, .brd .mf-set legend, .brd .ct-legend * {
color: #357;
}
.brd .paging * {
border-color: #D8FE77;
}
.brd .required label em, .brd #req-msg em, .brd .warn strong, .brd .important strong {
color: #b42000;
}
.brd .entry-content .quotebox, .brd .entry-content .codebox {
background: #fff;
border-color: #ddd;
}
#brd-announcement .userbox {
background: #FFF694 none repeat scroll 0 0;
}
.brd .main-content .main-item .hn .posted-mark {
color: #99C;
}
/* Menus
----------------------------------------------------------------*/
#brd-navlinks {
background: #FFC474;
border-color: #FF9D43;
color: #7300FF;
}
#brd-navlinks a:link, #brd-navlinks a:visited {
color: #7300FF;
}
#brd-navlinks a:hover, #brd-navlinks a:active, #brd-navlinks a:focus {
color: #F000FF;
text-decoration: underline;
}
.brd .main-options, .brd .main-options span {
background: #FCA237;
}
.brd .main-menu, .brd .admin-menu {
background: #DD91FF;
}
.brd .admin-submenu {
background: #D7FB98;
border-color: #FF9325;
}
.brd .main-menu a:link,
.brd .main-menu a:visited,
.brd .admin-menu a:link,
.brd .admin-menu a:visited {
color: #ddd;
text-decoration: none;
}
.brd .main-menu a:hover,
.brd .main-menu a:active,
.brd .main-menu a:focus,
.brd .admin-menu a:hover,
.brd .admin-menu a:active,
.brd .admin-menu a:focus {
text-decoration: underline;
color: #fff;
}
.brd .main-menu li.active a:hover,
.brd .main-menu li.active a:active,
.brd .main-menu li.active a:focus,
.brd .main-menu li.active a:visited,
.brd .admin-menu li.active a:hover,
.brd .admin-menu li.active a:active,
.brd .admin-menu li.active a:focus,
.brd .admin-menu li.active a:visited {
text-decoration: none;
}
.brd .admin-submenu li.active a {
text-decoration: none;
}
.brd .main-menu li.active a {
color: #fff;
}
.brd .admin-menu li.active a {
color: #eef;
}
#brd-admod #alert a {
color: yellow;
}
/* Logo and Headings
----------------------------------------------------------------*/
#brd-head {
background: #D4FF63;
color: #FF4400;
border-color: #D4FF63;
}
#brd-head a, #brd-head a:link, #brd-head a:visited {
color: #FF4400;
}
#brd-desc {
color: #FF00B7;
}
.brd .main-head, .brd .main-foot {
background: #FFE0F7;
color: #FF4400;
border-color: #DD91FF;
}
.brd #brd-announcement h1 {
border-color: #BBBBBB;
}
.brd .main-subhead {
border-color: #FF9325 #FF9325 #FF9325 #FF9325;
background: #ffffff;
}
.brd .column-title {
border-color: #ffffff #ffffff #FF9325 #ffffff;
background: #ffffff;
}
.brd .group-head {
background: #F3FFBE;
border-color: #FED165;
}
.brd .content-head .hn {
border-color: #FED165;
color: #666;
}
.brd .main-head a:link, .brd .main-head a:visited,
.brd .main-foot .options a:link, .brd .main-foot .options a:visited {
color: #ccc;
}
.brd .main-head a:hover, .brd .main-head a:active, .brd .main-head a:focus,
.brd .main-foot .options a:hover, .brd .main-foot .options a:active, .brd .main-foot .options a:focus {
color: #fff;
}
.brd th {
background: #ffffff;
}
.brd .main-frm .ct-group td {
background: #FFFFFF;
}
#extensions-used {
border-bottom-color: #999;
}
/* Status indicators
----------------------------------------------------------------*/
.brd .main-content .main-item .icon {
border-color: #F3FFBE #DDE0E4 #C6CBD3 #BABFC6;
}
.brd .main-content .redirect .icon {
border-color: #ffffff #ffffff #ffffff #ffffff;
}
.brd .main-content .sticky .icon {
border-color: #D7E5F3 #C3CFDC #9FB3C7 #90A2B4;
}
.brd .main-content .closed .icon {
border-color: #ACACAC #979797 #898989 #7A7A7A;
}
.brd .main-content .sticky .closed .icon {
border-color: #D7E5F3 #C3CFDC #898989 #7A7A7A;
}
.brd .main-content .new .icon {
border-color: #2B75AD #235E8C #DD91FF #266799;
}
/* Multi Checkbox Widget
-------------------------------------------------------------*/
.brd .checklist .checklist-item label:hover {
background: #F3FFBE;
}bon je n'ai pas la possibilité sur ce forum de vous mettre des impressions d'écran pour donner une idée du résultat.
mais éventuellement, si vous vous connecté par hasard dans les périodes où ma machine locale tourne, il est possible de voir en ligne mon bazard à l'adresse suivante
http://paulregnier.homeunix.net/~paul/p … /index.php
y'a pas beaucoup de discussion évidemment, mais ça donne une idée