Skip to content

Instantly share code, notes, and snippets.

@appel
Last active February 7, 2018 15:11
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save appel/7a475dcbd3f469d73c756385b2c7cf06 to your computer and use it in GitHub Desktop.
Save appel/7a475dcbd3f469d73c756385b2c7cf06 to your computer and use it in GitHub Desktop.
Userstyle to make lite.cnn.io just a tad easier on the eyes (IMHO) https://news.ycombinator.com/item?id=15211976
@-moz-document domain("lite.cnn.io") {
@import url(//fonts.googleapis.com/css?family=Open+Sans);
body
{
font-family: 'Open Sans', sans-serif;
color: #333;
font-size: 120%;
line-height: 140%;
}
header,
main
{
max-width:768px;
margin: 0 auto;
padding: 20px;
}
ul
{
list-style: circle;
}
a {
color: #666;
text-decoration: none;
background-image: -webkit-linear-gradient(#fff 0%, #666 100%);
background-image: linear-gradient(#fff 0%, #666 100%);
background-repeat: repeat-x;
background-size: 1px 1px;
background-position: 0 95%;
text-shadow: 3px 0 #fff, 2px 0 #fff, 1px 0 #fff, -1px 0 #fff, -2px 0 #fff, -3px 0 #fff;
}
a:hover {
color: #f14f51;
text-decoration: none;
background-image: -webkit-linear-gradient(#fff 0%, #f14f51 100%);
background-image: linear-gradient(#fff 0%, #f14f51 100%);
background-repeat: repeat-x;
background-size: 1px 1px;
background-position: 0 95%;
text-shadow: 3px 0 #fff, 2px 0 #fff, 1px 0 #fff, -1px 0 #fff, -2px 0 #fff, -3px 0 #fff;
}
}
Copy link

ghost commented Sep 10, 2017

Loading an external font kinda breaks the purpose... am I right?

@appel
Copy link
Author

appel commented Sep 10, 2017

@chewzerita Yep, you're right. Definitely don't use this userstyle if you're looking for the fastest experience. I just think this makes the page look a little better. And I personally don't mind loading that external font (which is likely cached anyway) on my gigabit fiber network. ;)

Edit: Alternatively, you could replace Open Sans and use the following font-family (taken from Github):

font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment