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"] { #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; color: #a02b24;
visibility: visible;
content: "\2610"; content: "\2610";
font-size: 18px; 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"; content: "\2611";
} }

View file

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

View file

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