Skip to content

Instantly share code, notes, and snippets.

@davidglassborow
Forked from Pycea/fixed_header.css
Created March 23, 2021 20:36
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 davidglassborow/fc5eedbf368abfbb773add1a7a42c0a5 to your computer and use it in GitHub Desktop.
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.
/* 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;
}
/* 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;
}
/* 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