diff options
| -rw-r--r-- | css/challenge.css | 48 | ||||
| -rw-r--r-- | pages/challenge.php | 8 |
2 files changed, 36 insertions, 20 deletions
diff --git a/css/challenge.css b/css/challenge.css index 0380f4f..787679f 100644 --- a/css/challenge.css +++ b/css/challenge.css @@ -5,11 +5,30 @@ font-weight: bold; } #challenge_wrapper #challenges_listing { } -.challenge_complete { - color:#008000; +.challenge_ulist +{ + list-style-type:none; + padding-left:0px; + margin-left:0px; +} +.challenge_ulist li +{ + /* Replace the bullet-points with challenge complete/incomplete images */ + background-position: 0 5px; + background-repeat: no-repeat; + background-size: 28px 28px; + padding-left: 30px; + padding-top: 6px; +} +.challenge_ulist .challenge_complete +{ + background-image:url('../images/challenge_complete.png'); font-weight: normal; + color:#008000; } -.challenge_incomplete { +.challenge_ulist .challenge_incomplete +{ + background-image:url('../images/challenge_incomplete.png'); font-weight: bold; color:#DD1111; } @@ -21,18 +40,6 @@ display: none; } -.challengelist_map { - float:left; - padding: 15px; - background-color:#333; - margin: 20px; - border-radius:10px; - cursor:pointer; -} -.challengelist_map:hover { - background-color:#444; -} - /** Challenge listing page **/ #challengelist_wrapper #challengelist {} #challengelist_wrapper #challengelist .challengelist_tier { @@ -54,4 +61,15 @@ height: 32px; background-image: url("../images/challenge_incomplete.png"); float: right; +} +.challengelist_map { + float:left; + padding: 15px; + background-color:#333; + margin: 20px; + border-radius:10px; + cursor:pointer; +} +.challengelist_map:hover { + background-color:#444; }
\ No newline at end of file diff --git a/pages/challenge.php b/pages/challenge.php index 35c9525..ceefebe 100644 --- a/pages/challenge.php +++ b/pages/challenge.php @@ -131,21 +131,19 @@ function displayChallenges($challengeResultset) {
echo '<div id="challenges">';
echo '<div id="challenges_title">Challenges</div>';
- echo '<div id="challenges_listing"><ol>';
+ echo '<div id="challenges_listing"><ul class="challenge_ulist">';
while($challenge = mysql_fetch_array($challengeResultset))
{
$mapID = $_GET["mapID"];
$challengeId = $challenge["challengeID"];
- echo "<li>";
if($challenge["dateSolved"] !== NULL)
$cssClass = "challenge_complete";
else
$cssClass = "challenge_incomplete";
$loadSolutionString = "<a href='javascript:requestChallengeSolution(\"$mapID\", \"$challengeId\");'> Load this solution</a>";
- echo "<span class='$cssClass' id='challenge_id_$challengeId'>" . getChallengeDisplayString($challenge) . " $loadSolutionString </span>";
- echo "</li>";
+ echo "<li class='$cssClass' id='challenge_id_$challengeId'>" . getChallengeDisplayString($challenge) . " $loadSolutionString </li>";
}
- echo "</ol></div></div>";
+ echo "</ul></div></div>";
}
/**
|