Skip to content

Instantly share code, notes, and snippets.

@julianlam
Last active October 29, 2017 13:02
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save julianlam/5110542203d04da69ba4e862827796da to your computer and use it in GitHub Desktop.
Save julianlam/5110542203d04da69ba4e862827796da to your computer and use it in GitHub Desktop.
/r/TheOrville CSS changes
/* Generic arrow styles for all updoot and downdoot buttons */
.arrow {
width: 0px;
height: 0px;
}
/* Rectangle below updoot */
.commentarea .arrow.upmod::after, .arrow.up::after {
position: relative;
top: 0.7rem;
left: -0.45rem;
display: inline-block;
width: 0.9rem;
height: 0.25rem;
content: "";
}
.commentarea .arrow.upmod::after {
background-color: #33dd33;
}
.commentarea .arrow.up::after {
background-color: #ded;
}
/* Rectangle above downdoot */
.commentarea .arrow.downmod::before, .arrow.down::before {
position: relative;
top: -1.7rem;
left: -0.5rem;
display: inline-block;
width: 0.95rem;
height: 0.25rem;
content: "";
}
.commentarea .arrow.downmod::before {
background-color: #dd3333;
}
.commentarea .arrow.down::before {
background-color: #edd;
}
.arrow.upmod {
background-image: none;
border-right: 0.5rem solid transparent;
border-left: 0.5rem solid transparent;
border-bottom: 1rem solid #33dd33;
}
.arrow.downmod {
background-image: none;
border-right: 0.5rem solid transparent;
border-left: 0.5rem solid transparent;
border-top: 1rem solid #cc3333;
}
.arrow.up {
background-image: none;
border-right: 0.5rem solid transparent;
border-left: 0.5rem solid transparent;
border-bottom: 1rem solid #ded;
}
.arrow.down {
background-image: none;
border-right: 0.5rem solid transparent;
border-left: 0.5rem solid transparent;
border-top: 1rem solid #edd;
}
/* Styles specific to the comments */
.commentarea .comment .midcol {
width: 2.3rem; /* widen voting container so horizontal vote controls fit w/o line break */
}
.commentarea .midcol.likes, .commentarea .midcol.unvoted, .commentarea .midcol.dislikes {
background-color: #acacac;
border-radius: 50%;
/*padding: 0.4rem 0.4rem 0.4rem 0.6rem;*/
padding: 0.5rem 0.6rem 0.5rem 0.8rem;
}
.commentarea .arrow.upmod, .commentarea .arrow.up {
display: inline-block;
margin-left: 0.3rem;
}
.commentarea .arrow.downmod, .commentarea .arrow.down {
margin-top: 0.8rem;
float: left;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment