Geekzone trop blanc ? passez du côté obscur de la zone (ou reglez vos écrans :p )

Cobra · Octobre 1, 2015, 3:00

Bon j’adore toujours autant ton thème.

Par contre je comprenais pas je voyais pas de différence entre les topic lu et non lu.
Du coup, j’ai viré le « !important » dans le color de .topic-list-item .title

body {
    background-color: #232531;
    color: #bdbec2;
}
.topic-list {
    background-color: #fff;
}
.topic-list thead {
    background-color: #353643;
}
.topic-list th {
    color: #c3c3c7;
}
.topic-list .sortable:hover {
    background-color: #4A4B57;
}

.topic-list-item .title {
    color: #000000;
    font-size: 13px;
    font-weight: bold;
}
.topic-list-item .title:hover {
    color: #555 !important;
}
.main-link {
    padding-left: 20px !important;
}
.topic-post-badges .new-posts {
    color: #fff;
}
.topic-post-badges .new-topic {
    color: green;
    font-size: 11px;
}
.list-controls a {
    color: #bdbec2 !important;
}
.list-controls a:hover {
    background: #353643 !important;
    color: #fff !important;
}
.clear-badge {
    color: red !important;
}
.topic-body {
    background-color: #fff;
    border-top: 1px solid #ddd;
    margin-left: 10px;
    margin: 10px;
    box-shadow: 6px 6px 6px -4px rgba(57, 57, 57, 0.4);
    border-radius: 5px;
}
.topic-meta-data .names a {
    color: #444 !important;
}
.topic-area {
    background-color: #353643;
}
.topic-avatar {
    border-top: none;
    margin-left: 7px;
}
.post-menu-area {
    font-size: 10px;
}
.post-links a {
    color: #bdbec2 !important;
}
.post-date {
    font-size: 11px;
}
.cooked p {
    color: #444;
}
.cooked code {
    background-color: #ddd;
    color: #000;
}
.cooked .quote .title {
    background-color: #ddd;
    border-left-color: #bbb;
    font-size: 12px;
    font-weight: bold;
    padding-bottom: 10px;
}
.cooked .quote blockquote {
    background-color: #eee;
    border-left-color: #bbb;
    color: #333;
}
#topic-closing-info {
    border-top: none;
}
#topic-footer-buttons {
    margin-left: 60px;
}
.notification-options p {
    color: #bdbec2 !important;
}
#suggested-topics {
    margin: 0 60px 0 60px;
}

Altaya · Octobre 1, 2015, 3:09

Je ne peux pas installer d’addon au taf mais j’aime beaucoup les screens en tout cas

Ghadzoeux · Octobre 1, 2015, 3:37

C’est casse-pied, j’ai voulu changer le thème en en créant un nouveau, désactiver l’ancien, mais l’icone de stylish reste désespérément vide de tout signe de fonctionnement…
Alors que ça marchait très bien jusque là…
(Chrome)

OlendelL · Octobre 1, 2015, 3:39

Je compatis ! Ffx 21.0 ici

chway · Octobre 1, 2015, 3:53

Sinon, tu peux laisser le « !important » et ajouter en dessous :

.topic-list-item .title:visited {
    color: #989898 !important;
}

Ça semble etre suffisant.

chway · Octobre 1, 2015, 7:29

« Petite » update, j’ai commencé par cacher quelques éléments qui prenaient pas mal de place pour pas grand chose (les liens à droite des posts, la liste des sujets similaires en bas des topics et la barre qui se trouve tout en haut du forum), vous pouvez toujours les ré-afficher en supprimant les lignes du genre « display: none; », ca risque péter un peu la mise en page, à vos risques et périls.

Sinon, j’ai revu pas mal de petites choses ici et là, j’ai colorié, déplacé, redimensionné tout ce que j’ai pu trouver.

Je pense que là on est pas mal.

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("forum.geekzone.fr") {
body {
    background-color: #232531;
    color: #bdbec2;
}

.topic-list {
    background-color: #fff;
}

.topic-list thead {
    background-color: #353643;
}

.topic-list th {
    color: #c3c3c7;
}

.topic-list .sortable:hover {
    background-color: #4A4B57;
}

.topic-list-item .title {
    font-size: 13px;
    font-weight: bold;
}

.topic-list-item .title:hover {
    color: #555 !important;
}

.main-link {
    padding-left: 20px !important;
}

.topic-post-badges .new-posts {
    color: #fff;
}

.topic-post-badges .new-topic {
    color: green;
    font-size: 11px;
}

.list-controls a {
    color: #bdbec2 !important;
}

.list-controls a:hover {
    background: #353643 !important;
    color: #fff !important;
}

.clear-badge {
    color: red !important;
}

#topic-title {
    margin-top: -25px;
}

#topic-title .fancy-title {
    color: #bdbec2;
}

