cleaning css

This commit is contained in:
Abram Kash 2018-11-13 19:24:12 -05:00
parent e92baa54b4
commit fb9655bc95
3 changed files with 46 additions and 68 deletions

View File

@ -33,55 +33,29 @@
<div id="mainFrame">
<h2 id="question-number">Loading...</h2>
<div class="questionBox"><p id="question-text"></p></div>
<div class="navButtons">
<button
class="buttonQuestion"
onclick="next_question(1)"
style="background-color: #1b5e20;"
>
<div class="navButtons questionButtons">
<button onclick="next_question(1)" class="strong-agree">
Absolutely agree
</button>
<button
class="buttonQuestion"
onclick="next_question(2/3)"
style="background-color: #4caf50;"
>
<button onclick="next_question(2/3)" class="agree">
Somewhat agree
</button>
<button
class="buttonQuestion"
onclick="next_question(0)"
style="background-color: #bbbbbb;"
>
<button onclick="next_question(0)" class="neutral">
Neutral or hesitant
</button>
<button
class="buttonQuestion"
onclick="next_question(-2/3)"
style="background-color: #f44336;"
>
<button onclick="next_question(-2/3)" class="disagree">
Rather disagree
</button>
<button
class="buttonQuestion"
onclick="next_question(-1)"
style="background-color: #b71c1c;"
>
<button onclick="next_question(-1)" class="strong-disagree">
Absolutely disagree
</button>
</div>
<div class="navButtons">
<button class="button" onclick="prev_question()" id="back_button">
<a href="#" class="button" onclick="prev_question()" id="back_button">
Return to the previous question
</button>
<button
class="button"
onclick="location.href='/';"
id="back_button_off"
>
</a>
<a class="button" href="/" id="back_button_off">
Go back to home page
</button>
</a>
</div>
</div>
</div>

View File

@ -50,7 +50,7 @@
</div>
<div class="navButtons">
<button
class="button buttonLink"
class="button"
onclick="shareLink();"
id="buttonLink"
>
@ -70,7 +70,7 @@
<button
id="download"
target="_blank"
class="button buttonLink"
class="button"
onclick="download_image();"
>
<svg

View File

@ -208,7 +208,7 @@ h4 {
text-align: center;
max-width: 400px;
}
.buttonQuestion,
button,
.button {
text-align: center;
margin: 0.5em 0;
@ -218,31 +218,35 @@ h4 {
border-radius: 3px;
text-decoration: none;
font-size: 18px;
}
.button {
background-color: #500076;
color: white;
cursor: pointer;
}
.buttonQuestion,
#back_button,
#back_button_off {
button.strong-agree {
background-color: #1b5e20;
}
button.agree {
background-color: #4caf50;
}
button.neutral {
background-color: #bbbbbb;
}
button.disagree {
background-color: #f44336;
}
button.strong-disagree {
background-color: #b71c1c;
}
.questionButtons button {
color: white;
width: 100%;
padding: 0.5em 0;
}
.button:hover,
#back_button:hover,
#back_button_off:hover {
.button:hover {
background-color: white;
color: #500076;
}
.buttonLink {
background-color: #500076;
color: white;
}
.buttonLink:hover {
color: #500076;
}
.button svg {
fill: white;
vertical-align: text-bottom;
@ -262,6 +266,20 @@ h4 {
.buttonLinkGood:hover svg {
fill: white;
}
.urlToCopyContainer {
width: 100%;
text-align: center;
}
.urlToCopy {
max-width: 400px;
background-color: white;
display: inline-block;
padding: 0.5em;
margin: 1em 0 0;
z-index: 6;
border-radius: 3px;
word-break: break-all;
}
.flagDecoration {
text-align: center;
@ -282,20 +300,6 @@ h4 {
margin: 1em 0;
font-size: calc(14px + 2vw);
}
.urlToCopyContainer {
width: 100%;
text-align: center;
}
.urlToCopy {
max-width: 400px;
background-color: white;
display: inline-block;
padding: 0.5em;
margin: 1em 0 0;
z-index: 6;
border-radius: 3px;
word-break: break-all;
}
.scale {
display: flex;