{"id":17182178,"url":"https://github.com/prettydiff/hn_dark","last_synced_at":"2025-03-25T01:44:02.030Z","repository":{"id":147998355,"uuid":"264482290","full_name":"prettydiff/hn_dark","owner":"prettydiff","description":"Dark color theme for Hacker News","archived":false,"fork":false,"pushed_at":"2020-05-16T16:54:08.000Z","size":6,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-01-30T03:27:11.120Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"cc0-1.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/prettydiff.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-05-16T16:48:08.000Z","updated_at":"2020-05-17T04:50:21.000Z","dependencies_parsed_at":"2023-06-25T22:43:53.157Z","dependency_job_id":null,"html_url":"https://github.com/prettydiff/hn_dark","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prettydiff%2Fhn_dark","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prettydiff%2Fhn_dark/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prettydiff%2Fhn_dark/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prettydiff%2Fhn_dark/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/prettydiff","download_url":"https://codeload.github.com/prettydiff/hn_dark/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245383118,"owners_count":20606265,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-15T00:36:15.955Z","updated_at":"2025-03-25T01:44:02.023Z","avatar_url":"https://github.com/prettydiff.png","language":"CSS","readme":"# hn_dark\nDark color theme for Hacker News\n\n## Experiment with custom CSS on any Hacker News page\n1. Copy the code sample below and paste it into your browser console.\n2. Take your custom CSS and paste immediately below the comment in the code sample.\n3. Press *enter* on your keyboard.\n\n```javascript\nvar makedark = function (css) {var oldStyle=document.getElementsByTagName(\"style\")[0],style=document.createElement(\"style\");if (oldStyle!==undefined){oldStyle.parentNode.removeChild(oldStyle);}style.setAttribute(\"type\", \"text/css\");style.innerHTML=css;document.getElementsByTagName(\"head\")[0].appendChild(style);document.getElementsByTagName(\"body\")[0].setAttribute(\"class\", \"dark\")};makedark(`\n\n//paste css code below this line:\n\n\n`);\n```\n\n## Example using this CSS code:\n\n```javascript\nvar makedark = function (css) {var oldStyle=document.getElementsByTagName(\"style\")[0],style=document.createElement(\"style\");if (oldStyle!==undefined){oldStyle.parentNode.removeChild(oldStyle);}style.setAttribute(\"type\", \"text/css\");style.innerHTML=css;document.getElementsByTagName(\"head\")[0].appendChild(style);document.getElementsByTagName(\"body\")[0].setAttribute(\"class\", \"dark\")};makedark(`\n\n//paste css code below this line:\nbody,\ntd,\n.default,\n.admin,\n.title,\n.subtext,\n.yclinks,\n.pagetop,\n.comhead,\n.comment,\n.admin td,\n.subtext td,\ninput[type=\\\"submit\\\"] { font-family:Verdana, Geneva, sans-serif; }\n\nbody,\ntd,\n.default,\n.pagetop,\n.title { font-size:10pt; }\n\n.admin,\n.admin td   { font-size:8.5pt; }\n\n.subtext,\n.subtext td { font-size:7pt; }\n\n.comhead,\n.yclinks { font-size:8pt; }\n\n.comment { font-size:9pt; }\n\ntextarea,\ninput { font-family:monospace; font-size:10pt; }\n\na:link,\na:visited { text-decoration:none; }\n\n.hnname  { margin-right: 5px; }\n\n.noshow { display: none; }\n.nosee { visibility: hidden; pointer-events: none; cursor: default }\n\n.comment a:link,\n.comment a:visited,\n.subtext a:hover,\n.comhead a:hover,\n.hnmore { text-decoration:underline; }\n\n.default p { margin-top: 8px; margin-bottom: 0px; }\n\n.pagebreak {page-break-before:always}\n\npre { overflow: auto; padding: 2px; }\npre:hover { overflow:auto }\n\n.votearrow {\n  width:      10px;\n  height:     10px;\n  border:     0px;\n  margin:     3px 2px 6px;\n  background: url(\"grayarrow.gif\")\n  no-repeat;\n}\n\n.votelinks.nosee div.votearrow.rotate180 {\n  display: none;\n}\n\n@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {\n  .votearrow { background-size: 10px; background-image: url(\"grayarrow2x.gif\"); }\n}\n\n.rotate180 {\n  -webkit-transform: rotate(180deg);  /* Chrome and other webkit browsers */\n  -moz-transform:    rotate(180deg);  /* FF */\n  -o-transform:      rotate(180deg);  /* Opera */\n  -ms-transform:     rotate(180deg);  /* IE9 */\n  transform:         rotate(180deg);  /* W3C complaint browsers */\n\n  /* IE8 and below */\n  -ms-filter: \"progid:DXImageTransform.Microsoft.Matrix(M11=-1, M12=0, M21=0, M22=-1, DX=0, DY=0, SizingMethod='auto expand')\";\n}\n\n/* mobile device */\n@media only screen\nand (min-width : 300px)\nand (max-width : 750px) {\n  #hnmain { width: 100%; }\n  body { padding: 0; margin: 0; width: 100%; -webkit-text-size-adjust: none; }\n  td { height: inherit !important; }\n  .title, .comment { font-size: inherit;  }\n  span.pagetop { display: block; margin: 3px 5px; font-size: 12px; }\n  span.pagetop b { display: block; font-size: 15px; }\n  table.comment-tree .comment a { display: inline-block; max-width: 200px; overflow: hidden; white-space: nowrap;\n    text-overflow: ellipsis; vertical-align:top; }\n  img[src='s.gif'][width='40'] { width: 12px; }\n  img[src='s.gif'][width='80'] { width: 24px; }\n  img[src='s.gif'][width='120'] { width: 36px; }\n  img[src='s.gif'][width='160'] { width: 48px; }\n  img[src='s.gif'][width='200'] { width: 60px; }\n  img[src='s.gif'][width='240'] { width: 72px; }\n  img[src='s.gif'][width='280'] { width: 84px; }\n  img[src='s.gif'][width='320'] { width: 96px; }\n  img[src='s.gif'][width='360'] { width: 108px; }\n  img[src='s.gif'][width='400'] { width: 120px; }\n  img[src='s.gif'][width='440'] { width: 132px; }\n  img[src='s.gif'][width='480'] { width: 144px; }\n  img[src='s.gif'][width='520'] { width: 156px; }\n  img[src='s.gif'][width='560'] { width: 168px; }\n  img[src='s.gif'][width='600'] { width: 180px; }\n  img[src='s.gif'][width='640'] { width: 192px; }\n  img[src='s.gif'][width='680'] { width: 204px; }\n  img[src='s.gif'][width='720'] { width: 216px; }\n  img[src='s.gif'][width='760'] { width: 228px; }\n  img[src='s.gif'][width='800'] { width: 240px; }\n  img[src='s.gif'][width='840'] { width: 252px; }\n  .title { font-size: 11pt; line-height: 14pt;  }\n  .subtext { font-size: 9pt; }\n  .itemlist { padding-right: 5px;}\n  .votearrow { transform: scale(1.3,1.3); margin-right: 6px; }\n  .votearrow.rotate180 {\n    -webkit-transform: rotate(180deg) scale(1.3,1.3);  /* Chrome and other webkit browsers */\n    -moz-transform:    rotate(180deg) scale(1.3,1.3);  /* FF */\n    -o-transform:      rotate(180deg) scale(1.3,1.3);  /* Opera */\n    -ms-transform:     rotate(180deg) scale(1.3,1.3);  /* IE9 */\n    transform:         rotate(180deg) scale(1.3,1.3);  /* W3C complaint browsers */\n  }\n  .votelinks { min-width: 18px; }\n  .votelinks a { display: block; margin-bottom: 9px; }\n  input[type='text'], input[type='number'], textarea { font-size: 16px; width: 90%; }\n}\n\n.comment { max-width: 1215px; overflow: hidden }\npre { max-width: 900px; }\n\n@media only screen and (min-width : 300px) and (max-width : 389px) {\n  .comment { max-width: 270px; overflow: hidden }\n  pre { max-width: 200px; }\n}\n@media only screen and (min-width : 390px) and (max-width : 509px) {\n  .comment { max-width: 350px; overflow: hidden }\n  pre { max-width: 260px; }\n}\n@media only screen and (min-width : 510px) and (max-width : 599px) {\n  .comment { max-width: 460px; overflow: hidden }\n  pre { max-width: 340px; }\n}\n@media only screen and (min-width : 600px) and (max-width : 689px) {\n  .comment { max-width: 540px; overflow: hidden }\n  pre { max-width: 400px; }\n}\n@media only screen and (min-width : 690px) and (max-width : 809px) {\n  .comment { max-width: 620px; overflow: hidden }\n  pre { max-width: 460px; }\n}\n@media only screen and (min-width : 810px) and (max-width : 899px) {\n  .comment { max-width: 730px; overflow: hidden }\n  pre { max-width: 540px; }\n}\n@media only screen and (min-width : 900px) and (max-width : 1079px) {\n  .comment { max-width: 810px; overflow: hidden }\n  pre { max-width: 600px; }\n}\n@media only screen and (min-width : 1080px) and (max-width : 1169px) {\n  .comment { max-width: 970px; overflow: hidden }\n  pre { max-width: 720px; }\n}\n@media only screen and (min-width : 1170px) and (max-width : 1259px) {\n  .comment { max-width: 1050px; overflow: hidden }\n  pre { max-width: 780px; }\n}\n@media only screen and (min-width : 1260px) and (max-width : 1349px) {\n  .comment { max-width: 1130px; overflow: hidden }\n  pre { max-width: 840px; }\n}\n\n/* ------ colors ------ */\n\n/* default colors */\nbody { color:#828282; }\ntd { color:#828282; }\n.admin td { color:#000000; }\n.subtext td { color:#828282; }\na:link    { color:#000000; }\na:visited { color:#828282; }\n.default { color:#828282; }\n.admin   { color:#000000; }\n.title   { color:#828282; }\n.subtext { color:#828282; }\n.yclinks { color:#828282; }\n.pagetop { color:#222222; }\n.comhead { color:#828282; }\n.c00, .c00 a:link { color:#000000; }\n.c5a, .c5a a:link, .c5a a:visited { color:#5a5a5a; }\n.c73, .c73 a:link, .c73 a:visited { color:#737373; }\n.c82, .c82 a:link, .c82 a:visited { color:#828282; }\n.c88, .c88 a:link, .c88 a:visited { color:#888888; }\n.c9c, .c9c a:link, .c9c a:visited { color:#9c9c9c; }\n.cae, .cae a:link, .cae a:visited { color:#aeaeae; }\n.cbe, .cbe a:link, .cbe a:visited { color:#bebebe; }\n.cce, .cce a:link, .cce a:visited { color:#cecece; }\n.cdd, .cdd a:link, .cdd a:visited { color:#dddddd; }\n.pagetop a:visited { color:#000000;}\n.topsel a:link, .topsel a:visited { color:#ffffff; }\n.subtext a:link, .subtext a:visited { color:#828282; }\n.comhead a:link, .subtext a:visited { color:#828282; }\n.hnmore a:link, a:visited { color:#828282; }\n\n/* dark theme */\n.dark #pagespace,\n.dark .morespace{display:none}\n.dark .morelink,\n.dark .itemlist,\n.dark .fatitem{margin-top:16px}\n.dark select,\n.dark input,\n.dark textarea{background:#000;border-color:#999;color:#fff}\n.dark .hnuser font{color:#9c0}\n.dark .age{display:inline-block;margin:0 0 4px}\nbody.dark { background:#000;color:#eee; }\n.dark td { background:#333;color:#eee; }\n.dark .admin td { color:#eee; }\n.dark .subtext td { color:#aaa; }\n.dark .default { color:#aaa; }\n.dark .admin   { color:#eee; }\n.dark .title   { color:#aaa; }\n.dark .subtext { color:#aaa; }\n.dark .yclinks { color:#aaa; }\n.dark .pagetop { color:#ddd; }\n.dark .comhead { color:#aaa; }\n.dark .c00{color:#ccc}\n.dark a:link,\n.dark .c00 a:link { color:#adf; }\n.dark .pagetop a:link,\n.dark .itemlist a:link {color:#ddd}\n.dark .pagetop a:visited,\n.dark .itemlist a:visited {color:#999}\n.dark .c5a, .dark .c5a a:link, .dark .c5a a:visited { color:#bbb; }\n.dark .c73, .dark .c73 a:link, .dark .c73 a:visited { color:#aaa; }\n.dark .c82, .dark .c82 a:link, .dark .c82 a:visited { color:#999; }\n.dark .c88, .dark .c88 a:link, .dark .c88 a:visited { color:#888; }\n.dark .c9c, .dark .c9c a:link, .dark .c9c a:visited { color:#777; }\n.dark .cae, .dark .cae a:link, .dark .cae a:visited { color:#666; }\n.dark .cbe, .dark .cbe a:link, .dark .cbe a:visited { color:#555; }\n.dark .cce, .dark .cce a:link, .dark .cce a:visited { color:#444; }\n.dark .cdd, .dark .cdd a:link, .dark .cdd a:visited { color:#333; }\n.dark .topsel a:link, .dark .topsel a:visited { color:#fff;font-weight:bold }\n.dark .subtext a:link, .dark .subtext a:visited,\n.dark a:visited,\n.dark .hnmore a:link,\n.dark a:visited { color:#68b; }\n.dark .comhead a:link{color:#c96}\n.dark .comhead a:visited{color:#963}\n\n`);\n```","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fprettydiff%2Fhn_dark","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fprettydiff%2Fhn_dark","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fprettydiff%2Fhn_dark/lists"}