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