Fix private repositories checkbox not being visible in Firefox.

Firefox doesn't support generated content in before/after pseudo classes applied
to <input type="checkbox"> elements. Switch instead to adding the custom
checkbox glyph to the <label> for the checkbox.

Thanks to @snarfed for reporting this.
This commit is contained in:
Mihai Parparita 2014-12-20 22:08:06 -08:00
parent 48034e3b3f
commit fc94f2ff06
3 changed files with 11 additions and 11 deletions

View file

@ -226,20 +226,20 @@ input[type="submit"].inline.destructive {
}
#sign-in-form input[type="checkbox"] {
visibility: hidden;
display: none;
}
#sign-in-form input[type="checkbox"]:before {
#sign-in-form input[type="checkbox"] + label:before {
color: #a02b24;
visibility: visible;
content: "\2610";
font-size: 18px;
position: relative;
top: -6px;
left: 6px;
}
#sign-in-form input[type="checkbox"]:checked:before {
#sign-in-form input[type="checkbox"] + label:active {
opacity: 0.4;
}
#sign-in-form input[type="checkbox"]:checked + label:before {
content: "\2611";
}

View file

@ -13,8 +13,8 @@
<span class="mega-octicon octicon-mark-github"></span>
<input type="hidden" name="continue_url" value="{{.ContinueUrl}}">
<input type="submit" class="action-button" value="Sign In with GitHub">
<label>
<input type="checkbox" name="include_private" value="1" checked>
<input type="checkbox" name="include_private" value="1" checked id="include_private">
<label for="include_private">
Include private repositories
</label>
</form>

View file

@ -22,8 +22,8 @@
<span class="mega-octicon octicon-mark-github"></span>
<input type="hidden" name="continue_url" value="{{.ContinueUrl}}">
<input type="submit" class="action-button" value="Sign In with GitHub">
<label>
<input type="checkbox" name="include_private" value="1" checked>
<input type="checkbox" name="include_private" value="1" checked id="include_private">
<label for="include_private">
Include private repositories
</label>
</form>