diff --git a/src/QuestionDetail.js b/src/QuestionDetail.js
index 134a27f..5fe5e97 100644
--- a/src/QuestionDetail.js
+++ b/src/QuestionDetail.js
@@ -126,7 +126,7 @@ class ChoiceInfo extends Component {
{this.state.text}
- {this.state.currentVotes}
+ {this.state.currentVotes} vote{this.state.currentVotes == 1 ? "" : "s"}
{Math.round(this.state.currentVotes / this.state.totalVotes * 100)}%
diff --git a/src/QuestionDetail.scss b/src/QuestionDetail.scss
index 6cc88b0..8f5d3cf 100644
--- a/src/QuestionDetail.scss
+++ b/src/QuestionDetail.scss
@@ -31,16 +31,22 @@
display: inline-block;
width: 30%;
min-width: 200px;
+ font-weight: bold;
}
.choice-votes,
.choice-percent {
display: inline-block;
width: 10%;
min-width: 100px;
+ color: #AAA;
}
&.selected {
background-color: #AAF;
+ .choice-votes,
+ .choice-percent {
+ color: white;
+ }
}
}
diff --git a/src/QuestionsList.scss b/src/QuestionsList.scss
index b9647f3..8188546 100644
--- a/src/QuestionsList.scss
+++ b/src/QuestionsList.scss
@@ -8,10 +8,13 @@
.QuestionInfo {
- width: 350px;
+ min-width: 250px;
+ max-width: 40%;
+ width: 100%;
+ float: left;
+
padding: 15px;
margin: 0 15px 15px 0;
- float: left;
border: 1px solid #AAA;
border-radius: 5px;
@@ -30,4 +33,11 @@
}
}
+ // clearfix
+ &:after {
+ content: "";
+ display: block;
+ clear: both,
+ }
+
}
\ No newline at end of file