.topic-body {
    background-color: #fff;
    min-width: 1066px;
    margin: 13px 0 0 10px;
    border-radius: 3px;
    position: relative;
    z-index: 0;
}

.reply-new{
    margin: 30px 0 0 -206px !important;
    position: absolute;
    font-size: 12px;
}

.topic-meta-data .names a {
    color: #444 !important;
}

.topic-area {
    background-color: #353643;
}

.topic-avatar {
    border: none;
    margin: 8px 0 0 20px;
    position: absolute;
    z-index: 1;
}

.user-title {
    display: block !important;
    margin-top: -7px;
}

.topic-meta-data {
    margin-left: 50px;
}
    
.post-info {
    margin-top: -5px !important;
    font-size: 12px !important;
}
    
.post-info .relative-date {
    color: #777 !important;
}

.topic-avatar img {
    height: 40px;
    width: 40px;
    background: #eee;
}

.post-links {
    display: none;
}

.post-menu-area {
    margin: 0;
}
    
.post-menu-area .show-replies {
    color: #818181 !important;
}
    
.post-controls {
    font-size: 11px;
    margin-left: 8px;
}

.cooked {
    padding: 15px 8px 0 8px;
    font-family: Verdana,Helvetica,Arial,sans-serif;
}

.cooked p {
    color: #444;
    line-height: 29px;
}

.cooked .mention {
    background-color: #E5F0F4;
    color: #4B7A8C;
}
    
.reply-to-tab {
    font-size: 12px !important;
    margin: -5px 5px 0 !important;
    color: #779BB5 !important;
}
    
.reply-to-tab img {
    display: none;
}
    
.embedded-posts {
    margin: 0 10px !important;
    line-height: 27px;
    width: 1088px !important;
    background: transparent;
    border: none;
}

.embedded-posts .topic-body{
    padding-bottom: 10px !important;
}
    
.embedded-posts .topic-avatar {
    margin-left: 4px;
}

.embedded-posts .trigger-user-card {
    margin-left: -8px;
}

.embedded-posts .topic-body {
    border: none;
}

.badge-notification.clicks {
    color: #555;
}

.cooked small {
    font-size: 11px;
}

.cooked code {
    background-color: #eee;
    color: #000;
}

.cooked .tweet {
    color: #888;
}

.cooked li {
    color: #888;
}

.cooked .quote .title {
    background-color: #F6F6F6;
    color: #666;
    padding-bottom: 10px;
    border: 1px solid #e0e0e0;
    border-bottom: none;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
    font-size: 12px;
    font-weight: bold;
}

.cooked blockquote {
    background-color: #F6F6F6 !important;
    border: 1px solid #e0e0e0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

.cooked blockquote p {
    color: #515151;
}

.cooked .twitterstatus {
    background-color: #F6F6F6 !important;
    border: 1px solid #e0e0e0;
    border-radius: 3px;
}

.cooked .whitelistedgeneric {
    background-color: #F6F6F6 !important;
    border: 1px solid #e0e0e0;
    border-radius: 3px;
}

.cooked .amazon {
    background-color: #F6F6F6 !important;
    border: 1px solid #e0e0e0;
    border-radius: 3px;
}

#topic-progress-wrapper {
    margin-right: -56px !important;
}

#topic-closing-info {
    border: none;
}

#topic-footer-buttons {
    margin-left: 10px;
}

.notification-options p {
    color: #bdbec2 !important;
    padding-bottom: 8px;
}

.title-wrapper .badge-wrapper.bullet span.badge-category {
    color: #888 !important;
}

.d-header {
    background-color: #232531;
}

.title-wrapper .topic-link {
    color: #bdbec2;
}

.wordpress_header {
    display: none;
}

.small-action-desc {
    margin-left: 20px;
    line-height: 25px;
}

.fa {
    line-height: 15px;
}

.time-gap {
    border: none;
}

#suggested-topics {
    display: none;
}

#topic {
    border-radius: 3px;
}

.alert-info {
    background-color: #353643 !important;
    color: #E0BB57!important;
    margin-top: -4px;
}
}

Le code bouge pas mal, le screenshot un peu moins. TRY IT!

Glasofruix · Octobre 2, 2015, 11:37

Je me disais justement que tout cet espace vide à droite mériterait d’être dégagé

Sinon mes modifs, toujours sur base du code de @Haza, des morceaux de celui de @chway et quelques modifs persos:

@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,700,700italic);
@-moz-document domain("forum.geekzone.fr"){    
body {
    background-color: #353643
}

/*html {
    font-family: "Open Sans", Helvetica,Arial,sans-serif;
}*/

#main-outlet {
    background-color: #F4F4F2;
}
    
.user-title {
      display: block !important;
    margin-top: -7px;
}
    
.topic-meta-data {
      margin-left: 60px;
    margin-top: 10px;
}
    
.embedded-posts {
    margin: 0 0 0 10px !important;
    width: 1088px !important;
    background: transparent;
    border: none;
}

