-
-
Save davidglassborow/fc5eedbf368abfbb773add1a7a42c0a5 to your computer and use it in GitHub Desktop.
Styling improvements for the ACX Substack. To load into Safari, copy the ones you want into a file, then go to Preferences > Advanced > Style sheet and select your file.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Fixes the header to the top of the page */ | |
div#entry > div#main .main-menu-content { | |
position: relative !important; | |
top: 0 !important; | |
} | |
div#entry > div#main .main-menu .backdrop { | |
position: fixed !important; | |
} | |
div#entry > div#main .topbar-replacement { | |
display: none; | |
} | |
div#entry > div#main .comment .comment-anchor { | |
top: 0 !important; | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Hides reactions */ | |
div#entry > div#main .comment-actions span:first-child { | |
display: none; | |
} | |
div#entry > div#main .comment-actions span:nth-child(2) { | |
margin-left: 0 !important; | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Makes ACX look like the old SSC */ | |
div#entry > div#main { | |
-webkit-font-smoothing: auto !important; | |
} | |
div#entry > div#main article div p { | |
color: #333 !important; | |
font: 12px/20px Verdana, sans-serif !important; | |
} | |
div#entry > div#main h1.post-title.short.unpublished { | |
font-size: 16px !important; | |
line-height: 1.3em !important; | |
margin-bottom: 10px !important; | |
text-transform: uppercase !important; | |
letter-spacing: 1px !important; | |
font-family: Georgia, "Bitstream Charter", serif !important; | |
} | |
div#entry > div#main td.post-meta-item.post-date { | |
color: #888 !important; | |
font-size: 10px !important; | |
font-family: Verdana, sans-serif !important; | |
letter-spacing: 1px !important; | |
background: #f9f9f9 !important; | |
border: 1px solid #eee !important; | |
padding: 5px 7px !important; | |
display: inline !important; | |
text-transform: uppercase !important; | |
text-shadow: 1px 1px 1px #fff !important; | |
} | |
div#entry > div#main td.post-meta-item.post-date:before { | |
content: "Posted " !important; | |
} | |
div#entry > div#main td.post-meta-item.post-date:after { | |
content: " by Scott Alexander" !important; | |
} | |
div#entry > div#main .single-post { | |
border: 1px solid #d5d5d5 !important; | |
border-radius: 10px !important; | |
background: #fff !important; | |
padding: 20px 28px !important; | |
margin-bottom: 10px !important; | |
} | |
div#entry > div#main .single-post-container { | |
background: #f0f0f0 !important; | |
padding: 10px 0px !important; | |
} | |
div#entry > div#main .single-post a { | |
color: #0066cc !important; | |
text-decoration: underline !important; | |
} | |
div#entry > div#main .post { | |
padding: 0 !important; | |
} | |
div#entry > div#main blockquote { | |
border-left: 4px solid #ddd !important; | |
margin: 0 2em !important; | |
padding: 0 1em !important; | |
} | |
div#entry > div#main blockquote p { | |
margin-left: 0 !important; | |
font-family: Georgia, "Bitstream Charter", serif !important; | |
font-style: italic !important; | |
font-size: 13px !important; | |
line-height: 24px !important; | |
color: #333 !important; | |
} | |
div#entry > div#main .subtitle { | |
font-size: 12px !important; | |
padding-bottom: 8px !important; | |
} | |
div#entry > div#main .main-menu .topbar .container .headline { | |
text-decoration: none !important; | |
} | |
div#entry > div#main .main-menu .topbar .container .headline .name { | |
font-size: 43px !important; | |
max-height: 100px !important; | |
color: white !important; | |
font-family: 'Raleway', Open Sans, Arial, sans-serif !important; | |
text-align: center !important; | |
letter-spacing: 2px !important; | |
text-decoration: none !important; | |
} | |
div#entry > div#main .topbar { | |
background: linear-gradient(to bottom, rgba(139,171,232,1) 0%, rgba(79,115,193,1) 100%) !important; | |
text-decoration: none !important; | |
} | |
div#entry > div#main button.button.primary.subscribe-cta.subscribe-btn { | |
display: none !important; | |
} | |
div#entry > div#main .full-container-border { | |
display: none !important; | |
} | |
div#entry > div#main .comments-page > .container { | |
background-color: white !important; | |
justify-content: center !important; | |
border: 1px solid #d5d5d5 !important; | |
border-radius: 10px !important; | |
padding: 25px !important; | |
} | |
div#entry > div#main .comments-page .container .comments-heading { | |
margin-top: 0 !important; | |
} | |
@media screen and (min-width: 768px) { | |
div#entry > div#main .comments-page > .container { | |
width: 675px !important; | |
} | |
} | |
div#entry > div#main div.buttons.notification-container { | |
filter: brightness(3) !important; | |
transform: scale(.7) | |
} | |
div#entry > div#main img.logo { | |
margin-right: 30px !important; | |
} | |
div#entry > div#main button.comments-page-sort-menu-button { | |
background: transparent !important; | |
} | |
div#entry > div#main table.comment-content tr td { | |
border: 1px solid #ddd !important; | |
padding: 10px !important; | |
border-radius: 10px !important; | |
flex-grow: 1 !important; | |
background: #fafafa !important; | |
} | |
div#entry > div#main table.comment-content.new-comment tr td { | |
border: 2px solid #5a5 !important; | |
} | |
div#entry > div#main table.comment-content tr td.comment-head { | |
border: none !important; | |
flex-grow: 0 !important; | |
background: white !important; | |
} | |
div#entry > div#main table tr { | |
display: flex !important; | |
} | |
div#entry > div#main td.post-meta-item.icon { | |
margin-left: 10px !important; | |
} | |
div#entry > div#main .comments-page { | |
background: #f0f0f0 !important; | |
padding-top: 10px !important; | |
} | |
div#entry > div#main .comment-meta span:first-child a { | |
font-family: Verdana, sans-serif !important; | |
font-weight: bold !important; | |
color: black !important; | |
text-decoration: none !important; | |
} | |
div#entry > div#main .comment-meta span:first-child a:after { | |
content: " says:" !important; | |
font-weight: normal; | |
font-style: italic; | |
} | |
div#entry > div#main .comment-meta span:nth-child(2) { | |
display: block !important; | |
padding-bottom: 10px !important; | |
margin-left: 0 !important; | |
} | |
div#entry > div#main .comment-meta span:nth-child(2) a { | |
font-family: Georgia, "Bitstream Charter", serif !important; | |
color: #888 !important; | |
text-decoration: none !important; | |
} | |
div#entry > div#main .comment-meta span:nth-child(2) a:before { | |
content: "\a" !important; | |
white-space: pre !important; | |
} | |
div#entry > div#main .comment-meta .highlight { | |
margin-left: 0 !important; | |
} | |
div#entry > div#main .comment-body p { | |
font: 12px/20px Verdana, sans-serif !important; | |
color: #333 !important; | |
} | |
div#entry > div#main .comment-actions span a { | |
color: #888 !important; | |
} | |
div#entry > div#main .comment.selected > .comment-content > tr > td:nth-child(2) { | |
background: #de912d2c !important; | |
} | |
div#entry > div#main .comment.selected > .comment-content::before { | |
background: inherit !important; | |
} | |
div#entry > div#main .profile-img-wrap img { | |
border-radius: 0px !important; | |
height: 40px !important; | |
width: 40px !important; | |
position: relative !important; | |
right: 8px !important; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment