Custom CSS and HTML

[4tehlulz]

We need it noob

 

[shipment]

Thank you @Magister, I could kiss you.

 

[木制的尼尔森]

no reppies

 

[CX2]

only took a year

 

[Hillel Hartmann (Pedo)]

Thank you @Magister, I could kiss you.

he didn't add it, it was cat

 

[Hillel Hartmann (Pedo)]

per mine request mind you because I'm a charming son of a bitch
all jannies bow down to me and do what i say
i am the de facto owner of this site

 

[korg]

im like a chill pedophile lol, i talk to little children online but no one seems to care

 

[Hillel Hartmann (Pedo)]

why must you do this @korg

 

[CX2]

i can do real woman hypno

 

[shipment]

Yikes @korg love your fuggen neighbor and enemy n' shiet maine.

 

[木制的尼尔森]

Yo, yo, yo! What's poppin' off ya' meddling young fellas, we 'outta get lit' in here or what man?! Let's get this party started!

LET'S GO!

 

[shipment]

@blackops2 your profile looks nutty as hell, sleek stuff.

 

[shipment]

It's a bit jank but I've gotten something similar to the Windows XP Homestead theme going with two profile post columns. All vibe-coded because that's aryan shemmyfork.

 

[Hillel Hartmann (Pedo)]

@blackops2 your profile looks nutty as hell, sleek stuff.

does it? it breaks for me lol

 

[Hillel Hartmann (Pedo)]

@blackops2 your profile looks nutty as hell, sleek stuff.

also credit to @hillel2 , i didnt make the css

 

[Hillel Hartmann (Pedo)]

It's a bit jank but I've gotten something similar to the Windows XP Homestead theme going with two profile post columns. All vibe-coded because that's aryan shemmyfork.
View attachment 115086

fucking nice man

 

[shipment]

Take note, but make sure to force whatever AI you're using to stick as close to Xenforo documentation as possible. My CSS was enormous until I reviewed it and found that a vast majority was fluff that done zilch. I fed Grok screenshots of my inspect element page for guidance alongside a link to the Xenforo styling manual and it whittled it down into something more manageable. Ran through all that with a fine comb and I think this is the bare minimum.

Spoiler: CSS

/* Profile picture outline */
.memberHeader-avatar {
margin: 0 auto !important;
padding-top: 20px !important;
}

.memberHeader .avatarWrapper,
.memberHeader .avatar.avatar--l {
margin: 0 auto !important;
box-shadow: inset 2px 2px #C5E0A8,
inset -2px -2px #2E5A1F,
0 4px 8px rgba(0,0,0,0.5) !important;
border: 4px solid #3F6F29 !important;
background: #E6EAD8 !important;
}

