Post any custom CSS you use here!
Please note that the stuff here is not officially maintained by the site’s coding team and may regress/have bugs.
Just posting this for the sake of getting the topic rolling for now. I’ll flesh this OP out and mention this topic in other appriopriate places over the next few days.
This first post will be updated fairly regularly to keep track of things.
Condense Postbodies, v1.2.1, by tn5421
.post-menu-area {
/* default is 20px, let's make that smaller */
margin: 0;
}
.topic-body .regular {
/* default is 15px, let's make that smaller */
margin-top: 5px;
}
.post-actions {
/*default is 10px, let's make that smaller */
margin-bottom: 5px;
}
p {
/* default is, like, 10px or so? 7 is plenty to distinguish paragraphs from newlines */
margin-top: 5px;
margin-bottom: 5px;
}
blockquote, .quote {
/* Quotes have to have bigger margins, or they don't display correctly */
margin-top: 5px;
margin-bottom: 5px !important;
}
blockquote {
padding: 6px !important;
}
.cooked, .d-editor-preview, html {
/* default is 1.4 ; a good setting is 1.2 for unzoomed, 1 is fine if you zoom in */
line-height: 1.1;
}
.avatar {
/* Mostly-square avatars with rounded corners; delete if this doesn't interest you. !important necessary to override because im too lazy to find the right tag */
border-radius: 15% !important;
}
I absolutely recommend Stylus over Stylish.
.post-menu-area {
/* default is 20px, let's make that smaller */
margin: 0;
}
.topic-body .regular {
/* default is 15px, let's make that smaller */
margin-top: 5px;
}
.post-actions {
/*default is 10px, let's make that smaller */
margin-bottom: 5px;
}
p {
/* default is, like, 10px or so? 7 is plenty to distinguish paragraphs from newlines */
margin-top: 5px;
margin-bottom: 5px;
}
blockquote,
.quote {
/* Quotes have to have bigger margins, or they don't display correctly */
margin-top: 5px;
margin-bottom: 5px !important;
}
.cooked,
.d-editor-preview,
html {
/* default is 1.4 ; a good setting is 1.2 for unzoomed, 1 is fine if you zoom in */
line-height: 1.1;
}
.avatar {
/* Mostly-square avatars with rounded corners; delete if this doesn't interest you. !important necessary to override because im too lazy to find the right tag */
border-radius: 15% !important;
}
.topic-body {
/* This controls just how large the body is. 85% for 120% zoom. up to 88% is fine for no zoom */
min-width: 88%;
}
#main-outlet {
/* Margin-left from 20-50px should be fine. max-width 1800px for no zoom, 1500px for 120% zoom */
margin-left: 30px;
max-width: 1800px;
}
.topic-timeline {
/* Most important to get right. 300px margin for 1500px width works fine at 120% zoom. 640px or so for 1800px works fine at 100% zoom. */
position: absolute;
left: 640px;
}
#d-toc {
/* 1250px is enough for 120% zoom. 1600px is enough for 100% zoom*/
position: sticky;
left: 1600px;
}
article.d-toc-article div.topic-body {
/* 1000px is just right for 120% zoom. 1450px is good for 100% zoom */
width: 1450px;
}
the link to the script is broken
It loads just fine for me. But that’s what I included the CSS for, just in case.
make a new style, copy the code from [the code] dropdown, save and refresh.
Already done, but thought I’d let you know.
this link is broken:
https://github.com/tn5421/tn5421/commit/750747daff8e69a637d1375d19565fccbb98a5e8
Oh right.
I forgot that I deleted that repository. Changed the url.
no need to customize such a GREAT site!
Are any of yall CSS experts?
Can you tell me why this code breaks certain post actions?
.topic-body {
/* This controls just how large the body is. 85% is default. up to 90% is fine */
min-width: 89%;
}
#main-outlet {
/* Margin-left from 20-50px should be fine. max-width 1800px for no zoom, 1500px for 120% zoom */
margin-left: 30px;
max-width: 1500px;
}
.topic-timeline {
/* Most important to get right. 395px margin for 1500px width works fine. 650px for 1800px works fine. */
margin-left: 395px !important;
}
is this the only code you’re running? if not, try only running it first just in case it’s an issue with rules not working together
I’m appending it to my custom theme as seen in the first reply
alright even better, i’ll fiddle around with it because just looking at the code i dont see anything wrong with it when i have time
im assuming at least the important tag is 100% necessary lol when i say nothing looks wrong
I try to avoid the important tag when it’s not necessary. It may not be 100% necessary for some of the stuff in the second post but it is 100% necessary for .topic-timeline as far as i can tell
im running the code right now, what isnt working specifically so i can try to replicate the issue
Without a reply window open, none of those options work