.embedded-posts .topic-avatar {
    margin-left: 4px;
}

.embedded-posts .trigger-user-card {
    margin-left: -8px;
}

.small-action-desc {      /* x mois plus tard */
    margin-left: 20px;
    line-height: 25px;
}
    
    
.fa {
    line-height: 15px;    /* Horloge */
}
    
/*.reply-new {
    display: none !important;
}*/
    
.reply-new{
    margin: 50px 0 0 -206px !important;
    position: absolute;
    font-size: 12px;
}

    
/*.embedded-posts .topic-body {
    border: none;
}*/
    

.topic-body {
    min-width: 1066px; /* deux premières lignes modifient la taille */
    z-index:0;
    background-color:white;
    border-radius: 5px;
    border: 1px solid #ececec;
    margin: 10px;
    box-shadow: 6px 6px 6px -4px rgba(57, 57, 57, 0.4);
}

.post-menu-area {
    margin-bottom: 0;
}
    
.cooked p {
    color: #000;
}

.quote .title {
    border-left: 3px solid #ddd !important;
    border-right: 3px solid #ddd;
    border-top: 1px solid #ddd;
    background-color: #f6f6f6 !important;
}

blockquote {
    background-color: #f6f6f6; 
    border-left: 3px solid #ddd;
    border-right: 3px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.topic-avatar {
    margin-left: 20px;
    margin-top: 12px;
    position: absolute;
    z-index:1;
    border-top: none;
}
    
a.mention {
    background-color: #BBD3DD;
}

.reply-to-tab {
    background-color: #BBD3DD;
    padding: 0.35em;
    border-radius: 5px;
    color: #555 !important;
}
}

Les reply qu’on développe en cliquant sur le nom sont moches par contre, y a un truc spécifique en css pour ne toucher qu’à ça?

Cafeine · Octobre 2, 2015, 12:51

Gros warning : on update les betas régulièrement, je vois sur d’autres forums plein de mecs avec des problèmes à cause des CSS persos : DONT WHINE quand ça merde, commencez par virer vos custos. Merci.

chway · Octobre 2, 2015, 2:50

@Cafeine Bien. J’ai peut-être encore moyen de m’amuser donc.

Another update… Cette fois JE PENSE avoir fait le tour. (Voir mon post plus haut.)

Glasofruix · Octobre 2, 2015, 7:18

Du coup j’ai recopié aussi Sinon t’as fait un truc pour les « x mois plus tard »? Ca merdouille par chez moi.

chway · Octobre 2, 2015, 7:25

Yep. Essaye d’ajouter :

.small-action-desc {
    margin-left: 20px;
    line-height: 25px;
}

.fa {
    line-height: 15px;
}

.time-gap {
    border: none;
}

Glasofruix · Octobre 2, 2015, 7:27

Yep, j’ai tripoté le code et j’ai trouvé ça aussi, merci ;). Autre question, c’est quoi qui gère l’espacement entre les posts? J’arrive pas à mettre la main dessus.

chway · Octobre 2, 2015, 7:34

“margin: 13px 0 0 10px;” dans la partie .topic-body

Glasofruix · Octobre 2, 2015, 7:39

Hmmm, ça semble porter que sur la marge entre le post et la question initiale (quand on clique en haut à droite pour voir à qui on répond), pas entre deux posts différents. J’ai le truc “répondre en créant un sujet lié” qui s’intercale (je sais pas pourquoi, ni comment :D), c’est peut être pour ça.

Cest reply-new non? Yep, mais margin ne marche que d’un côté…

chway · Octobre 2, 2015, 7:49

reply-new, c’est le lien qui s’affiche à droite, il est caché dans mon style grace à :

.reply-new {
    display: none !important;
}

Maintenant si j’ai bien compris ce que tu cherche, c’est la dedans:

.embedded-posts {
    margin: 0 0 0 10px !important;
    min-width: 1088px !important;
    background: transparent;
    border: none;
}

Glasofruix · Octobre 2, 2015, 7:52

Ca c’est la question il me semble, je cherche à réduire la marge (haut et bas) du .reply-new (qui se trouve entre les posts maintenant en fait) j’aimerais autant garder le truc.

Bon, au final je l’ai dégagé aussi tiens.

chway · Octobre 2, 2015, 8:23

Désolé, j’ai mis un peu de temps à comprendre.

Si tu veux garder reply-new:

.reply-new{
    margin: 35px 0 0 -206px !important;
    position: absolute;
    font-size: 12px;
}

J’ai fais comme j’ai pu…

Glasofruix · Octobre 2, 2015, 8:35

Ah c’est pas mal ça, merki

Rivellon · Octobre 2, 2015, 9:13

tu nous donnera ta version finale ?

Glasofruix · Octobre 2, 2015, 9:16

Moi? Le code est au dessus, j’ai mis à jour. Par contre, comme j’ai qu’une vague idée de ce que je fais c’est super sale.