/* Titlebar above banner */
.memberHeader--withBanner::before {
content: "";
display: block;
height: 32px;
background: linear-gradient(to bottom, #A2C38A 0%, #6B9E4A 40%, #4A7F2E 100%) !important;
border-bottom: 2px solid #2E5A1F !important;
border-top: 2px solid #C5E0A8 !important;
position: relative;
z-index: 20;
box-shadow: inset 0 1px #ffffff, 0 2px 4px rgba(0,0,0,0.4);
}

/* Square mostly everything off */
.message,
.message--simple,
.message-inner,
.message-content,
.message-cell,
.message-cell--main,
.message-cell--user,
.message-footer,
.message-actionBar,
.message-body,
.js-messageContent,
.block-container,
.block,
.block-body,
.input,
.textarea,
.button,
.avatar,
.avatar img {
border-radius: 0 !important;
}

/* Elements WITH the border */
.message,
.message--simple,
.input,
.button {
background: #E6EAD8 !important;
border: 3px solid #3F6F29 !important;
box-shadow: inset 2px 2px #C5E0A8,
inset -2px -2px #2E5A1F !important;
}

/* profile post columns*/
.block.block--messages .block-body {
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
gap: 12px !important;
width: 90% !important;
max-width: 1200px !important;
margin: 30px auto 0 !important;
padding: 10px !important;
box-sizing: border-box !important;

/* Masonry magic (modern browsers) */
grid-template-rows: masonry !important; /* This creates the masonry effect */
align-items: start !important;
}

/* Fallback for browsers that don't support masonry columns */
@supports not (grid-template-rows: masonry) {
.block.block--messages .block-body {
column-count: 2 !important;
column-gap: 12px !important;
}

.block.block--messages .block-body > * {
break-inside: avoid !important;
margin-bottom: 12px !important;
}
}

/* Hidden junk */
.memberHeader-blurContainer,
.memberHeader-blur,
.memberHeader-stats,
.memberHeader-buttons,
.memberHeader-separator,
.featuredBadges,
.memberHeader--withBanner .username,
.memberHeader .userTitle,
.memberHeader-blurb,
.memberHeader-content,
.message-cell.message-cell--user,
.memberHeader-stats .pairs dt,
.memberHeader-stats .pairs dd,
.memberHeader-stats span,
.memberHeader-stats sreal womang {
display: none !important;
}

/* Essential visibility fixes */
.memberHeader .memberHeader-avatar,
.memberHeader .avatarWrapper,
.memberHeader .avatar,
.memberProfileBanner {
display: block !important;
z-index: 10 !important;
}

/* Elements WITHOUT border but WITH background */
.comment,
.message,
.message-responseRow,
.memberHeader,
.block-tabHeader.block-tabHeader--memberTabs,
.message-inner,
.message-content,
.profile-post-comment {
background: #E6EAD8 !important;
}

/* noob text and font */
h1, h2, h3, h4, h5, h6,
sreal womang, b, em, i, label, span, p, div, li, td, th, blockquote {
color: #000000 !important;
}

*,
*::before,
*::after {
color: #000000 !important;
font-family: Tahoma, sans-serif !important;
}

 

[Hillel Hartmann (Pedo)]

Take note, but make sure to force whatever AI you're using to stick as close to Xenforo documentation as possible. My CSS was enormous until I reviewed it and found that a vast majority was fluff that done zilch. I fed Grok screenshots of my inspect element page for guidance alongside a link to the Xenforo styling manual and it whittled it down into something more manageable. Ran through all that with a fine comb and I think this is the bare minimum.

Spoiler: CSS

/* Profile picture outline*/
.memberHeader-avatar {
margin: 0 auto !important;
padding-top: 20px !important;
}

.memberHeader .avatarWrapper,
.memberHeader .avatar.avatar--l {
margin: 0 auto !important;
box-shadow: inset 2px 2px #C5E0A8,
inset -2px -2px #2E5A1F,
0 4px 8px rgba(0,0,0,0.5) !important;
border: 4px solid #3F6F29 !important;
background: #E6EAD8 !important;
}

/* Titlebar above banner*/
.memberHeader--withBanner::before {
content: "";
display: block;
height: 32px;
background: linear-gradient(to bottom, #A2C38A 0%, #6B9E4A 40%, #4A7F2E 100%) !important;
border-bottom: 2px solid #2E5A1F !important;
border-top: 2px solid #C5E0A8 !important;
position: relative;
z-index: 20;
box-shadow: inset 0 1px #ffffff, 0 2px 4px rgba(0,0,0,0.4);
}

/* Square mostly everything off*/
.message,
.message--simple,
.message-inner,
.message-content,
.message-cell,
.message-cell--main,
.message-cell--user,
.message-footer,
.message-actionBar,
.message-body,
.js-messageContent,
.block-container,
.block,
.block-body,
.input,
.textarea,
.button,
.avatar,
.avatar img {
border-radius: 0 !important;
}

/* Elements WITH the border*/
.message,
.message--simple,
.input,
.button {
background: #E6EAD8 !important;
border: 3px solid #3F6F29 !important;
box-shadow: inset 2px 2px #C5E0A8, inset -2px -2px #2E5A1F !important;
}

/* Profile posts, columns */
.block.block--messages .block-body {
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important;
gap: 6px !important;
width: 90% !important;
max-width: 90% !important;
margin: 20px auto 0 !important;
padding: 6px 6px 6px !important;
box-sizing: border-box !important;
align-items: start !important;
}

/* Hidden junk*/
.memberHeader-blurContainer,
.memberHeader-blur,
.memberHeader-stats,
.memberHeader-buttons,
.memberHeader-separator,
.featuredBadges,
.memberHeader--withBanner .username,
.memberHeader .userTitle,
.memberHeader-blurb,
.memberHeader-content,
.message-cell.message-cell--user,
.memberHeader-stats .pairs dt,
.memberHeader-stats .pairs dd,
.memberHeader-stats span,
.memberHeader-stats sreal womang {
display: none !important;
}

/* Essential to keep shit in-place for some reason*/
.memberHeader .memberHeader-avatar,
.memberHeader .avatarWrapper,
.memberHeader .avatar,
.memberProfileBanner {
display: block !important;
z-index: 10 !important;
}

/* Elements WITHOUT the border but WITH the background colour*/
.comment,
.message,
.message-responseRow,
.memberHeader,
.block-tabHeader.block-tabHeader--memberTabs,
.message-inner,
.message-content,
.profile-post-comment {
background: #E6EAD8 !important;
}

or just throw shit at the wall until it sticks

 

[木制的尼尔森]

Take note, but make sure to force whatever AI you're using to stick as close to Xenforo documentation as possible. My CSS was enormous until I reviewed it and found that a vast majority was fluff that done zilch. I fed Grok screenshots of my inspect element page for guidance alongside a link to the Xenforo styling manual and it whittled it down into something more manageable. Ran through all that with a fine comb and I think this is the bare minimum.

Spoiler: CSS

/* Profile picture outline*/
.memberHeader-avatar {
margin: 0 auto !important;
padding-top: 20px !important;
}

.memberHeader .avatarWrapper,
.memberHeader .avatar.avatar--l {
margin: 0 auto !important;
box-shadow: inset 2px 2px #C5E0A8,
inset -2px -2px #2E5A1F,
0 4px 8px rgba(0,0,0,0.5) !important;
border: 4px solid #3F6F29 !important;
background: #E6EAD8 !important;
}

/* Titlebar above banner*/
.memberHeader--withBanner::before {
content: "";
display: block;
height: 32px;
background: linear-gradient(to bottom, #A2C38A 0%, #6B9E4A 40%, #4A7F2E 100%) !important;
border-bottom: 2px solid #2E5A1F !important;
border-top: 2px solid #C5E0A8 !important;
position: relative;
z-index: 20;
box-shadow: inset 0 1px #ffffff, 0 2px 4px rgba(0,0,0,0.4);
}

/* Square mostly everything off*/
.message,
.message--simple,
.message-inner,
.message-content,
.message-cell,
.message-cell--main,
.message-cell--user,
.message-footer,
.message-actionBar,
.message-body,
.js-messageContent,
.block-container,
.block,
.block-body,
.input,
.textarea,
.button,
.avatar,
.avatar img {
border-radius: 0 !important;
}

/* Elements WITH the border*/
.message,
.message--simple,
.input,
.button {
background: #E6EAD8 !important;
border: 3px solid #3F6F29 !important;
box-shadow: inset 2px 2px #C5E0A8, inset -2px -2px #2E5A1F !important;
}

/* Profile posts, columns */
.block.block--messages .block-body {
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important;
gap: 6px !important;
width: 90% !important;
max-width: 90% !important;
margin: 20px auto 0 !important;
padding: 6px 6px 6px !important;
box-sizing: border-box !important;
align-items: start !important;
}

/* Hidden junk*/
.memberHeader-blurContainer,
.memberHeader-blur,
.memberHeader-stats,
.memberHeader-buttons,
.memberHeader-separator,
.featuredBadges,
.memberHeader--withBanner .username,
.memberHeader .userTitle,
.memberHeader-blurb,
.memberHeader-content,
.message-cell.message-cell--user,
.memberHeader-stats .pairs dt,
.memberHeader-stats .pairs dd,
.memberHeader-stats span,
.memberHeader-stats sreal womang {
display: none !important;
}

/* Essential to keep shit in-place for some reason*/
.memberHeader .memberHeader-avatar,
.memberHeader .avatarWrapper,
.memberHeader .avatar,
.memberProfileBanner {
display: block !important;
z-index: 10 !important;
}

/* Elements WITHOUT the border but WITH the background colour*/
.comment,
.message,
.message-responseRow,
.memberHeader,
.block-tabHeader.block-tabHeader--memberTabs,
.message-inner,
.message-content,
.profile-post-comment {
background: #E6EAD8 !important;
}

nah I think I would rather beg the jannies to make a theme for me

 

[blackops2]

It's a bit jank but I've gotten something similar to the Windows XP Homestead theme going with two profile post columns. All vibe-coded because that's aryan shemmyfork.
View attachment 115086

i feel like it could look better if the the comments had a fixed height and you could scroll them