Commit b757225c by Chris Rodriguez

Fixing remaining contrast issue

parent 7e1de6ef
// LMS -- modules -- calculator
// ====================
div.calc-main {
.calc-main {
@extend %ui-print-excluded;
bottom: -126px;
......@@ -29,7 +29,7 @@ div.calc-main {
width: ($baseline*0.75);
&:hover, &:focus {
background-color: $gray-d1;
background: url("../images/calc-icon.png") $gray-d1 no-repeat center;
}
&.closed {
......@@ -44,7 +44,7 @@ div.calc-main {
}
}
div#calculator_wrapper {
#calculator_wrapper {
clear: both;
position: relative;
top: -36px;
......@@ -72,7 +72,7 @@ div.calc-main {
color: $white;
}
button#calculator_button {
#calculator_button {
background: #111;
border: 1px solid $black;
border-radius: 0;
......@@ -99,7 +99,7 @@ div.calc-main {
}
}
input#calculator_output {
#calculator_output {
background: #111;
border: 0;
box-shadow: none;
......@@ -114,14 +114,19 @@ div.calc-main {
width: flex-grid(4);
}
div.input-wrapper {
.input-wrapper {
@extend .clearfix;
float: left;
margin: 0;
position: relative;
width: flex-grid(7.5);
input#calculator_input {
.label-calc-input {
background: $black;
color: $white;
}
#calculator_input {
border: none;
box-shadow: none;
@include box-sizing(border-box);
......@@ -129,13 +134,15 @@ div.calc-main {
padding: 10px;
-webkit-appearance: none;
width: 100%;
background: $black;
color: $white;
&:focus {
border: none;
}
}
div.help-wrapper {
.help-wrapper {
position: absolute;
right: 0;
top: 0;
......
......@@ -11,7 +11,7 @@ from django.core.urlresolvers import reverse
<div id="calculator_wrapper">
<form id="calculator">
<div class="input-wrapper">
<label for="calculator_input" class="sr">${_('Calculator Input')}</label>
<label for="calculator_input" class="label-calc-input sr">${_('Calculator Input')}</label>
<input type="text" id="calculator_input" title="${_('Calculator Input Field')}" />
<div class="help-wrapper">
......@@ -135,7 +135,7 @@ from django.core.urlresolvers import reverse
</div>
</div>
<button id="calculator_button">=<span class="calc-button-label sr">${_('Calculate')}</span></button>
<input type="submit" id="calculator_button" value="=" aria-label="${_('Calculate')}">
<label for="calculator_output" class="calc-output-label sr">${_('Calculator Output')}</label>
<input type="text" id="calculator_output" readonly />
</form>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment