Answer Color Change?

Question

How can you change the color of the answers on the questions page when a question is answered. for example: Green when it has 1-10 answers red if it has 0 and gold if it has 10+

Answer 1

Use an advanced theme: http://www.question2answer.org/advanced.php#theme-advanced

In qa-theme.php in your theme directory, override the function a_count($post), something like this (code not tested):

function a_count($post)
{
  if (@$post['answers']['data']>10)
    $this->output_split($post['answers'], 'qa-a-count-many');
  else if (@$post['answers']['data']>0)
    qa_html_theme_base::a_count($post);
  else
    $this->output_split(@$post['answers'], 'qa-a-count-zero');
}

Then add some new CSS classes to qa-styles.css in your theme directory which match the HTML output for the different cases, changing the color as appropriate.

Comments

Parse error: syntax error, unexpected T_IS_IDENTICAL in /home/**/**/**/**/qa-theme/sot/qa-theme.php on line 19

which is:
  if (@$post['answers'])===0)

---

Yes, I had a syntax error in the above code - fixed now.

---

A question with 0 answers is the same color as one with 1 answer/
and
A quesiton with 10 answers is the same color as one with 1 answer.

---

Is the HTML which is output different for the different cases? If so the code I supplied did its job, and now you need to modify the CSS file as appropriate.

---

They are all the "qa-a-count-many" class

---

OK, please try again with the latest corrected code above.

---

10+ is working, but 0 and 1 are both the "qa-a-count" class rather then 0 being the "qa-a-count-zero" class

:P getting there :)

---

OK - and now?

---

Yes! Thank you so much, finally nailed it! Heres the css i used, i changed it a little to look like stackexchange :P but thats not what i have on my site:

==========
New Classes:
==========

/* Question Colors */

.qa-a-count-zero {background:#9A4443; text-align:center; float:left; margin:0 3px 0 0; padding:5px; width:46px; height:38px; overflow:hidden; margin-right:1.5em;}
.qa-a-count-many {background:#F9850E; text-align:center; float:left; margin:0 3px 0 0; padding:5px; width:46px; height:38px; overflow:hidden; margin-right:1.5em;}
.qa-a-count-zero-data {font-size:24px; font-weight:bold; color : #fff;}
.qa-a-count-zero-pad {font-size:11px; color : #fff;}
.qa-a-count-many-data {font-size:24px; font-weight:bold; color : #fff;}
.qa-a-count-many-pad {font-size:11px; color : #fff;}

===============
Old Classes Modified:
===============

/* Answer count */

.qa-a-count {background:#75855E; text-align:center; float:left; margin:0 3px 0 0; padding:5px; width:46px; height:38px; overflow:hidden; margin-right:1.5em;}
.qa-a-count-data {font-size:24px; font-weight:bold; color : #fff;}
.qa-a-count-pad {font-size:11px; color : #fff;}

===
and
===

/* Votes */

/* qa-*-hover classes are substituted by JS (for IE), qa-*-button:hover is a backup for other browsers if JS is off */

.qa-voting {background-color:#EEEEEE; margin-right:3px; float:left; height:38px; overflow:hidden; padding:5px 0; }
.qa-vote-buttons {float:left; width:18px; padding-left:12px;}

---

OK, I added another @ in the answer to address this.

---

Alright, we got it now :P