Attempts to revert OT! to how it was in 2017, while retaining useful new features.
// ==UserScript==
// @name Old OT!
// @namespace https://example.com/userscripts/old-ot
// @version 1.0.0
// @description Attempts to revert OT! to how it was in 2017, while retaining useful new features.
// @license MIT
// @match https://osu.ppy.sh/community/forums/*
// @run-at document-start
// @locale en
// ==/UserScript==
(() => {
const WALLPAPER = "https://i.imgur.com/JVlHA8E.png";
const UNREAD_ICON = "https://i.imgur.com/tGX6KcT.png";
const READ_ICON = "https://i.imgur.com/p8LBSQ5.png";
const NEW_TOPIC_ICON = "https://i.imgur.com/tbdDdEO.png";
const IMPORTANT_ICON = "https://i.imgur.com/9gz0N2X.png";
const LEGACY_AVATAR_FRAME = "https://i.imgur.com/gpSLOoi.png";
const LEGACY_AVATAR_WHITE = "https://i.imgur.com/4MwlfKT.png";
const LEGACY_AVATAR_WHITE_L1 = "https://i.imgur.com/lNpngdz.png";
const LEGACY_AVATAR_WHITE_L2 = "https://i.imgur.com/gvo27ST.png";
const LEGACY_AVATAR_WHITE_L3 = "https://i.imgur.com/0fl16HC.png";
const LEGACY_BANNED_AVATAR = "https://i.imgur.com/aJu5cAG.png";
const ICON_EYE = "https://i.imgur.com/pluHWkY.png";
const ICON_POSTS = "https://i.imgur.com/LSxtuWy.png";
const THREADS_HEADER_52 = "https://i.imgur.com/Xc6OzDS.png";
const THREADS_HEADER_OTHER = "https://i.imgur.com/Whyr9SB.png";
const THREAD_BREADCRUMB_IMAGE = "https://i.imgur.com/Zr3hPc3.png";
const LEGACY_FLAG_BASE = "https://assets.ppy.sh/old-flags/";
const LEGACY_DEFAULT_USER_COLOUR = "#32c6f1";
const css = `
@font-face{
font-family:"Exo 2";
font-style:normal;
font-weight:400;
font-display:swap;
src:url(https://cdn.jsdelivr.net/fontsource/fonts/exo-2@latest/latin-400-normal.woff2) format("woff2"),
url(https://cdn.jsdelivr.net/fontsource/fonts/exo-2@latest/latin-400-normal.woff) format("woff");
}
@font-face{
font-family:"Exo 2";
font-style:normal;
font-weight:700;
font-display:swap;
src:url(https://cdn.jsdelivr.net/fontsource/fonts/exo-2@latest/latin-700-normal.woff2) format("woff2"),
url(https://cdn.jsdelivr.net/fontsource/fonts/exo-2@latest/latin-700-normal.woff) format("woff");
}
@font-face{
font-family:"Exo 2";
font-style:italic;
font-weight:500;
font-display:swap;
src:url(https://cdn.jsdelivr.net/fontsource/fonts/exo-2@latest/latin-500-italic.woff2) format("woff2"),
url(https://cdn.jsdelivr.net/fontsource/fonts/exo-2@latest/latin-500-italic.woff) format("woff");
}
:root{
--legacy-threads-header-image: url("${THREADS_HEADER_52}");
}
body::before{
content:"";
position:fixed;
inset:0;
z-index:-2;
pointer-events:none;
background:url("${WALLPAPER}") repeat top left;
background-attachment:fixed;
}
:root{
--legacy-panel-target: 1000px;
--legacy-panel-gutter: 0px;
--legacy-panel-width: min(
var(--legacy-panel-target),
calc(100% - (var(--legacy-panel-gutter) * 2))
);
--legacy-panel-edge: 24px;
}
body > div.osu-layout__section.osu-layout__section--full{
overflow: visible !important;
}
:root{
--legacy-panel-content-inset: 25px;
}
body > div.osu-layout__section.osu-layout__section--full > div.osu-page.osu-page--forum{
position:relative !important;
background:transparent !important;
padding-top: calc(var(--legacy-panel-top) + var(--legacy-panel-content-inset)) !important;
overflow: visible !important;
}
.osu-page--forum .forum-list,
.osu-page--forum #topics{
margin-top: 0 !important;
}
body > div.osu-layout__section.osu-layout__section--full > div.osu-page.osu-page--forum::after{
content:"";
position:absolute;
left:50%;
transform:translateX(-50%);
width: var(--legacy-panel-width);
aspect-ratio: 5 / 1;
height: auto;
background-image: var(--legacy-threads-header-image);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
box-shadow:
0 2px 2px rgba(0,0,0,.12),
0 6px 10px rgba(0,0,0,.16);
z-index:0;
}
#legacy-forum-header-title{
position:absolute !important;
z-index: 6 !important;
pointer-events:auto !important;
font-family:"Exo 2","Arial Grande",Tahoma,Helvetica,Arial,sans-serif !important;
font-style: italic !important;
font-weight: 500 !important;
font-size: var(--legacy-header-title-size, 45px) !important;
line-height: var(--legacy-header-title-line, 45px) !important;
color: var(--legacy-header-title-color, #ffffff) !important;
text-shadow: var(--legacy-header-title-shadow, 0 1px 2px rgba(0,0,0, 0.7)) !important;
white-space: nowrap !important;
transform: translateY(-50%) !important;
cursor: pointer !important;
text-decoration: none !important;
}
#legacy-forum-header-title.legacy-title-wrap{
transform: none !important;
white-space: normal !important;
}
#legacy-forum-header-title.legacy-thread-title{
white-space: normal !important;
overflow: hidden !important;
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 2 !important;
padding-top: 2px !important;
}
body > div.osu-layout__section.osu-layout__section--full > div.osu-page.osu-page--forum::before{
content:"";
position:absolute;
bottom: var(--legacy-panel-edge);
left:50%;
transform:translateX(-50%);
width: var(--legacy-panel-width);
background:#fff;
box-shadow:0 3px 3px rgba(0,0,0,.18);
border:1px solid rgba(0,0,0,.08);
z-index:0;
}
body > div.osu-layout__section.osu-layout__section--full > div.osu-page.osu-page--forum > *{
position:relative;
z-index:1;
}
.forum-topic-entry{
border-left:0 !important;
box-shadow:none !important;
background-color:#fff !important;
border-radius:8px;
margin:6px 0;
position:relative;
z-index:0;
}
.forum-topic-entry > *{
background:transparent !important;
}
.forum-topic-entry:hover::before{
content:"";
position:absolute;
left:0;
right:0;
top:-6px;
bottom:0;
background:#ededed;
border-radius:8px;
z-index:-1;
pointer-events:none;
}
.forum-topic-entry::after{
content:"";
position:absolute;
left:12px;
right:12px;
bottom:0px;
border-bottom:1px solid #cccccc;
pointer-events:none;
}
.forum-topic-entry__bg{
position:absolute !important;
inset:0 !important;
border-radius:8px !important;
background:transparent !important;
pointer-events:auto !important;
}
.forum-item-stripe,
.forum-item-stripe__arrow{
display:none !important;
}
.forum-topic-entry__col--icon{
border-left:0 !important;
box-shadow:none !important;
flex:0 0 40px !important;
width:40px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
}
.forum-topic-entry__col--icon::before,
.forum-topic-entry__col--icon::after{
content:none !important;
display:none !important;
}
.forum-topic-entry__icon--unread{
background-image:url("${UNREAD_ICON}") !important;
background-repeat:no-repeat !important;
background-position:center !important;
background-size:contain !important;
width:36px;
height:36px;
padding:0 !important;
border-radius:50%;
overflow:hidden;
border:0 !important;
outline:0 !important;
box-shadow:none !important;
background-color:transparent !important;
}
.forum-topic-entry__icon--unread::before,
.forum-topic-entry__icon--unread::after{
content:none !important;
display:none !important;
}
.forum-topic-entry__icon--unread > *{
display:none !important;
}
.forum-topic-entry__icon:not(.forum-topic-entry__icon--unread){
background-image:url("${READ_ICON}") !important;
background-repeat:no-repeat !important;
background-position:center !important;
background-size:contain !important;
width:36px;
height:36px;
padding:0 !important;
border-radius:50%;
overflow:hidden;
border:0 !important;
outline:0 !important;
box-shadow:none !important;
background-color:transparent !important;
}
.forum-topic-entry__icon:not(.forum-topic-entry__icon--unread) > *{
display:none !important;
}
.forum-topic-entry__icon.legacy-important{
background-image:url("${IMPORTANT_ICON}") !important;
background-repeat:no-repeat !important;
background-position:center !important;
background-size:contain !important;
width:36px !important;
height:36px !important;
padding:0 !important;
border-radius:50% !important;
overflow:hidden !important;
border:0 !important;
outline:0 !important;
box-shadow:none !important;
background-color:transparent !important;
}
.forum-topic-entry__icon.legacy-important > *{
display:none !important;
}
.forum-topic-entry__icon--unread:hover,
.forum-topic-entry__icon--unread:focus,
.forum-topic-entry__icon--unread:focus-visible,
.forum-topic-entry__icon:not(.forum-topic-entry__icon--unread):hover,
.forum-topic-entry__icon:not(.forum-topic-entry__icon--unread):focus,
.forum-topic-entry__icon:not(.forum-topic-entry__icon--unread):focus-visible{
outline:0 !important;
box-shadow:none !important;
}
.forum-topic-entry__title{
color:#445500 !important;
font-weight:400;
}
.forum-topic-entry__title:hover{
text-decoration:underline;
}
.forum-topic-entry:hover .forum-topic-entry__title{
color:#99cc00 !important;
}
.forum-topic-entry__detail a.js-usercard{
color:#229abb !important;
font-weight:700;
}
.forum-topic-entry__detail a.js-usercard:hover{
text-decoration:underline;
}
.forum-topic-entry__content--right,
.forum-topic-entry__content--right *,
.forum-topic-entry__detail,
.forum-topic-entry__detail *,
.forum-topic-entry__count,
.forum-topic-entry time,
.forum-topic-entry .js-timeago{
color:#999999 !important;
font-weight:700;
}
.forum-post__header-content-item a.js-post-url > time.js-timeago{
color:#999999 !important;
font-weight:700 !important;
}
.forum-topic-entry__content--counts,
.forum-topic-entry__content--counts *,
.forum-topic-entry__content--counts strong{
color:#555 !important;
font-weight:normal !important;
}
.forum-topic-entry__content--right a.js-usercard{
color:#229abb !important;
font-weight:700 !important;
}
.forum-topic-entry__content--right a.js-usercard:hover{
text-decoration:underline;
}
.forum-topic-entry__col--last-link,
.forum-topic-entry__col--last-link i{
color:#555 !important;
}
.forum-topic-entry__col--last-link:hover,
.forum-topic-entry__col--last-link:focus,
.forum-topic-entry__col--last-link:focus-visible{
color:#555 !important;
box-shadow:none !important;
outline:0 !important;
}
.forum-topic-entry__col--icon .fa-lock{
display:none !important;
}
.legacy-lock-icon{
position:absolute;
left:15px;
top:50%;
transform:translateY(-50%);
font-size:14px;
pointer-events:none;
color:rgb(38,38,38) !important;
opacity:1 !important;
filter:none !important;
mix-blend-mode:normal !important;
}
.forum-user-icon{ display:none !important; }
.forum-topic-entry__content--counts{
display:flex !important;
justify-content:flex-end !important;
align-items:center !important;
flex:0 0 170px !important;
min-width:170px !important;
white-space:nowrap !important;
}
.forum-topic-entry__count{
min-width:7ch !important;
text-align:right !important;
font-variant-numeric:tabular-nums;
}
.forum-topic-entry__count strong{
display:inline-block !important;
min-width:7ch !important;
text-align:right !important;
}
#legacy-create-topic .legacy-plus-icon{
width:36px;
height:36px;
background-image:url("${NEW_TOPIC_ICON}") !important;
background-repeat:no-repeat !important;
background-position:center !important;
background-size:contain !important;
border-radius:50%;
overflow:hidden;
background-color:transparent !important;
box-shadow:none !important;
display:block !important;
margin:0 auto !important;
}
#legacy-create-topic .forum-topic-entry__col--icon-plus{
display:flex !important;
align-items:center !important;
justify-content:center !important;
}
.title--forum{
font-family:"Exo 2","Arial Grande",Tahoma,Helvetica,Arial,sans-serif !important;
font-weight:400 !important;
color:#555555 !important;
}
.osu-page--forum .forum-list__header{
background:transparent !important;
background-image:none !important;
border:0 !important;
border-left:0 !important;
border-top:0 !important;
border-right:0 !important;
border-bottom:0 !important;
box-shadow:none !important;
outline:0 !important;
padding-right:0 !important;
padding-left:32px !important;
}
.osu-page--forum .forum-list__header::before,
.osu-page--forum .forum-list__header::after{
content:none !important;
display:none !important;
background:none !important;
}
.osu-page--forum .forum-list__header .title--forum{
border:0 !important;
box-shadow:none !important;
background:transparent !important;
background-image:none !important;
}
.osu-page--forum .forum-list__header .title--forum::before,
.osu-page--forum .forum-list__header .title--forum::after{
content:none !important;
display:none !important;
background:none !important;
}
.osu-page--forum .forum-list > h2.title.title--forum{
border:0 !important;
border-left:0 !important;
box-shadow:none !important;
background:transparent !important;
background-image:none !important;
outline:0 !important;
}
.osu-page--forum .forum-list > h2.title.title--forum::before,
.osu-page--forum .forum-list > h2.title.title--forum::after{
content:none !important;
display:none !important;
background:none !important;
box-shadow:none !important;
border:0 !important;
}
.legacy-subforums{ margin-top:6px; }
.legacy-subforums ul.forums{
list-style:none;
padding:0;
margin:0;
overflow:visible !important;
}
.forum-list.legacy-subforums > ul.forum-list__items{
display:none !important;
}
.legacy-subforums .forums__forum{
position:relative;
z-index:1;
display:flex;
align-items:stretch;
background:#fff !important;
border-radius:0 !important;
margin:6px 0;
overflow:visible !important;
box-shadow:0 3px 2px rgba(0,0,0,.10) !important;
}
.legacy-subforums .forums__forum:hover{
background:#fff !important;
box-shadow:0 10px 18px rgba(0,0,0,.22) !important;
z-index:10;
}
.legacy-subforums .forums__forum:hover + .forums__forum{
position:relative;
}
.legacy-subforums .forums__forum:hover + .forums__forum::before{
content:"";
position:absolute;
left:0;
right:0;
top:-1px;
height:10px;
pointer-events:none;
background:linear-gradient(to bottom, rgba(0,0,0,.14), rgba(0,0,0,.06), rgba(0,0,0,0));
opacity:.55;
}
.legacy-subforums .left{
flex:1 1 auto;
padding:5px 12px 5px 26px !important;
min-width:0;
transition:none !important;
}
.legacy-subforums .right{
flex:0 0 340px;
min-width:0;
padding:5px 12px;
display:flex !important;
align-items:center !important;
justify-content:flex-end;
gap:10px;
background:#eeeeee !important;
border-radius:0 !important;
}
.legacy-subforums .right .right-content{
width:100%;
min-width:0;
text-align:left;
display:flex !important;
flex-direction:column !important;
justify-content:center !important;
gap:0px !important;
padding:0 !important;
margin:0 !important;
}
.legacy-subforums .left > a.name.u-forum--link{
color:#445500 !important;
font-weight:400;
text-decoration:none;
transition:color .12s ease-in-out;
font-family:"Exo 2","Arial Grande",Tahoma,Helvetica,Arial,sans-serif !important;
font-size:16px !important;
}
.legacy-subforums .left > a.name.u-forum--link:hover{
text-decoration:underline;
}
.legacy-subforums .forums__forum:hover .left > a.name.u-forum--link{
color:#99cc00 !important;
}
.legacy-subforums .description{
font-family:"Exo 2","Arial Grande",Tahoma,Helvetica,Arial,sans-serif !important;
font-size:12px !important;
font-weight:400 !important;
color:#555555 !important;
margin-top:2px;
}
.legacy-subforums ul.subforums{
list-style:none;
padding:0;
margin:6px 0 0 0;
}
.legacy-subforums ul.subforums li{
margin:2px 0;
font-family:"Exo 2","Arial Grande",Tahoma,Helvetica,Arial,sans-serif !important;
font-size:12px !important;
font-weight:700 !important;
}
.legacy-subforums ul.subforums a.name.u-forum--link{
color:#445500 !important;
font-weight:700 !important;
text-decoration:none;
font-family:"Exo 2","Arial Grande",Tahoma,Helvetica,Arial,sans-serif !important;
font-size:12px !important;
}
.legacy-subforums ul.subforums a.name.u-forum--link i{
color:#445500 !important;
}
.legacy-subforums ul.subforums a.name.u-forum--link i.fa-bars{
margin-right:4px !important;
}
.legacy-subforums .forums__hover-bar,
.legacy-subforums .forums__forum:hover .forums__hover-bar{
width:10px !important;
flex:0 0 10px !important;
flex-basis:10px !important;
position:relative !important;
background:transparent !important;
overflow:visible !important;
display:block !important;
transition:none !important;
}
.legacy-subforums .forums__colour-stripe{
display:none !important;
}
.legacy-subforums .forums__hover-bar::after{
content:"";
position:absolute;
left:0;
top:0;
bottom:0;
width:10px;
background:#89b300;
transition:width .22s cubic-bezier(.2,.8,.2,1) !important;
will-change:width;
z-index:0;
}
.legacy-subforums .forums__forum:hover .forums__hover-bar::after{
width:25px;
}
.legacy-subforums .forums__hover-bar-icon{
display:block !important;
position:absolute !important;
left:12.5px !important;
top:50% !important;
transform:translate(-50%, -50%) !important;
z-index:1;
opacity:0;
color:#ffffff !important;
line-height:1;
transition:none !important;
transition-delay:0s !important;
}
.legacy-subforums .forums__forum:hover .forums__hover-bar-icon{
opacity:1;
}
.legacy-subforums .legacy-last-title{
display:block !important;
margin:0 !important;
padding:0 !important;
font-family:"Exo 2","Arial Grande",Tahoma,Helvetica,Arial,sans-serif !important;
font-size:12px !important;
line-height:14px !important;
font-weight:600 !important;
color:#445500 !important;
text-decoration:none !important;
white-space:nowrap !important;
overflow:hidden !important;
text-overflow:ellipsis !important;
background:none !important;
box-shadow:none !important;
border:0 !important;
}
.legacy-subforums .legacy-last-meta{
display:block !important;
margin:0 !important;
padding:0 !important;
font-family:"Exo 2","Arial Grande",Tahoma,Helvetica,Arial,sans-serif !important;
font-size:12px !important;
line-height:14px !important;
color:#555555 !important;
background:none !important;
box-shadow:none !important;
border:0 !important;
}
.legacy-subforums .legacy-last-user{
font-family:Torus, Inter, "Helvetica Neue", Tahoma, Helvetica, Arial, sans-serif !important;
font-size:12px !important;
font-weight:700 !important;
color:#229abb !important;
text-decoration:none !important;
}
.legacy-subforums .legacy-last-user:hover{
text-decoration:underline !important;
}
.pagination-v2.pagination-v2--forum{
display:none !important;
}
nav.forum-pagination.legacy-forum-pagination{
display:flex !important;
flex-direction:column !important;
align-items:center !important;
gap:6px !important;
margin:24px 0 26px 0 !important;
font-family:"Exo 2", Arial, sans-serif !important;
}
nav.forum-pagination.legacy-forum-pagination > ul,
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext{
list-style:none !important;
display:flex !important;
align-items:center !important;
gap:14px !important;
margin:0 !important;
padding:0 !important;
}
nav.forum-pagination.legacy-forum-pagination li{
display:inline-flex !important;
}
nav.forum-pagination.legacy-forum-pagination > ul:first-of-type{
gap:0 !important;
}
nav.forum-pagination.legacy-forum-pagination > ul:first-of-type a.u-forum--link,
nav.forum-pagination.legacy-forum-pagination > ul:first-of-type li.active > span,
nav.forum-pagination.legacy-forum-pagination > ul:first-of-type li > span{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
text-align:center !important;
min-width:14px !important;
padding:0 5px !important;
line-height:16px !important;
}
nav.forum-pagination.legacy-forum-pagination > ul:first-of-type a.u-forum--link{
background:transparent !important;
border:0 !important;
border-radius:0 !important;
color:#445500 !important;
font-size:12px !important;
font-weight:400 !important;
text-decoration:none !important;
}
nav.forum-pagination.legacy-forum-pagination > ul:first-of-type a.u-forum--link:hover{
background:transparent !important;
text-decoration:none !important;
color:#99cc00 !important;
}
nav.forum-pagination.legacy-forum-pagination > ul:first-of-type li.active > span{
background:transparent !important;
border:0 !important;
border-radius:0 !important;
color:#555555 !important;
font-size:12px !important;
font-weight:700 !important;
}
nav.forum-pagination.legacy-forum-pagination > ul:first-of-type li > span{
color:#555555 !important;
font-size:12px !important;
font-weight:400 !important;
}
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext a.u-forum--link,
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext a.u-forum--link:hover,
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext a.u-forum--link:focus,
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext a.u-forum--link:focus-visible{
background:transparent !important;
text-decoration:none !important;
}
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext a.u-forum--link,
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext span{
display:inline-flex !important;
align-items:center !important;
height:auto !important;
padding:0 4px !important;
line-height:16px !important;
border:0 !important;
border-radius:0 !important;
box-shadow:none !important;
outline:0 !important;
font-weight:700 !important;
font-size:16px !important;
}
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext a.u-forum--link{
color:#445500 !important;
}
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext a.u-forum--link:hover{
color:#99cc00 !important;
}
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext span{
color:#555555 !important;
}
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext i{
display:none !important;
}
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext li:first-child a::before,
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext li:first-child span::before{
content:"‹";
margin-right:3px;
font-weight:400 !important;
font-size:20px !important;
line-height:1 !important;
position:relative;
top:-1px;
color:currentColor;
}
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext li:last-child a::after,
nav.forum-pagination.legacy-forum-pagination > ul.forum-pagination-prevnext li:last-child span::after{
content:"›";
margin-left:3px;
font-weight:400 !important;
font-size:20px !important;
line-height:1 !important;
position:relative;
top:-1px;
color:currentColor;
}
.forum-topic-entry__content--counts{
display: flex !important;
flex-direction: column !important;
gap: 4px !important;
}
.forum-topic-entry__content--counts > div:nth-child(1){ order: 2 !important; }
.forum-topic-entry__content--counts > div:nth-child(2){ order: 1 !important; }
.forum-topic-entry__content--counts > div{
font-size: 0 !important;
line-height: 1 !important;
white-space: nowrap !important;
display: flex !important;
align-items: center !important;
gap: 1px !important;
}
.forum-topic-entry__content--counts > div > strong{
font-size: 13px !important;
line-height: 1 !important;
color: #666 !important;
font-weight: 400 !important;
}
.forum-topic-entry__content--counts > div::after{
content: "";
width: 14px;
height: 14px;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
opacity: 0.85;
}
.forum-topic-entry__content--counts > div:nth-child(1)::after{
background-image: url("${ICON_POSTS}");
}
.forum-topic-entry__content--counts > div:nth-child(2)::after{
background-image: url("${ICON_EYE}");
}
.forum-topic-entry__content--counts > div{
display: flex !important;
align-items: center !important;
gap: 3px !important;
}
.forum-topic-entry__content--counts > div > strong{
display: inline-block !important;
width: 32px;
text-align: right !important;
font-variant-numeric: tabular-nums;
}
:root{
--legacy-thread-shift: 2px;
}
.forum-topic-entry,
.forum-topic-entry__col,
.forum-topic-entry__content{
min-height: 0 !important;
}
.forum-topic-entry__col--icon,
.forum-topic-entry__col--main,
.forum-topic-entry__content--counts,
.forum-topic-entry__col--last-link,
.forum-topic-entry__content--left,
.forum-topic-entry__content--right,
.forum-topic-entry__detail{
transform: translateY(calc(var(--legacy-thread-shift) * -1)) !important;
}
.forum-topic-entry{
overflow: visible !important;
}
:root{
--legacy-hover-bleed: 50px;
}
#topics,
#topics ul.forum-list__items{
overflow: visible !important;
}
.forum-topic-entry:hover::before{
left: calc(var(--legacy-hover-bleed) * -1) !important;
right: calc(var(--legacy-hover-bleed) * -1) !important;
top: -6px !important;
bottom: 0 !important;
border-top-left-radius: 0 !important;
border-bottom-left-radius: 0 !important;
border-top-right-radius: 0 !important;
border-bottom-right-radius: 0 !important;
}
.header-v4__content{
width: var(--legacy-panel-width) !important;
margin-left: auto !important;
margin-right: auto !important;
box-sizing: border-box !important;
}
.header-nav-v4.header-nav-v4--breadcrumb{
display: flex !important;
justify-content: center !important;
align-items: center !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
line-height: 16px !important;
list-style: none !important;
box-sizing: border-box !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__item::after{
content: none !important;
}
.header-v4__content{
display: flex !important;
justify-content: center !important;
}
.header-v4__row.header-v4__row--title{
display: none !important;
}
.header-v4__bg.js-forum-cover--header{
display: none !important;
}
.header-v4__bg-container{
background-color: #c01e79 !important;
background-image: none !important;
clip-path: inset(0 0 10px 0);
}
.header-v4__row.header-v4__row--bar{
position: relative !important;
}
:root{
--legacy-threadsheader-top: 24px;
--legacy-panel-top: 200px;
}
body > div.osu-layout__section.osu-layout__section--full
> div.osu-page.osu-page--forum::after{
top: var(--legacy-threadsheader-top) !important;
z-index: 1 !important;
}
body > div.osu-layout__section.osu-layout__section--full
> div.osu-page.osu-page--forum::before{
top: var(--legacy-panel-top) !important;
z-index: 0 !important;
}
:root{
--legacy-breadcrumb-shift: 20px;
}
.header-v4__row.header-v4__row--bar{
position: relative !important;
top: auto !important;
z-index: 5 !important;
width: var(--legacy-panel-width) !important;
margin: 0 auto !important;
box-sizing: border-box !important;
overflow: visible !important;
min-height: unset !important;
height: auto !important;
}
.header-v4__row.header-v4__row--bar{
min-height: 0 !important;
}
:root{
--legacy-breadcrumb-nudge: -8px;
}
.header-v4__row.header-v4__row--bar{
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.header-v4__row.header-v4__row--bar{
margin-top: calc(var(--legacy-breadcrumb-shift) * -1) !important;
transform: none !important;
}
.header-nav-v4.header-nav-v4--breadcrumb{
transform: translateY(var(--legacy-breadcrumb-nudge)) !important;
}
.header-nav-v4.header-nav-v4--breadcrumb{
background: #333333 !important;
padding: 3px 8px !important;
gap: 0 !important;
line-height: 15px !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__item{
margin: 0 !important;
padding: 0 !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__item a{
font-size: 15px !important;
line-height: 15px !important;
text-decoration: none !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__item:not(:last-child) a{
color: #CCCCCC !important;
font-weight: 400 !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__item:last-child a,
.header-nav-v4--breadcrumb .header-nav-v4__item:last-child{
color: #FFFFFF !important;
font-weight: 700 !important;
font-size: 15px !important;
line-height: 15px !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__item + .header-nav-v4__item::before{
content: "≫" !important;
font-size: 7px !important;
line-height: 1 !important;
display: inline-block !important;
transform:
scaleY(1.5)
translateX(5px)
translateY(-2.5px) !important;
transform-origin: center !important;
margin: 0 5px !important;
color: #CCCCCC !important;
vertical-align: middle !important;
}
.header-v4__row.header-v4__row--bar{
background: #333333 !important;
background-image: none !important;
box-shadow: none !important;
border: 0 !important;
}
.header-v4__row.header-v4__row--bar > *{
background: transparent !important;
}
:root{
--legacy-bar-cut: 26px;
}
.header-v4__row.header-v4__row--bar{
margin-top: calc(var(--legacy-breadcrumb-shift) * -1) !important;
transform: none !important;
margin-bottom: calc(var(--legacy-bar-cut) * -1) !important;
}
.header-nav-v4.header-nav-v4--breadcrumb,
.header-nav-v4.header-nav-v4--breadcrumb *{
font-family: "Exo 2", "Arial Grande", Tahoma, Helvetica, Arial, sans-serif !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__link{
display: inline-block !important;
padding-bottom: 6px !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__item:last-child .header-nav-v4__link{
box-shadow: inset 0 -5px 0 #88b300 !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__link .fake-bold{
position: relative !important;
top: -4px !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__link{
position: relative !important;
display: inline-block !important;
padding-bottom: 6px !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__item:not(:last-child) .header-nav-v4__link{
box-shadow: none !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__item:not(:last-child) .header-nav-v4__link::after{
content: "" !important;
position: absolute !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
height: 5px !important;
background: #88b300 !important;
transform: translateY(100%) !important;
opacity: 0 !important;
transition:
transform .22s cubic-bezier(.2,.8,.2,1),
opacity .22s cubic-bezier(.2,.8,.2,1) !important;
pointer-events: none !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__item:not(:last-child):hover .header-nav-v4__link::after{
transform: translateY(0) !important;
opacity: 1 !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__item:not(:last-child):hover .header-nav-v4__link,
.header-nav-v4--breadcrumb .header-nav-v4__item:not(:last-child):hover .header-nav-v4__link *{
color: #ffffff !important;
}
.header-nav-v4--breadcrumb .header-nav-v4__item:last-child .header-nav-v4__link{
box-shadow: inset 0 -5px 0 #88b300 !important;
}
:root{
--legacy-thread-crumbimg-h: 200px;
}
.osu-page--forum-topic #posts{
padding-top: var(--legacy-thread-firstpost-gap) !important;
}
.osu-page--forum-topic .forum-posts,
.osu-page--forum-topic .forum-posts__items{
padding-top: var(--legacy-thread-firstpost-gap) !important;
}
.osu-page--forum-topic .forum-post:first-child{
margin-top: var(--legacy-thread-firstpost-gap) !important;
}
:root{
--legacy-thread-firstpost-gap: 5px;
}
.osu-page--forum-topic .forum-post:first-of-type{
margin-top: var(--legacy-thread-firstpost-gap) !important;
}
body > div.osu-layout__section.osu-layout__section--full,
body > div.osu-layout__section.osu-layout__section--full > div.osu-page,
body > div.osu-layout__section.osu-layout__section--full > div.osu-page.osu-page--forum-topic{
background: transparent !important;
}
body > div.osu-layout__section.osu-layout__section--full > div.osu-page.osu-page--forum-topic::before,
body > div.osu-layout__section.osu-layout__section--full > div.osu-page.osu-page--forum-topic::after{
background: transparent !important;
}
.osu-page--forum-topic .js-header--main.legacy-hide-header{
height: 0 !important;
min-height: 0 !important;
overflow: hidden !important;
margin: 0 !important;
padding: 0 !important;
opacity: 0 !important;
pointer-events: none !important;
background: transparent !important;
}
.osu-page--forum-topic .js-header--main.legacy-hide-header > *{
display: none !important;
}
#legacy-thread-poll-wrap{
width: min(var(--legacy-thread-post-first), 100%) !important;
margin: 0 auto var(--legacy-thread-firstpost-gap) auto !important;
}
#legacy-thread-poll-wrap .forum-poll-container__content,
#legacy-thread-poll-wrap .forum-poll{
background: #fff !important;
box-shadow: 0 3px 3px rgba(0,0,0,.18) !important;
border: 1px solid rgba(0,0,0,.08) !important;
border-radius: 0 !important;
}
.osu-page--forum-topic .forum-post,
.osu-page--forum-topic .forum-post__body{
background: #fff !important;
}
.osu-page--forum-topic .forum-post__content{
background: transparent !important;
}
.osu-page--forum-topic .forum-post__bg{
background: transparent !important;
}
.well{
background: #eeeeee !important;
border: 1px solid #dddddd !important;
}
.osu-page--forum-topic .forum-post,
.osu-page--forum-topic .forum-post__body,
.osu-page--forum-topic .forum-post__content,
.osu-page--forum .forum-topic-title,
.osu-page--forum .forum-list,
.osu-page--forum .forum-item,
.osu-page--forum .forum-post{
color: #444444 !important;
}
.forum-post__body,
.forum-post__body *{
text-shadow: none !important;
}
.forum-post__body a{ color: #2299bb !important; }
.osu-page--forum-topic .forum-post__body{
color: #444444 !important;
}
.osu-page--forum-topic .forum-post,
.osu-page--forum-topic .forum-post__body,
.osu-page--forum-topic .forum-post__content {
border-top: 0 !important;
border-bottom: 0 !important;
}
.osu-page--forum-topic .forum-post::before,
.osu-page--forum-topic .forum-post::after,
.osu-page--forum-topic .forum-post__body::before,
.osu-page--forum-topic .forum-post__body::after,
.osu-page--forum-topic .forum-post__content::before,
.osu-page--forum-topic .forum-post__content::after {
content: none !important;
display: none !important;
}
.osu-page--forum-topic .forum-post {
margin: 0 0 5px 0 !important;
}
.osu-page--forum-topic #posts,
.osu-page--forum-topic .forum-posts,
.osu-page--forum-topic .forum-posts__items {
display: flow-root !important;
}
.osu-page--forum-topic .forum-post{
background: #ffffff !important;
box-shadow:
0 3px 3px rgba(0,0,0,.18) !important;
border: 1px solid rgba(0,0,0,.08) !important;
border-radius: 0 !important;
}
.js-forum-post-edit--container{
color: #444444 !important;
}
.js-forum-post-edit--container textarea,
.js-forum-post-edit--container input,
.js-forum-post-edit--container [contenteditable="true"],
.js-forum-post-edit--container .bbcode-editor__textarea,
.js-forum-post-edit--container .bbcode-editor__preview,
.js-forum-post-edit--container .bbcode-editor,
.js-forum-post-edit--container .bbcode-editor *:is(textarea,[contenteditable="true"]){
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
caret-color: #444444 !important;
}
.js-forum-post-edit--container ::placeholder{
color: #777777 !important;
opacity: 1 !important;
}
.js-forum-post-edit--container svg,
.js-forum-post-edit--container svg *{
fill: currentColor !important;
stroke: currentColor !important;
}
.forum-post__body .bbcode{
color: #444444 !important;
text-shadow: none !important;
}
.forum-post__body .bbcode a{ color:#2299bb !important; }
.osu-page--forum-topic .forum-post__body h2{ color:#CC5288 !important; }
.forum-post__body .bbcode blockquote{
color: #444444 !important;
}
.forum-post__body .bbcode blockquote *:not(a):not([style*="color"]):not(font[color])
:not(.spoiler):not(.spoiler *)
:not(.bbcode-spoilerbox):not(.bbcode-spoilerbox *)
:not(.bbcode-spoilerbox__content):not(.bbcode-spoilerbox__content *) {
color: inherit !important;
}
.forum-post__body .bbcode a{
color: #2299bb !important;
}
.forum-post__body pre,
.forum-post__body .bbcode pre{
background: #F5F5F5 !important;
border: 1px solid #DDDDDD !important;
}
.forum-post__body code,
.forum-post__body .bbcode code{
background: #F5F5F5 !important;
border: 1px solid #DDDDDD !important;
}
.forum-post__body audio,
.forum-post__body .bbcode audio{
background: #F5F5F5 !important;
border: 1px solid #DDDDDD !important;
border-radius: 4px !important;
}
.forum-post__body audio-player,
.forum-post__body .bbcode audio-player,
.forum-post__body .js-audio--player,
.forum-post__body .bbcode .js-audio--player{
background: #F5F5F5 !important;
border: 1px solid #DDDDDD !important;
}
.forum-post__body .bbcode .audio-player,
.forum-post__body .bbcode .audio-player *{
color: #444444 !important;
}
.forum-post__body .bbcode .audio-player a{
color: #2299bb !important;
}
.forum-post__body .bbcode .audio-player .spoiler,
.forum-post__body .bbcode .audio-player .spoiler *,
.forum-post__body .bbcode .audio-player .bbcode-spoilerbox,
.forum-post__body .bbcode .audio-player .bbcode-spoilerbox *{
color: revert !important;
}
.forum-post__body .bbcode .audio-player__button--play:hover .play-button,
.forum-post__body .bbcode .audio-player__button--play:hover .play-button::before,
.forum-post__body .bbcode .audio-player__button--play:focus-visible .play-button,
.forum-post__body .bbcode .audio-player__button--play:focus-visible .play-button::before{
filter: brightness(1.2) !important;
opacity: 0.95 !important;
}
.audio-player.audio-player--main{
background: #F5F5F5 !important;
border: 1px solid #DDDDDD !important;
border-radius: 4px !important;
box-shadow: none !important;
}
.audio-player.audio-player--main,
.audio-player.audio-player--main *{
color: #444444 !important;
}
.audio-player.audio-player--main .audio-player__bar--progress{
background: #1c1719 !important;
}
.audio-player.audio-player--main .audio-player__bar--progress .audio-player__bar-current{
background: #ff66ab !important;
}
.audio-player.audio-player--main .audio-player__bar--volume{
background: #1c1719 !important;
}
.audio-player.audio-player--main .audio-player__bar--volume .audio-player__bar-current{
background: #ff66ab !important;
}
.audio-player.audio-player--main .audio-player__button:hover,
.audio-player.audio-player--main .audio-player__button:focus-visible,
.audio-player.audio-player--main .audio-player__volume-button:hover,
.audio-player.audio-player--main .audio-player__volume-button:focus-visible,
.audio-player.audio-player--main .audio-player__autoplay-button:hover,
.audio-player.audio-player--main .audio-player__autoplay-button:focus-visible{
filter: brightness(1.3) !important;
opacity: 0.95 !important;
}
.audio-player.audio-player--main .audio-player__button--play:hover .play-button,
.audio-player.audio-player--main .audio-player__button--play:hover .play-button::before,
.audio-player.audio-player--main .audio-player__button--play:focus-visible .play-button,
.audio-player.audio-player--main .audio-player__button--play:focus-visible .play-button::before{
filter: brightness(1.0) !important;
opacity: 0.95 !important;
}
.forum-post__body blockquote > :first-child{
color: #CC5288 !important;
}
.forum-post__body blockquote{
--legacy-wrote-color: #CC5288;
}
.forum-post__body blockquote::first-line{
color: var(--legacy-wrote-color) !important;
}
.forum-post__body .bbcode blockquote{
box-shadow: none !important;
background: transparent !important;
background-image: none !important;
}
.forum-post__body .bbcode blockquote::before,
.forum-post__body .bbcode blockquote::after,
.forum-post__body .bbcode blockquote > *::before,
.forum-post__body .bbcode blockquote > *::after{
content: none !important;
display: none !important;
}
.forum-post__body .bbcode blockquote > h4{
border: 0 !important;
box-shadow: none !important;
background: transparent !important;
padding-left: 0 !important;
margin-left: 0 !important;
}
.forum-post__body .bbcode blockquote{
border-left: 5px solid #e3e3e3 !important;
padding-left: 10px !important;
margin-left: 0 !important;
}
.forum-post__body .bbcode blockquote blockquote{
border-left: 5px solid #e3e3e3 !important;
padding-left: 10px !important;
margin-left: 6px !important;
}
.forum-post__body .bbcode blockquote blockquote blockquote{
margin-left: 12px !important;
}
.forum-post__content--signature{
border-top: 0 !important;
}
.forum-post__content--main{
border-bottom: 0 !important;
}
.forum-post__content--signature::before,
.forum-post__content--signature::after{
content: none !important;
}
.forum-post__content--signature{
background: #EEEEEE !important;
padding: 10px 12px !important;
margin: 0 !important;
}
.forum-post__content--main{
margin-bottom: 0 !important;
padding-bottom: 10px !important;
}
.osu-page--forum-topic .forum-post__content.forum-post__content--signature{
background-color: #eaeaea !important;
}
.osu-page--forum-topic .forum-post__content.forum-post__content--signature .forum-post-content,
.osu-page--forum-topic .forum-post__content.forum-post__content--signature .bbcode{
background: transparent !important;
}
.osu-page--forum-topic .forum-post__content.forum-post__content--signature{
padding: 10px 12px !important;
margin: 0 !important;
}
.osu-page--forum-topic .forum-post__content.forum-post__content--signature{
border-top: 0 !important;
}
.osu-page--forum-topic .forum-post__content.forum-post__content--main{
border-bottom: 0 !important;
}
.osu-page--forum-topic .forum-post__content.forum-post__content--signature::before,
.osu-page--forum-topic .forum-post__content.forum-post__content--signature::after{
content: none !important;
}
.osu-page--forum-topic .forum-post__content.forum-post__content--main::after,
.osu-page--forum-topic .forum-post__content.forum-post__content--main::before{
content: none !important;
}
:root{
--legacy-thread-post-first: 1000px;
--legacy-thread-post-other: 960px;
}
.osu-page--forum-topic .forum-post.js-forum-post:not([data-post-position="1"]){
width: min(var(--legacy-thread-post-other), 100%) !important;
margin-left: auto !important;
margin-right: auto !important;
box-sizing: border-box !important;
}
.osu-page--forum-topic .forum-post.js-forum-post[data-post-position="1"]{
width: min(var(--legacy-thread-post-first), 100%) !important;
margin-left: auto !important;
margin-right: auto !important;
box-sizing: border-box !important;
}
.osu-page--forum-topic .forum-post__body{
width: 100% !important;
box-sizing: border-box !important;
}
.forum-post-info{
--legacy-avatar-size: 132px;
}
.forum-post-info__row--avatar{
width: 100% !important;
display: flex !important;
justify-content: center !important;
}
:root{
--legacy-pfp-inset-top: 25px;
--legacy-pfp-inset-bottom: 45px;
--legacy-pfp-inset-left: 35px;
--legacy-pfp-inset-right: 35px;
--legacy-pfp-shift-y: calc((var(--legacy-pfp-inset-bottom) - var(--legacy-pfp-inset-top)) / 2);
}
.forum-post-info .avatar.avatar--forum{
position: relative !important;
width: var(--legacy-avatar-size) !important;
height: var(--legacy-avatar-size) !important;
background-repeat: no-repeat !important;
background-size: calc(100% - (var(--legacy-pfp-inset-left) + var(--legacy-pfp-inset-right)))
calc(100% - (var(--legacy-pfp-inset-top) + var(--legacy-pfp-inset-bottom))) !important;
background-position: 50% calc(50% - var(--legacy-pfp-shift-y)) !important;
border-radius: 0 !important;
box-shadow: none !important;
background-color: transparent !important;
overflow: hidden !important;
z-index: 1 !important;
}
.forum-post-info .avatar.avatar--forum::before{
content:"" !important;
position:absolute !important;
inset:0 !important;
background-image:
url("${LEGACY_AVATAR_FRAME}"),
linear-gradient(var(--legacy-user-colour, #32c6f1), var(--legacy-user-colour, #32c6f1)) !important;
background-repeat: no-repeat, no-repeat !important;
background-position: center, center !important;
background-size: 100% 100%, 100% 100% !important;
background-blend-mode: multiply !important;
-webkit-mask-image: url("${LEGACY_AVATAR_FRAME}") !important;
-webkit-mask-repeat: no-repeat !important;
-webkit-mask-position: center !important;
-webkit-mask-size: 100% 100% !important;
mask-image: url("${LEGACY_AVATAR_FRAME}") !important;
mask-repeat: no-repeat !important;
mask-position: center !important;
mask-size: 100% 100% !important;
z-index:2 !important;
pointer-events:none !important;
}
.forum-post-info .avatar.avatar--forum.legacy-banned{
background-image: none !important;
background-color: transparent !important;
}
.forum-post-info .avatar.avatar--forum.legacy-banned::before{
background-image: url("${LEGACY_BANNED_AVATAR}") !important;
background-repeat: no-repeat !important;
background-position: 50% 0% !important;
background-size: 100% auto !important;
background-blend-mode: normal !important;
-webkit-mask-image: none !important;
mask-image: none !important;
}
.forum-post-info .avatar.avatar--forum.legacy-banned::after{
bottom: auto !important;
top: 34px !important;
font-size: clamp(11px, 1.6vw, 15px) !important;
line-height: 1 !important;
}
.forum-post-info .avatar.avatar--forum.legacy-banned > .legacy-avatar-white{
display:none !important;
}
.forum-post-info:has(.avatar.avatar--forum.legacy-banned){
background-color: #f5f5f5 !important;
}
.forum-post-info__row--avatar{
margin-top: 0 !important;
padding-top: 0 !important;
}
.forum-post-info{
padding-top: 0 !important;
}
.forum-post-info{
row-gap: 0 !important;
}
.forum-post-info__row--avatar:first-child{
margin-top: 0 !important;
}
.forum-post-info .avatar.avatar--forum{
margin-top: 0 !important;
align-self: flex-start !important;
}
.forum-post-info .avatar.avatar--forum > .legacy-avatar-white{
position: absolute !important;
inset: 0 !important;
pointer-events: none !important;
z-index: 4 !important;
background-image: var(--legacy-avatar-white-image, url("${LEGACY_AVATAR_WHITE}")) !important;
background-repeat: no-repeat !important;
background-position: 50% calc(50% - 10px) !important;
background-size: auto 120px !important;
}
.forum-post-info__row--username{
display: none !important;
}
.forum-post-info .avatar.avatar--forum::after{
content: attr(data-legacy-name) !important;
position: absolute !important;
left: 0 !important;
right: 0 !important;
bottom: 10% !important;
text-align: center !important;
font-family: "Exo 2","Arial Grande",Tahoma,Helvetica,Arial,sans-serif !important;
font-weight: 700 !important;
font-size: clamp(11px, 1.6vw, 15px) !important;
line-height: 1 !important;
color: #ffffff !important;
text-shadow: 0 1px 2px rgba(0,0,0,.8) !important;
z-index: 3 !important;
pointer-events: none !important;
}
img.legacy-flag.forum__user-flag--country{
width: 32px !important;
height: 22px !important;
display: inline-block !important;
vertical-align: middle !important;
image-rendering: auto !important;
filter:
drop-shadow(0 2px 2px rgba(0,0,0,.20))
drop-shadow(1px 0 1px rgba(0,0,0,.14))
drop-shadow(-1px 0 1px rgba(0,0,0,.14));
}
.flag-team{
filter:
drop-shadow(0 2px 2px rgba(0,0,0,.20))
drop-shadow(1px 0 1px rgba(0,0,0,.14))
drop-shadow(-1px 0 1px rgba(0,0,0,.14)) !important;
}
.forum-post-info__row.forum-post-info__row--posts,
.forum-post-info__row.forum-post-info__row--posts *{
color: #444444 !important;
font-weight: 500 !important;
}
.forum-post-info__row--title{
color: #444444 !important;
}
#posts,
.forum-posts,
.forum-posts__items{
overflow: visible !important;
}
.forum-post{
position: relative !important;
overflow: visible !important;
}
.forum-post.legacy-role-stripe::before{
display: block !important;
content: "" !important;
position: absolute !important;
top: 0 !important;
bottom: 0 !important;
width: 10px !important;
left: -10px !important;
background: var(--legacy-role-colour, #32c6f1) !important;
filter: brightness(0.7);
pointer-events: none !important;
z-index: 10 !important;
}
a.bbcode-spoilerbox__link,
a.bbcode-spoilerbox__link:visited{
color: #CC6600 !important;
}
a.bbcode-spoilerbox__link .bbcode-spoilerbox__link-icon{
color: #CC6600 !important;
fill: #CC6600 !important;
stroke: #CC6600 !important;
}
a.bbcode-spoilerbox__link:hover,
a.bbcode-spoilerbox__link:focus,
a.bbcode-spoilerbox__link:focus-visible{
color: #CC6600 !important;
text-decoration: underline;
}
.forum-post__body .bbcode a.bbcode-spoilerbox__link{ color:#CC6600 !important; }
.forum-post__body .bbcode .bbcode-spoilerbox__link-icon{
filter: brightness(0) saturate(100%) invert(36%) sepia(0%) saturate(0%) brightness(92%) contrast(90%) !important;
}
.osu-page--forum-topic,
.osu-page--forum-topic #posts,
.osu-page--forum-topic .forum-posts,
.osu-page--forum-topic .forum-posts__items{
overflow-anchor: none !important;
}
.osu-page--forum-topic .forum-post__body h2{
color: #CC5288 !important;
}
.osu-page--forum-topic .forum-post__body h2 *:not([style*="color"]):not(font[color]){
color: inherit !important;
}
:root{
--legacy-thread-crumbimg-image: url("${THREAD_BREADCRUMB_IMAGE}");
}
#legacy-thread-crumbimg{
display:block !important;
width: min(var(--legacy-thread-post-first), 100%) !important;
height: var(--legacy-thread-crumbimg-h) !important;
position: relative !important;
left: auto !important;
transform: none !important;
top: auto !important;
margin: 0 auto var(--legacy-thread-firstpost-gap) auto !important;
background-image: var(--legacy-thread-crumbimg-image) !important;
background-size: cover !important;
background-repeat: no-repeat !important;
background-position: center center !important;
box-shadow: 0 2px 2px rgba(0,0,0,.12), 0 6px 10px rgba(0,0,0,.16) !important;
pointer-events:none !important;
}
#legacy-thread-crumbimg .legacy-thread-title-inbanner{
position:absolute;
left: 4.5%;
right: 10%;
top: 60%;
transform: translateY(-50%);
font-family:"Exo 2","Arial Grande",Tahoma,Helvetica,Arial,sans-serif;
font-style: italic;
font-weight: 500;
font-size: 36px;
line-height: 36px;
color: #fff;
text-shadow: 0 1px 2px rgba(0,0,0,.7);
display:-webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow:hidden;
}
#legacy-forum-header-title.legacy-thread-title,
#legacy-thread-crumbimg .legacy-thread-title-inbanner{
line-height: 1.15 !important;
padding-bottom: 0.25em !important;
box-sizing: content-box !important;
}
#legacy-thread-top-spacer{
width: min(var(--legacy-thread-post-first), 100%) !important;
margin: 0 auto !important;
height: var(--legacy-thread-top-spacer-h, 0px) !important;
background: transparent !important;
}
:root{
--legacy-thread-topspacer-nudge: 0px;
}
#legacy-thread-top-spacer{
height: calc(var(--legacy-thread-top-spacer-h, 0px) + var(--legacy-thread-topspacer-nudge)) !important;
}
#legacy-thread-crumbimg .legacy-thread-title-inbanner{
top: var(--legacy-thread-title-top-2, 60%) !important;
}
#legacy-thread-crumbimg .legacy-thread-title-inbanner[data-lines="1"]{
top: var(--legacy-thread-title-top-1, 72%) !important;
}
.forum-post-info__row--support-level{
display: none !important;
}
#legacy-thread-poll-wrap,
#legacy-thread-poll-wrap *{
color: #444444 !important;
text-shadow: none !important;
}
#legacy-thread-poll-wrap a{
color: #2299bb !important;
}
#legacy-thread-poll-wrap h1,
#legacy-thread-poll-wrap h2{
color: #CC5288 !important;
}
#legacy-thread-poll-wrap h2 *:not([style*="color"]):not(font[color]){
color: inherit !important;
}
#legacy-thread-poll-wrap .well{
background: #eeeeee !important;
border: 1px solid #dddddd !important;
}
#legacy-thread-poll-wrap pre,
#legacy-thread-poll-wrap code{
background: #F5F5F5 !important;
border: 1px solid #DDDDDD !important;
}
#legacy-thread-poll-wrap blockquote,
#legacy-thread-poll-wrap blockquote *{
color: #444444 !important;
box-shadow: none !important;
background: transparent !important;
background-image: none !important;
}
#legacy-thread-poll-wrap blockquote::before,
#legacy-thread-poll-wrap blockquote::after,
#legacy-thread-poll-wrap blockquote > *::before,
#legacy-thread-poll-wrap blockquote > *::after{
content: none !important;
display: none !important;
}
#legacy-thread-poll-wrap blockquote{
border-left: 5px solid #e3e3e3 !important;
padding-left: 10px !important;
margin-left: 0 !important;
}
#legacy-thread-poll-wrap a.bbcode-spoilerbox__link,
#legacy-thread-poll-wrap a.bbcode-spoilerbox__link:visited,
#legacy-thread-poll-wrap a.bbcode-spoilerbox__link .bbcode-spoilerbox__link-icon{
color: #CC6600 !important;
fill: #CC6600 !important;
stroke: #CC6600 !important;
}
#legacy-thread-poll-wrap .btn-osu-big--forum-primary,
#legacy-thread-poll-wrap .btn-osu-big--forum-primary *,
#legacy-thread-poll-wrap .btn-osu-big--forum-secondary,
#legacy-thread-poll-wrap .btn-osu-big--forum-secondary *{
color: #ffffff !important;
}
#legacy-thread-poll-wrap .forum-poll__title,
#legacy-thread-poll-wrap .forum-poll__title *{
color: #444444 !important;
}
.btn-circle{
--bg: #2299bb !important;
background-color: var(--bg) !important;
transition: filter .15s ease;
}
.btn-circle:hover{
filter: brightness(1.15);
}
.js-forum-post-edit--container form.forum-post-edit-box{
background-color: #eaeaea !important;
background-image: none !important;
padding: 10px !important;
border: 1px solid #dddddd !important;
}
.js-forum-post-edit--container form.forum-post-edit-box > .bbcode-editor{
background: transparent !important;
}
.js-forum-post-edit--container .bbcode-editor__content{
background-color: #ffffff !important;
background-image: none !important;
border: 1px solid #dddddd !important;
}
.js-forum-post-edit--container textarea.bbcode-editor__body,
.js-forum-post-edit--container .bbcode-editor__preview,
.js-forum-post-edit--container .bbcode-editor__preview .forum-post-content{
background-color: #ffffff !important;
background-image: none !important;
}
.js-forum-post-edit--container .bbcode-size-select__select.js-bbcode-btn--size{
background-color: #eaeaea !important;
background-image: none !important;
border: 1px solid #dddddd !important;
color: #444444 !important;
border-radius: 3px !important;
-webkit-appearance: none !important;
appearance: none !important;
padding: 3px 24px 3px 8px !important;
line-height: 16px !important;
}
.js-forum-post-edit--container .bbcode-size-select__select.js-bbcode-btn--size option{
background-color: #ffffff !important;
color: #444444 !important;
}
.js-forum-post-edit--container label.bbcode-size-select{
background: transparent !important;
}
.js-forum-post-edit--container label.bbcode-size-select{
position: relative !important;
}
.js-forum-post-edit--container label.bbcode-size-select > i.fas.fa-chevron-down{
pointer-events: none !important;
position: absolute !important;
right: 8px !important;
top: 50% !important;
transform: translateY(-50%) !important;
}
.js-forum-post-edit--container .post-box-toolbar .btn-circle,
.js-forum-post-edit--container .post-box-toolbar .btn-circle .btn-circle__content,
.js-forum-post-edit--container .post-box-toolbar .btn-circle i,
.js-forum-post-edit--container .post-box-toolbar .btn-circle i::before{
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
}
.js-forum-post-edit--container .post-box-toolbar .btn-circle svg,
.js-forum-post-edit--container .post-box-toolbar .btn-circle svg *{
fill: #ffffff !important;
stroke: #ffffff !important;
}
.js-forum-post-edit--container .bbcode-editor__buttons--actions button,
.js-forum-post-edit--container .bbcode-editor__buttons--actions button *{
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
}
.js-forum-post-edit--container .bbcode-editor__preview .bbcode{
color: #444444 !important;
text-shadow: none !important;
}
.js-forum-post-edit--container .bbcode-editor__preview .bbcode a,
.js-forum-post-edit--container .bbcode-editor__preview .bbcode a:visited{
color: #2299bb !important;
}
.js-forum-post-edit--container .bbcode-editor__preview .bbcode blockquote > h4,
.js-forum-post-edit--container .bbcode-editor__preview .bbcode blockquote > :first-child{
color: #CC5288 !important;
}
.js-forum-post-edit--container .bbcode-editor__preview .bbcode blockquote{
border-left: 5px solid #e3e3e3 !important;
padding-left: 10px !important;
margin-left: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
.js-forum-post-edit--container .bbcode-editor__preview .bbcode blockquote::before,
.js-forum-post-edit--container .bbcode-editor__preview .bbcode blockquote::after,
.js-forum-post-edit--container .bbcode-editor__preview .bbcode blockquote > *::before,
.js-forum-post-edit--container .bbcode-editor__preview .bbcode blockquote > *::after{
content: none !important;
display: none !important;
}
.js-forum-post-edit--container .bbcode-editor__preview .bbcode blockquote a,
.js-forum-post-edit--container .bbcode-editor__preview .bbcode blockquote a:visited{
color: #2299bb !important;
}
.js-forum-post-edit--container .bbcode-editor__preview,
.js-forum-post-edit--container .bbcode-editor__preview *{
-webkit-text-fill-color: initial !important;
}
.js-forum-post-edit--container .bbcode-editor__preview .bbcode{
color: #444444 !important;
text-shadow: none !important;
}
.js-forum-post-edit--container .bbcode-editor__preview .bbcode a,
.js-forum-post-edit--container .bbcode-editor__preview .bbcode a:visited{
color: #2299bb !important;
-webkit-text-fill-color: #2299bb !important;
}
.js-forum-post-edit--container .bbcode-editor__preview .bbcode h1,
.js-forum-post-edit--container .bbcode-editor__preview .bbcode h2{
color: #CC5288 !important;
-webkit-text-fill-color: #CC5288 !important;
}
.js-forum-post-edit--container .bbcode-editor__preview .bbcode blockquote{
border-left: 5px solid #e3e3e3 !important;
padding-left: 10px !important;
margin-left: 0 !important;
background: transparent !important;
box-shadow: none !important;
color: #444444 !important;
}
.js-forum-post-edit--container .bbcode-editor__preview .bbcode blockquote > h4{
color: #CC5288 !important;
-webkit-text-fill-color: #CC5288 !important;
}
.js-forum-post-edit--container .bbcode-editor__preview .bbcode a.bbcode-spoilerbox__link,
.js-forum-post-edit--container .bbcode-editor__preview .bbcode a.bbcode-spoilerbox__link:visited{
color: #CC6600 !important;
-webkit-text-fill-color: #CC6600 !important;
}
.js-forum-post-edit--container .bbcode-editor__preview .bbcode pre,
.js-forum-post-edit--container .bbcode-editor__preview .bbcode code{
background: #F5F5F5 !important;
border: 1px solid #DDDDDD !important;
}
.js-forum-post-edit--container .post-box-toolbar__help,
.js-forum-post-edit--container .post-box-toolbar__help:visited{
color: #2299bb !important;
-webkit-text-fill-color: #2299bb !important;
}
.fixed-bar .osu-page--forum-topic-reply .post-box-toolbar__help,
.fixed-bar .osu-page--forum-topic-reply .post-box-toolbar__help:visited,
.forum-topic-reply .osu-page--forum-topic-reply .post-box-toolbar__help,
.forum-topic-reply .osu-page--forum-topic-reply .post-box-toolbar__help:visited{
color: #2299bb !important;
-webkit-text-fill-color: #2299bb !important;
}
.fixed-bar .osu-page--forum-topic-reply,
.forum-topic-reply .osu-page--forum-topic-reply{
background-color: #eaeaea !important;
background-image: none !important;
border: 1px solid #dddddd !important;
padding: 10px !important;
}
.fixed-bar .osu-page--forum-topic-reply .bbcode-editor__content,
.forum-topic-reply .osu-page--forum-topic-reply .bbcode-editor__content{
background-color: #ffffff !important;
background-image: none !important;
border: 1px solid #dddddd !important;
}
.fixed-bar .osu-page--forum-topic-reply textarea.bbcode-editor__body,
.forum-topic-reply .osu-page--forum-topic-reply textarea.bbcode-editor__body{
background-color: #ffffff !important;
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
caret-color: #444444 !important;
}
.fixed-bar .osu-page--forum-topic-reply .bbcode-editor__preview,
.fixed-bar .osu-page--forum-topic-reply .bbcode-editor__preview *,
.forum-topic-reply .osu-page--forum-topic-reply .bbcode-editor__preview,
.forum-topic-reply .osu-page--forum-topic-reply .bbcode-editor__preview *{
-webkit-text-fill-color: initial !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode{
color: #444444 !important;
text-shadow: none !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode a,
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode a:visited,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode a,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode a:visited{
color: #2299bb !important;
-webkit-text-fill-color: #2299bb !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode h2,
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote > h4,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode h2,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote > h4{
color: #CC5288 !important;
-webkit-text-fill-color: #CC5288 !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote{
border-left: 5px solid #e3e3e3 !important;
padding-left: 10px !important;
margin-left: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
.fixed-bar .osu-page--forum-topic-reply .post-box-toolbar .btn-circle,
.fixed-bar .osu-page--forum-topic-reply .post-box-toolbar .btn-circle * ,
.forum-topic-reply .osu-page--forum-topic-reply .post-box-toolbar .btn-circle,
.forum-topic-reply .osu-page--forum-topic-reply .post-box-toolbar .btn-circle *{
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
}
.fixed-bar .osu-page--forum-topic-reply .bbcode-size-select__select.js-bbcode-btn--size,
.forum-topic-reply .osu-page--forum-topic-reply .bbcode-size-select__select.js-bbcode-btn--size{
background-color: #eaeaea !important;
border: 1px solid #dddddd !important;
color: #444444 !important;
-webkit-appearance: none !important;
appearance: none !important;
}
.fixed-bar .osu-page--forum-topic-reply .bbcode-editor__title,
.forum-topic-reply .osu-page--forum-topic-reply .bbcode-editor__title{
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
}
.fixed-bar .osu-page--forum-topic-reply .bbcode-size-select__select.js-bbcode-btn--size option,
.forum-topic-reply .osu-page--forum-topic-reply .bbcode-size-select__select.js-bbcode-btn--size option{
background-color: #ffffff !important;
color: #444444 !important;
}
.fixed-bar .osu-page--forum-topic-reply .post-box-toolbar__help,
.fixed-bar .osu-page--forum-topic-reply .post-box-toolbar__help:visited,
.forum-topic-reply .osu-page--forum-topic-reply .post-box-toolbar__help,
.forum-topic-reply .osu-page--forum-topic-reply .post-box-toolbar__help:visited{
color: #2299bb !important;
-webkit-text-fill-color: #2299bb !important;
}
.fixed-bar .osu-page--forum-topic-reply label.bbcode-size-select,
.forum-topic-reply .osu-page--forum-topic-reply label.bbcode-size-select{
background: transparent !important;
}
.fixed-bar .osu-page--forum-topic-reply label.bbcode-size-select > select.bbcode-size-select__select,
.forum-topic-reply .osu-page--forum-topic-reply label.bbcode-size-select > select.bbcode-size-select__select{
background: #eaeaea !important;
border: 1px solid #dddddd !important;
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
-webkit-appearance: none !important;
appearance: none !important;
border-radius: 3px !important;
padding: 3px 24px 3px 8px !important;
line-height: 16px !important;
filter: none !important;
}
.fixed-bar .osu-page--forum-topic-reply .post-box-toolbar label.bbcode-size-select > select,
.forum-topic-reply .osu-page--forum-topic-reply .post-box-toolbar label.bbcode-size-select > select{
background: #eaeaea !important;
}
.fixed-bar .osu-page--forum-topic-reply label.bbcode-size-select > i.fas.fa-chevron-down,
.forum-topic-reply .osu-page--forum-topic-reply label.bbcode-size-select > i.fas.fa-chevron-down{
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
}
.fixed-bar .osu-page--forum-topic-reply label.bbcode-size-select,
.forum-topic-reply .osu-page--forum-topic-reply label.bbcode-size-select{
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
}
.fixed-bar .osu-page--forum-topic-reply .bbcode-size-select__label,
.forum-topic-reply .osu-page--forum-topic-reply .bbcode-size-select__label{
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
}
.fixed-bar .osu-page--forum-topic-reply select.bbcode-size-select__select option:checked,
.forum-topic-reply .osu-page--forum-topic-reply select.bbcode-size-select__select option:checked{
color: #444444 !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode a.bbcode-spoilerbox__link,
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode a.bbcode-spoilerbox__link:visited,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode a.bbcode-spoilerbox__link,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode a.bbcode-spoilerbox__link:visited{
color: #CC6600 !important;
-webkit-text-fill-color: #CC6600 !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode a.bbcode-spoilerbox__link .bbcode-spoilerbox__link-icon,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode a.bbcode-spoilerbox__link .bbcode-spoilerbox__link-icon{
color: #CC6600 !important;
fill: #CC6600 !important;
stroke: #CC6600 !important;
filter: none !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .well,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .well{
background: #eeeeee !important;
border: 1px solid #dddddd !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview pre,
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview code,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview pre,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview code{
background: #F5F5F5 !important;
border: 1px solid #DDDDDD !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote{
background: transparent !important;
box-shadow: none !important;
border: 0 !important;
margin: 0 0 0 0 !important;
padding: 0 0 0 10px !important;
color: #444444 !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote{
border-left: 5px solid #e3e3e3 !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote blockquote,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote blockquote{
border-left: 5px solid #e3e3e3 !important;
margin-left: 6px !important;
padding-left: 10px !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote::before,
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote::after,
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote > *::before,
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote > *::after,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote::before,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote::after,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote > *::before,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote > *::after{
content: none !important;
display: none !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode a.bbcode-spoilerbox__link .bbcode-spoilerbox__link-icon,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode a.bbcode-spoilerbox__link .bbcode-spoilerbox__link-icon{
color: #595959 !important;
-webkit-text-fill-color: #595959 !important;
fill: #595959 !important;
stroke: #595959 !important;
filter: none !important;
font-weight: 1 !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .bbcode blockquote,
.js-forum-post-edit--container .bbcode-editor__preview .bbcode blockquote{
margin: 0 0 15px 0 !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .audio-player,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .audio-player{
background: #F5F5F5 !important;
border: 1px solid #DDDDDD !important;
border-radius: 4px !important;
box-shadow: none !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .audio-player,
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .audio-player *,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .audio-player,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .audio-player *{
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
text-shadow: none !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .audio-player__bar--progress,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .audio-player__bar--progress{
background: #1c1719 !important;
}
.fixed-bar .osu-page--forum-topic-reply .forum-post-content--reply-preview .audio-player__bar--progress .audio-player__bar-current,
.forum-topic-reply .osu-page--forum-topic-reply .forum-post-content--reply-preview .audio-player__bar--progress .audio-player__bar-current{
background: #ff66ab !important;
}
#legacy-thread-crumbimg{
position: relative !important;
}
#legacy-thread-crumbimg .legacy-thread-counters{
position: absolute !important;
right: 4.5% !important;
bottom: 12% !important;
display: flex !important;
gap: 10px !important;
z-index: 3 !important;
pointer-events: auto !important;
}
#legacy-thread-crumbimg .legacy-thread-counters .counter-box{
filter: drop-shadow(0 2px 2px rgba(0,0,0,.25));
}
#legacy-thread-crumbimg .legacy-thread-counters .counter-box{
position: relative !important;
background: rgba(0, 0, 0, .7) !important;
border: none !important;
box-shadow:
0 0 0 2px rgba(0,0,0,.5),
0 4px 10px rgba(0,0,0,.7);
padding: 7.5px 7.5px 7.5px 7.5px !important;
min-width: 132px !important;
display: flex !important;
flex-direction: column !important;
gap: 2px !important;
}
#legacy-thread-crumbimg .legacy-thread-counters .counter-box::after{
content: "" !important;
position: absolute !important;
top: 8px !important;
bottom: 8px !important;
right: 10px !important;
width: 2px !important;
background: #88B300 !important;
border-radius: 2px !important;
}
#legacy-thread-crumbimg .legacy-thread-counters .counter-box__title{
font-family: "Exo 2","Arial Grande",Tahoma,Helvetica,Arial,sans-serif !important;
font-size: 11px !important;
font-weight: 700 !important;
color: #ffffff !important;
line-height: 1.05 !important;
opacity: .95 !important;
}
#legacy-thread-crumbimg .legacy-thread-counters .counter-box__count{
font-family: "Exo 2","Arial Grande",Tahoma,Helvetica,Arial,sans-serif !important;
font-size: 18px !important;
font-weight: 500 !important;
color: #ffffff !important;
line-height: 1 !important;
}
#legacy-thread-crumbimg .legacy-thread-counters .counter-box__line{
display: none !important;
}
.sticky-header__body{
background-color: #333333 !important;
}
.legacy-thread-counters{
transform: translateX(15px);
}
.sticky-header__body .sticky-header-breadcrumbs__link,
.sticky-header__body .sticky-header-breadcrumbs__link:visited,
.sticky-header__body .sticky-header-breadcrumbs__link--is-active{
color: #ffffff !important;
}
.sticky-header__body .sticky-header-breadcrumbs{
background-color: #445500 !important;
border-radius: 4px !important;
padding: 3px 6px !important;
box-sizing: border-box !important;
}
.sticky-header__breadcrumbs,
.sticky-header__breadcrumbs *{
color: #ffffff !important;
}
.sticky-header__body .forum-topic-floating-header__title-link{
color: #ffffff !important;
}
.forum-topic-nav__content{
background-color: #333333 !important;
}
.btn-osu-big--forum-reply{
background-color: #2299bb !important;
border-color: #2299bb !important;
}
.btn-osu-big--forum-reply,
.btn-osu-big--forum-reply *{
color: #ffffff !important;
}
.btn-osu-big--forum-reply:hover{
filter: brightness(1.15) !important;
}
.forum-topic-nav__counter,
.forum-topic-nav__counter-container,
.forum-topic-nav__counter-cover{
border-radius: 4px !important;
}
.forum-topic-nav__counter,
.forum-topic-nav__counter input{
font-family: "Exo 2","Arial Grande",Tahoma,Helvetica,Arial,sans-serif !important;
font-variant-numeric: tabular-nums !important;
font-size: 15px !important;
transform: translateX(-3px) !important;
}
.forum-topic-nav__counter--left,
.forum-topic-nav__counter--middle{
padding-left: 2px !important;
padding-right: 2px !important;
}
.forum-topic-nav__counter--right{
padding-left: 3px !important;
padding-right: 3px !important;
}
.forum-topic-nav__counter{
box-sizing: border-box !important;
}
body:has(.forum-topic-toolbar)
.header-nav-v4.header-nav-v4--breadcrumb {
transform: translateY(calc(var(--legacy-breadcrumb-nudge) + 13px)) !important;
}
.forum-topic-title__title {
margin: 10px !important;
}
.forum-topic-title__title {
transform: translateY(calc(-50% + 25px)) !important;
}
.osu-page--forum-topic{
background-color: #eaeaea !important;
background-image: none !important;
}
.osu-page--forum-topic .bbcode-editor--create{
background: transparent !important;
}
.osu-page--forum-topic .bbcode-editor--create .bbcode-editor__content{
background-color: #ffffff !important;
background-image: none !important;
border: 1px solid #dddddd !important;
}
.osu-page--forum-topic .bbcode-editor--create .bbcode-editor__input-title,
.osu-page--forum-topic .bbcode-editor--create textarea.bbcode-editor__body{
background-color: #ffffff !important;
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
caret-color: #444444 !important;
}
.osu-page--forum-topic .bbcode-editor--create ::placeholder{
color: #777777 !important;
opacity: 1 !important;
}
.osu-page--forum-topic .bbcode-editor--create .post-box-toolbar .btn-circle,
.osu-page--forum-topic .bbcode-editor--create .post-box-toolbar .btn-circle *{
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
}
.osu-page--forum-topic .bbcode-editor--create .post-box-toolbar__help,
.osu-page--forum-topic .bbcode-editor--create .post-box-toolbar__help:visited{
color: #2299bb !important;
-webkit-text-fill-color: #2299bb !important;
}
.osu-page--forum-topic .bbcode-editor--create .bbcode-size-select__select.js-bbcode-btn--size{
background-color: #eaeaea !important;
border: 1px solid #dddddd !important;
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
-webkit-appearance: none !important;
appearance: none !important;
border-radius: 3px !important;
padding: 3px 24px 3px 8px !important;
line-height: 16px !important;
}
.osu-page--forum-topic .bbcode-editor--create .bbcode-size-select__select.js-bbcode-btn--size option{
background-color: #ffffff !important;
color: #444444 !important;
}
.osu-page--forum-topic .bbcode-editor--create label.bbcode-size-select > i.fas.fa-chevron-down{
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
}
.osu-page--forum-topic .bbcode-editor--create .bbcode-size-select__label{
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
}
.osu-page--forum-topic .js-post-preview--box.forum-post-preview{
background: #ffffff !important;
border: 0 !important;
box-shadow: none !important;
}
.osu-page--forum-topic .forum-post-preview{
background: #eaeaea !important;
border: 1px solid #dddddd !important;
}
.osu-page--forum-topic .forum-post-preview .forum-post-content{
background: #ffffff !important;
}
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .js-post-preview--preview *,
.osu-page--forum-topic .bbcode-editor__preview,
.osu-page--forum-topic .bbcode-editor__preview *{
-webkit-text-fill-color: initial !important;
}
.osu-page--forum-topic .js-post-preview--preview .bbcode,
.osu-page--forum-topic .bbcode-editor__preview .bbcode{
color: #444444 !important;
text-shadow: none !important;
}
.osu-page--forum-topic .js-post-preview--preview .bbcode a,
.osu-page--forum-topic .js-post-preview--preview .bbcode a:visited,
.osu-page--forum-topic .bbcode-editor__preview .bbcode a,
.osu-page--forum-topic .bbcode-editor__preview .bbcode a:visited{
color: #2299bb !important;
-webkit-text-fill-color: #2299bb !important;
}
.osu-page--forum-topic .js-post-preview--preview .bbcode h1,
.osu-page--forum-topic .js-post-preview--preview .bbcode h2,
.osu-page--forum-topic .bbcode-editor__preview .bbcode h1,
.osu-page--forum-topic .bbcode-editor__preview .bbcode h2{
color: #CC5288 !important;
-webkit-text-fill-color: #CC5288 !important;
}
.osu-page--forum-topic .js-post-preview--preview .bbcode blockquote,
.osu-page--forum-topic .bbcode-editor__preview .bbcode blockquote{
border-left: 5px solid #e3e3e3 !important;
padding-left: 10px !important;
margin-left: 0 !important;
background: transparent !important;
box-shadow: none !important;
color: #444444 !important;
}
.osu-page--forum-topic .js-post-preview--preview .bbcode blockquote > h4,
.osu-page--forum-topic .bbcode-editor__preview .bbcode blockquote > h4{
color: #CC5288 !important;
-webkit-text-fill-color: #CC5288 !important;
}
.osu-page--forum-topic .js-post-preview--preview .bbcode a.bbcode-spoilerbox__link,
.osu-page--forum-topic .js-post-preview--preview .bbcode a.bbcode-spoilerbox__link:visited,
.osu-page--forum-topic .bbcode-editor__preview .bbcode a.bbcode-spoilerbox__link,
.osu-page--forum-topic .bbcode-editor__preview .bbcode a.bbcode-spoilerbox__link:visited{
color: #CC6600 !important;
-webkit-text-fill-color: #CC6600 !important;
}
.osu-page--forum-topic .js-post-preview--preview a.bbcode-spoilerbox__link .bbcode-spoilerbox__link-icon,
.osu-page--forum-topic .bbcode-editor__preview a.bbcode-spoilerbox__link .bbcode-spoilerbox__link-icon{
color: #595959 !important;
-webkit-text-fill-color: #595959 !important;
fill: #595959 !important;
stroke: #595959 !important;
filter: none !important;
}
.osu-page--forum-topic .js-post-preview--preview pre,
.osu-page--forum-topic .js-post-preview--preview code,
.osu-page--forum-topic .bbcode-editor__preview pre,
.osu-page--forum-topic .bbcode-editor__preview code{
background: #F5F5F5 !important;
border: 1px solid #DDDDDD !important;
}
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .bbcode{
color:#444444 !important;
text-shadow:none !important;
}
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .bbcode a,
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .bbcode a:visited{
color:#2299bb !important;
-webkit-text-fill-color:#2299bb !important;
}
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .bbcode h2{
color:#CC5288 !important;
-webkit-text-fill-color:#CC5288 !important;
}
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .bbcode blockquote{
background:transparent !important;
box-shadow:none !important;
border:0 !important;
border-left:5px solid #e3e3e3 !important;
padding-left:10px !important;
margin-left:0 !important;
color:#444444 !important;
}
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .bbcode blockquote::before,
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .bbcode blockquote::after,
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .bbcode blockquote > *::before,
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .bbcode blockquote > *::after{
content:none !important;
display:none !important;
}
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .bbcode blockquote > h4{
color:#CC5288 !important;
-webkit-text-fill-color:#CC5288 !important;
border:0 !important;
box-shadow:none !important;
background:transparent !important;
padding-left:0 !important;
margin-left:0 !important;
}
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .bbcode blockquote blockquote{
border-left:5px solid #e3e3e3 !important;
padding-left:10px !important;
margin-left:6px !important;
}
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .bbcode a.bbcode-spoilerbox__link,
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .bbcode a.bbcode-spoilerbox__link:visited{
color:#CC6600 !important;
-webkit-text-fill-color:#CC6600 !important;
}
:where(
.forum-post__body,
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) a.bbcode-spoilerbox__link .bbcode-spoilerbox__link-icon,
:where(
.forum-post__body,
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) a.bbcode-spoilerbox__link .bbcode-spoilerbox__link-icon::before{
color: #595959 !important;
-webkit-text-fill-color: #595959 !important;
filter: none !important;
}
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .audio-player,
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) audio-player,
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .js-audio--player{
background:#F5F5F5 !important;
border:1px solid #DDDDDD !important;
border-radius:4px !important;
box-shadow:none !important;
}
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .audio-player,
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .audio-player *{
color:#444444 !important;
-webkit-text-fill-color:#444444 !important;
text-shadow:none !important;
}
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .audio-player a{
color:#2299bb !important;
-webkit-text-fill-color:#2299bb !important;
}
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .audio-player__bar--progress,
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .audio-player__bar--volume{
background:#1c1719 !important;
}
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .audio-player__bar-current{
background:#ff66ab !important;
}
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .audio-player__button:hover,
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .audio-player__button:focus-visible,
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .audio-player__volume-button:hover,
:where(
.js-forum-post-edit--container .bbcode-editor__preview,
.osu-page--forum-topic-reply .forum-post-content--reply-preview,
.osu-page--forum-topic .js-post-preview--preview,
.osu-page--forum-topic .bbcode-editor__preview
) .audio-player__volume-button:focus-visible{
filter: brightness(1.3) !important;
opacity: 0.95 !important;
}
.osu-page--forum-topic .forum-post-preview__title{
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
}
.osu-page--forum-topic .bbcode-editor--create
.bbcode-size-select__select.js-bbcode-btn--size{
background-color: #eaeaea !important;
background-image: none !important;
border: 1px solid #dddddd !important;
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
-webkit-appearance: none !important;
appearance: none !important;
border-radius: 3px !important;
padding: 3px 24px 3px 8px !important;
line-height: 16px !important;
}
.osu-page--forum-topic .bbcode-editor--create
.bbcode-size-select__select.js-bbcode-btn--size option{
background-color: #ffffff !important;
color: #444444 !important;
}
.osu-page--forum-topic .bbcode-editor--create
label.bbcode-size-select{
background: transparent !important;
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
}
.osu-page--forum-topic .bbcode-editor--create
label.bbcode-size-select > i.fas.fa-chevron-down{
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
}
.osu-page--forum-topic .forum-topic-title{
background: #ffffff !important;
border: 1px solid rgba(0,0,0,.08) !important;
box-shadow: 0 3px 3px rgba(0,0,0,.18) !important;
border-radius: 0 !important;
}
.osu-page--forum-topic .forum-topic-title__title{
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
}
.osu-page--forum-topic .bbcode-editor.bbcode-editor--create{
box-shadow: 0 3px 3px rgba(0,0,0,.18) !important;
border: 1px solid rgba(0,0,0,.08) !important;
}
.osu-page--forum-topic .js-post-preview--box.forum-post-preview{
box-shadow:
-2px 0 2px rgba(0,0,0,.12),
2px 0 2px rgba(0,0,0,.12) !important;
}
.osu-page--forum-topic .forum-topic-toolbar{
background: #e3e3e3 !important;
padding: 10px !important;
}
.osu-page--forum-topic .forum-poll.js-form-toggle--form{
background: #ffffff !important;
border: 1px solid #dddddd !important;
box-shadow: 0 3px 3px rgba(0,0,0,.18) !important;
border-radius: 0 !important;
}
.osu-page--forum-topic .forum-poll__title{
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
}
.osu-page--forum-topic .forum-poll .simple-form__label,
.osu-page--forum-topic .forum-poll .simple-form__info{
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
}
.osu-page--forum-topic .forum-poll .simple-form__input{
background: #ffffff !important;
border: 1px solid #dddddd !important;
color: #444444 !important;
-webkit-text-fill-color: #444444 !important;
}
.footer{
background: #222222
}
.js-forum__posts-progress.forum-topic-nav__seek-bar{
background-color: #445500 !important;
}
.forum-topic-nav__seek-bar{
background-color: #445500 !important;
}
.warning-box{
background-color: #FFFFFF !important;
color: #444444 !important;
}
.warning-box__icon{
color: #FFFFFF !important;
}
.forum-topic-entry__replied.legacy-replied-icon{
position:absolute !important;
top:50% !important;
transform:translateY(-50%) !important;
left:15px;
display:block !important;
visibility:visible !important;
width:6px !important;
height:6px !important;
background-color:#88b300 !important;
border-radius:50% !important;
pointer-events:none !important;
opacity:1 !important;
z-index:3 !important;
}
.forum-topic-entry__replied.legacy-replied-icon::before,
.forum-topic-entry__replied.legacy-replied-icon::after{
content:none !important;
}
`;
const getForumCoverUrl = () => {
const el = document.querySelector(".js-forum-cover--header");
if (!el) return null;
const bg =
el.style?.backgroundImage ||
getComputedStyle(el).backgroundImage ||
"";
const m = bg.match(/url\((['"]?)(.*?)\1\)/i);
const url = m?.[2]?.trim();
return url && url !== "none" ? url : null;
};
const syncThreadCrumbBannerImage = () => {
if (!isThreadPage?.() || !isThreadPage()) {
document.documentElement.style.setProperty(
"--legacy-thread-crumbimg-image",
`url("${THREAD_BREADCRUMB_IMAGE}")`
);
return;
}
const coverUrl = getForumCoverUrl();
const finalUrl = coverUrl || THREAD_BREADCRUMB_IMAGE;
document.documentElement.style.setProperty(
"--legacy-thread-crumbimg-image",
`url("${finalUrl}")`
);
};
const legacyGetPostsRoot = () => {
const page = getActiveTopicPage?.() || document;
return (
page.querySelector("#posts") ||
page.querySelector(".forum-posts__items") ||
page.querySelector(".forum-posts") ||
page
);
};
const legacyPostKey = (el) => {
if (!el) return null;
return (
el.getAttribute("data-post-id") ||
el.getAttribute("data-id") ||
el.id ||
el.dataset?.postId ||
el.dataset?.id ||
null
);
};
const legacyGetViewportAnchor = () => {
const postsRoot = legacyGetPostsRoot();
const posts = [...postsRoot.querySelectorAll(".forum-post.js-forum-post")];
if (!posts.length) return null;
let best = null;
let bestTop = Infinity;
for (const p of posts) {
const r = p.getBoundingClientRect();
if (r.height <= 0) continue;
if (r.top >= 0 && r.top < bestTop) {
best = p;
bestTop = r.top;
}
}
if (!best) {
best = posts[0];
bestTop = best.getBoundingClientRect().top;
}
return { el: best, top: bestTop };
};
let legacyLoadMorePending = null;
const legacyLooksLikeLoadMore = (target) => {
if (!isThreadPage?.() || !isThreadPage()) return false;
const el = target?.closest?.("a, button");
if (!el) return false;
const txt = (el.textContent || "").trim().toLowerCase();
const saysMore = txt.includes("mostrar mais") || txt.includes("show more");
if (!saysMore) return false;
const href = (el.getAttribute("href") || "").toLowerCase();
const looksLikeCursor = href.includes("cursor_string=") || href.includes("skip_layout=1");
const inPostsArea = !!el.closest("#posts, .forum-posts, .forum-posts__items, .osu-page--forum-topic");
return looksLikeCursor || inPostsArea;
};
const legacyCaptureBeforeLoadMore = () => {
const postsRoot = legacyGetPostsRoot();
const posts = [...postsRoot.querySelectorAll(".forum-post.js-forum-post")];
const first = posts[0] || null;
const last = posts[posts.length - 1] || null;
legacyLoadMorePending = {
ts: performance.now(),
scrollY: window.scrollY,
scrollH: document.documentElement.scrollHeight,
anchor: legacyGetViewportAnchor(),
firstKey: legacyPostKey(first),
lastKey: legacyPostKey(last),
};
};
document.addEventListener(
"pointerdown",
(e) => {
if (legacyLooksLikeLoadMore(e.target)) legacyCaptureBeforeLoadMore();
},
true
);
const legacyApplyLoadMoreFix = () => {
const p = legacyLoadMorePending;
if (!p) return;
const postsRoot = legacyGetPostsRoot();
const run = (tries = 0) => {
if (!legacyLoadMorePending) return;
const anchorEl = p.anchor?.el;
const anchorTop = p.anchor?.top ?? 0;
if (anchorEl && document.contains(anchorEl)) {
const newTop = anchorEl.getBoundingClientRect().top;
const delta = newTop - anchorTop;
if (Math.abs(delta) > 0.5) window.scrollBy(0, delta);
} else {
const posts = [...postsRoot.querySelectorAll(".forum-post.js-forum-post")];
const newFirstKey = legacyPostKey(posts[0] || null);
const newLastKey = legacyPostKey(posts[posts.length - 1] || null);
const addedAtTop = p.firstKey && newFirstKey && p.firstKey !== newFirstKey;
const addedAtBottom = p.lastKey && newLastKey && p.lastKey !== newLastKey;
if (addedAtTop && !addedAtBottom) {
const dh = document.documentElement.scrollHeight - p.scrollH;
if (dh > 1) window.scrollTo(0, p.scrollY + dh);
}
}
if (tries < 12 && performance.now() - p.ts < 5000) {
requestAnimationFrame(() => run(tries + 1));
} else {
legacyLoadMorePending = null;
}
};
requestAnimationFrame(() => run(0));
setTimeout(() => run(0), 0);
setTimeout(() => run(0), 50);
setTimeout(() => run(0), 250);
setTimeout(() => run(0), 800);
};
const iso2FromRankingLink = (flagSpan) => {
const a = flagSpan.closest("a[href*='country=']");
if (!a) return null;
try {
const u = new URL(a.href, location.origin);
const cc = (u.searchParams.get("country") || "").trim().toUpperCase();
return /^[A-Z]{2}$/.test(cc) ? cc : null;
} catch {
return null;
}
};
const iso2FromEmojiSvg = (flagSpan) => {
const bg = flagSpan.style?.backgroundImage || "";
const m = bg.match(/\/([0-9a-f]{4,6})-([0-9a-f]{4,6})\.svg/i);
if (!m) return null;
const a = parseInt(m[1], 16);
const b = parseInt(m[2], 16);
const A = 0x1F1E6;
const c1 = a - A;
const c2 = b - A;
if (c1 < 0 || c1 > 25 || c2 < 0 || c2 > 25) return null;
return String.fromCharCode(65 + c1) + String.fromCharCode(65 + c2);
};
const replaceCountryFlagsWithLegacy = (root = document) => {
root.querySelectorAll(".flag-country").forEach(span => {
if (span.dataset.legacyDone === "1") return;
const iso2 =
iso2FromRankingLink(span) ||
iso2FromEmojiSvg(span);
if (!iso2) return;
const img = document.createElement("img");
img.className = "forum__user-flag forum__user-flag--country legacy-flag";
img.alt = iso2;
img.src = `${LEGACY_FLAG_BASE}${iso2}.png`;
const t = span.getAttribute("title") || span.getAttribute("data-orig-title") || "";
if (t) img.setAttribute("title", t);
span.replaceWith(img);
});
};
const mountLegacyThreadCounters = () => {
const banner = document.getElementById("legacy-thread-crumbimg");
if (!banner) return;
if (banner.querySelector(".legacy-thread-counters")) return;
const src = document.querySelector(".js-header--main .forum-topic-title__item--counters");
if (!src) return;
const boxes = [...src.querySelectorAll(".counter-box")];
if (!boxes.length) return;
const wrap = document.createElement("div");
wrap.className = "legacy-thread-counters";
for (const b of boxes) wrap.appendChild(b.cloneNode(true));
banner.appendChild(wrap);
};
window.addEventListener("turbo:render", mountLegacyThreadCounters);
window.addEventListener("legacy:urlchange", mountLegacyThreadCounters);
setTimeout(mountLegacyThreadCounters, 0);
const rgbToCss = ({r,g,b}) => `rgb(${r}, ${g}, ${b})`;
const hueIn = (h, a, b) => (a <= b) ? (h >= a && h <= b) : (h >= a || h <= b);
const style = document.createElement("style");
style.id = "legacy-forum-style";
style.textContent = css;
document.documentElement.appendChild(style);
const ensureStyleLast = () => {
const head = document.head || document.documentElement;
head.appendChild(style);
};
let styleRaf = 0;
const ensureStyleLastScheduled = () => {
cancelAnimationFrame(styleRaf);
styleRaf = requestAnimationFrame(ensureStyleLast);
};
window.addEventListener("turbo:render", ensureStyleLastScheduled);
window.addEventListener("legacy:urlchange", ensureStyleLastScheduled);
const markImportantTriangles = (root = document) => {
root.querySelectorAll(".forum-topic-entry__icon").forEach(a => {
const hasTriangle =
!!a.querySelector("i.fa-exclamation-triangle, i.fas.fa-exclamation-triangle, i.far.fa-exclamation-triangle") ||
!!a.querySelector("i.fa-triangle-exclamation, i.fas.fa-triangle-exclamation, i.far.fa-triangle-exclamation");
a.classList.toggle("legacy-important", hasTriangle);
});
};
const getForumIdFromUrl = () => {
const m = location.pathname.match(/\/community\/forums\/(\d+)/);
return m ? m[1] : null;
};
const isFirstPage = () => {
const url = new URL(location.href);
const p = url.searchParams.get("page");
return !p || p === "1";
};
const getForumPage = () => (
document.querySelector(
"body > div.osu-layout__section.osu-layout__section--full > div.osu-page.osu-page--forum"
)
|| document.querySelector(
"body > div.osu-layout__section.osu-layout__section--full > div.osu-page.osu-page--forum-topic"
)
|| document.querySelector(
"body > div.osu-layout__section.osu-layout__section--full > div.osu-page"
)
);
const isThreadPage = () => location.pathname.includes("/community/forums/topics/");
const removePostHighlight = (root = document) => {
root
.querySelectorAll(".js-forum-post--highlighted")
.forEach(el => el.classList.remove("js-forum-post--highlighted"));
};
const syncLegacyPostInfoAvatarSizes = (root = document) => {
let anyPending = false;
root.querySelectorAll(".forum-post-info").forEach(info => {
const r = info.getBoundingClientRect();
if (!r.width) {
anyPending = true;
return;
}
const frac = 1;
const inset = 0;
const size = Math.max(60, Math.round((r.width * frac) - (inset * 2)));
info.style.setProperty("--legacy-avatar-size", `${size}px`);
});
if (anyPending) {
requestAnimationFrame(() => syncLegacyPostInfoAvatarSizes(root));
}
};
syncLegacyPostInfoAvatarSizes();
requestAnimationFrame(() => syncLegacyPostInfoAvatarSizes());
setTimeout(() => syncLegacyPostInfoAvatarSizes(), 50);
window.addEventListener("turbo:load", () => {
syncLegacyPostInfoAvatarSizes(document);
});
window.addEventListener("turbo:render", () => {
syncLegacyPostInfoAvatarSizes(document);
});
const postInfoResizeObserver = new ResizeObserver(() => {
syncLegacyPostInfoAvatarSizes();
});
document.querySelectorAll(".forum-post-info").forEach(el => postInfoResizeObserver.observe(el));
const observeNewPostInfos = (root = document) => {
root.querySelectorAll(".forum-post-info").forEach(el => postInfoResizeObserver.observe(el));
};
const ensureBannedAvatarPlaceholders = (root = document) => {
root.querySelectorAll(".forum-post-info").forEach(info => {
const hasAvatar = !!info.querySelector(".forum-post-info__row--avatar .avatar.avatar--forum");
if (hasAvatar) return;
const nameEl = info.querySelector(".forum-post-info__row--username");
const name = nameEl?.textContent?.trim() || "Banned";
let row = info.querySelector(".forum-post-info__row--avatar");
if (!row) {
row = document.createElement("div");
row.className = "forum-post-info__row forum-post-info__row--avatar";
info.prepend(row);
}
const avatar = document.createElement("div");
avatar.className = "avatar avatar--forum legacy-banned";
avatar.setAttribute("data-legacy-name", name);
avatar.style.setProperty("background-image", "none", "important");
row.appendChild(avatar);
});
};
const markThreadHeaders = (root = document) => {
const isThread = isThreadPage();
root.querySelectorAll(".osu-page--forum-topic .js-header--main").forEach(h => {
h.classList.toggle("legacy-hide-header", isThread);
});
};
const ensureThreadPollWrapAndMove = () => {
if (!isThreadPage()) {
document.querySelector("#legacy-thread-poll-wrap")?.remove();
return null;
}
const pollInner = document.querySelector(".js-forum-poll--container");
const pollCard = pollInner?.closest(".forum-poll-container") || pollInner;
if (!pollCard) {
document.querySelector("#legacy-thread-poll-wrap")?.remove();
return null;
}
let wrap = document.querySelector("#legacy-thread-poll-wrap");
if (!wrap) {
wrap = document.createElement("div");
wrap.id = "legacy-thread-poll-wrap";
}
if (pollCard.parentElement !== wrap) {
wrap.appendChild(pollCard);
}
const page = getActiveTopicPage();
if (!page) return wrap;
const firstPost = page.querySelector('.forum-post.js-forum-post[data-post-position="1"]');
if (!firstPost) return wrap;
const postsWrap =
firstPost.closest("#posts") ||
firstPost.closest(".forum-posts__items") ||
firstPost.closest(".forum-posts") ||
page;
let ref = firstPost;
while (ref && ref.parentElement !== postsWrap) ref = ref.parentElement;
const banner = document.querySelector("#legacy-thread-crumbimg");
if (banner && banner.parentElement === postsWrap) {
if (banner.nextSibling !== wrap) {
postsWrap.insertBefore(wrap, banner.nextSibling);
}
} else {
if (ref && wrap.parentElement !== postsWrap) {
postsWrap.insertBefore(wrap, ref);
}
}
return wrap;
};
const syncLegacyAvatarNames = (root = document) => {
root.querySelectorAll(".forum-post-info").forEach(info => {
const nameEl = info.querySelector(".forum-post-info__row--username");
const avatar = info.querySelector(".avatar.avatar--forum");
if (!nameEl || !avatar) return;
const name = nameEl.textContent.trim();
if (name) avatar.setAttribute("data-legacy-name", name);
const userId = nameEl.getAttribute("data-user-id") || nameEl.dataset.userId;
if (userId) {
avatar.classList.add("js-usercard");
avatar.setAttribute("data-user-id", userId);
}
});
};
syncLegacyAvatarNames();
requestAnimationFrame(() => syncLegacyAvatarNames());
ensureBannedAvatarPlaceholders();
requestAnimationFrame(() => ensureBannedAvatarPlaceholders());
const getActiveTopicPage = () => {
const page = getForumPage();
if (page && page.classList.contains("osu-page--forum-topic")) return page;
const pages = [...document.querySelectorAll(".osu-page.osu-page--forum-topic")];
return pages.find(p => p.getClientRects().length > 0) || pages[0] || null;
};
const updateThreadBannerTitleLines = (titleEl) => {
if (!titleEl) return;
titleEl.removeAttribute("data-lines");
const cs = getComputedStyle(titleEl);
const lh = parseFloat(cs.lineHeight) || 0;
const h = titleEl.getBoundingClientRect().height;
const lines = (lh > 0 && h > lh * 1.3) ? 2 : 1;
titleEl.setAttribute("data-lines", String(lines));
};
const ensureThreadBannerInFlow = () => {
if (!isThreadPage()) {
document.querySelector("#legacy-thread-top-spacer")?.remove();
document.querySelector("#legacy-thread-crumbimg")?.remove();
document.querySelector("#legacy-thread-poll-wrap")?.remove();
return;
}
document.documentElement.style.setProperty("--legacy-thread-topspacer-nudge", "-100px");
const page = getActiveTopicPage();
if (!page) return;
const firstPost = page.querySelector('.forum-post.js-forum-post[data-post-position="1"]');
if (!firstPost || firstPost.getClientRects().length === 0) return;
const postsWrap =
firstPost.closest("#posts") ||
firstPost.closest(".forum-posts__items") ||
firstPost.closest(".forum-posts") ||
page;
let ref = firstPost;
while (ref && ref.parentElement !== postsWrap) ref = ref.parentElement;
let spacer = document.querySelector("#legacy-thread-top-spacer");
if (!spacer) {
spacer = document.createElement("div");
spacer.id = "legacy-thread-top-spacer";
}
let banner = document.querySelector("#legacy-thread-crumbimg");
if (!banner) {
banner = document.createElement("div");
banner.id = "legacy-thread-crumbimg";
}
syncThreadCrumbBannerImage();
const pollWrap = ensureThreadPollWrapAndMove();
if (ref) {
postsWrap.insertBefore(spacer, ref);
postsWrap.insertBefore(banner, ref);
if (pollWrap) postsWrap.insertBefore(pollWrap, ref);
} else {
if (pollWrap) postsWrap.prepend(pollWrap);
postsWrap.prepend(banner);
postsWrap.prepend(spacer);
}
markThreadHeaders(document);
const bar = document.querySelector(".header-v4__row.header-v4__row--bar");
if (bar) {
const r = bar.getBoundingClientRect();
const h = Math.max(0, Math.round(r.height - 30));
document.documentElement.style.setProperty("--legacy-thread-top-spacer-h", `${h}px`);
} else {
document.documentElement.style.setProperty("--legacy-thread-top-spacer-h", `0px`);
}
const t = getThreadTitleText();
let title = banner.querySelector(".legacy-thread-title-inbanner");
if (!title) {
title = document.createElement("div");
title.className = "legacy-thread-title-inbanner";
banner.appendChild(title);
}
title.textContent = t;
requestAnimationFrame(() => updateThreadBannerTitleLines(title));
setTimeout(() => updateThreadBannerTitleLines(title), 50);
};
const removeCreateTopicRow = (root = document) => {
root
.querySelectorAll("#topics ul.forum-list__items > li#legacy-create-topic")
.forEach(el => el.remove());
};
const injectCreateTopicRow = (root = document) => {
const topics = root.querySelector("#topics");
if (!topics) return;
const ul = topics.querySelector("ul.forum-list__items");
if (!ul) return;
if (!isFirstPage()) {
removeCreateTopicRow(root);
return;
}
if (ul.querySelector(":scope > li#legacy-create-topic")) return;
const forumId = getForumIdFromUrl();
if (!forumId) return;
const href = `https://osu.ppy.sh/community/forums/topics/create?forum_id=${forumId}`;
const li = document.createElement("li");
li.id = "legacy-create-topic";
li.className = "forum-topic-entry clickable-row u-forum--hover-area";
li.innerHTML = `
<div class="forum-topic-entry__bg"></div>
<a class="
forum-topic-entry__col
forum-topic-entry__col--icon
forum-topic-entry__col--icon-plus
js-login-required--click
" href="${href}">
<span class="legacy-plus-icon" aria-hidden="true"></span>
</a>
<div class="forum-topic-entry__col forum-topic-entry__col--main">
<div class="forum-topic-entry__content forum-topic-entry__content--left">
<a class="
u-forum--link
u-forum--hover-target
clickable-row-link
js-login-required--click
forum-topic-entry__title
" href="${href}">
Post new topic
</a>
</div>
</div>
<a class="
forum-topic-entry__col
forum-topic-entry__col--last-link
js-login-required--click
u-forum--link-hover
" href="${href}" data-orig-title="Post new topic">
<i class="fa fa-chevron-right"></i>
</a>
`;
ul.prepend(li);
};
const ensureLegacyReplied = (entry, replied, locked) => {
let el =
entry.querySelector(":scope > .forum-topic-entry__replied") ||
entry.querySelector(".forum-topic-entry__replied");
if (replied) {
if (!el) {
el = document.createElement("span");
el.className = "forum-topic-entry__replied";
el.setAttribute("data-orig-title", "Você respondeu a este tópico");
el.setAttribute("data-hasqtip", "1");
}
el.classList.add("legacy-replied-icon");
el.style.left = locked ? "1px" : "15px";
if (el.parentElement !== entry) entry.prepend(el);
else entry.prepend(el);
} else if (el) {
el.classList.remove("legacy-replied-icon");
el.style.left = "";
}
};
const ensureLegacyLock = (entry, locked) => {
let icon = entry.querySelector(":scope > .legacy-lock-icon");
if (locked) {
if (!icon) {
icon = document.createElement("i");
icon.className = "fas fa-lock legacy-lock-icon";
entry.prepend(icon);
}
entry.classList.add("legacy-locked");
} else {
if (icon) icon.remove();
entry.classList.remove("legacy-locked");
}
};
const setLegacyHeaderImageForForum = (forumId) => {
const img = (forumId === "52") ? THREADS_HEADER_52 : THREADS_HEADER_OTHER;
document.documentElement.style.setProperty("--legacy-threads-header-image", `url("${img}")`);
};
const getForumTitleText = () => {
const lastCrumb =
document.querySelector(".header-nav-v4--breadcrumb .header-nav-v4__item:last-child .header-nav-v4__link") ||
document.querySelector(".header-nav-v4--breadcrumb .header-nav-v4__item:last-child a");
const t = lastCrumb?.textContent?.replace(/\s+/g, " ").trim();
if (t) return t;
const docT = (document.title || "").trim();
return docT.replace(/\s*·\s*osu!\s*$/i, "") || "Forum";
};
const getThreadTitleText = () => {
const h1 =
document.querySelector("h1.forum-topic-title") ||
document.querySelector(".forum-topic-title") ||
document.querySelector("h1.title") ||
document.querySelector("h1");
if (h1) {
const tmp = h1.cloneNode(true);
tmp.querySelectorAll(
"time, .js-timeago, .timeago, .forum-topic-title__details, .forum-topic-title__info, .forum-topic-title__meta, small"
).forEach(n => n.remove());
tmp.querySelectorAll("[class*='time'], [class*='date'], [class*='meta'], [class*='details'], [class*='info']")
.forEach(n => n.remove());
const t = tmp.textContent.replace(/\s+/g, " ").trim();
if (t) return t;
}
const docT = (document.title || "").trim();
return docT.replace(/\s*·\s*osu!\s*$/i, "") || "Thread";
};
const ensureLegacyHeaderTitle = () => {
const page = getForumPage();
if (!page) return null;
const container = isThreadPage() ? document.body : page;
let el = document.getElementById("legacy-forum-header-title");
if (!el) {
el = document.createElement("a");
el.id = "legacy-forum-header-title";
el.className = "u-forum--link";
container.appendChild(el);
} else if (el.parentElement !== container) {
container.appendChild(el);
}
if (isThreadPage()) {
el.textContent = getThreadTitleText();
el.href = location.href;
} else {
el.textContent = getForumTitleText();
el.href = location.href;
}
const forumId = getForumIdFromUrl();
if (forumId) setLegacyHeaderImageForForum(forumId);
return el;
};
const markLocked = (root = document) => {
root.querySelectorAll(".forum-topic-entry").forEach(entry => {
const locked = !!entry.querySelector("i.fa-lock, i.fas.fa-lock, i[class*='fa-lock']");
ensureLegacyLock(entry, locked);
const replied = !!entry.querySelector(".forum-topic-entry__replied");
ensureLegacyReplied(entry, replied, locked);
});
};
let _legacyHeaderRaf = 0;
const scheduleLegacyHeaderSync = () => {
cancelAnimationFrame(_legacyHeaderRaf);
_legacyHeaderRaf = requestAnimationFrame(() => {
syncLegacyHeader();
setTimeout(syncLegacyHeader, 50);
setTimeout(syncLegacyHeader, 250);
});
};
let supporterRaf = 0;
const scheduleSupporterRescan = () => {
cancelAnimationFrame(supporterRaf);
supporterRaf = requestAnimationFrame(() => applySupporterAvatarOverlays(document));
};
const syncLegacyHeader = () => {
const bar = document.querySelector(".header-v4__row.header-v4__row--bar");
const crumb = document.querySelector(".header-nav-v4.header-nav-v4--breadcrumb");
const page = getForumPage();
if (!bar || !page) return;
ensureThreadBannerInFlow();
markThreadHeaders(document);
ensureThreadPollWrapAndMove();
const CUT = 26;
const VISIBLE = 50;
const OVERLAP = 10;
const GAP = 10;
bar.style.height = "";
bar.style.minHeight = "0";
bar.style.overflow = "visible";
bar.style.clipPath = "";
bar.style.paddingTop = "";
bar.style.paddingBottom = "";
let r = bar.getBoundingClientRect();
const targetTotal = CUT + VISIBLE;
if (r.height < targetTotal) {
const add = targetTotal - r.height;
bar.style.paddingTop = `${add / 2}px`;
bar.style.paddingBottom = `${add / 2}px`;
r = bar.getBoundingClientRect();
}
bar.style.overflow = "hidden";
bar.style.clipPath = `inset(0 0 ${CUT}px 0)`;
const pageRect = page.getBoundingClientRect();
const visibleBarBottom = r.bottom - CUT;
const anchorBottomViewport =
(crumb && crumb.getClientRects().length ? crumb.getBoundingClientRect().bottom : null)
?? visibleBarBottom;
document.documentElement.style.setProperty(
"--legacy-bar-visible-bottom",
`${anchorBottomViewport}px`
);
const headerH = Math.round(r.width / 5);
const pageTopDoc = pageRect.top + window.scrollY;
const anchorBottomDoc = anchorBottomViewport + window.scrollY;
const afterTop = (anchorBottomDoc - pageTopDoc) - OVERLAP;
const panelTop = afterTop + headerH + GAP;
document.documentElement.style.setProperty("--legacy-threadsheader-top", `${Math.round(afterTop)}px`);
document.documentElement.style.setProperty("--legacy-panel-top", `${Math.round(panelTop)}px`);
if (isThreadPage()) {
const rootStyle = getComputedStyle(document.documentElement);
const crumbH =
parseFloat(rootStyle.getPropertyValue("--legacy-thread-crumbimg-h")) || 200;
const crumbGap =
parseFloat(rootStyle.getPropertyValue("--legacy-thread-crumbimg-gap")) || 0;
const firstGap =
parseFloat(rootStyle.getPropertyValue("--legacy-thread-firstpost-gap")) || 5;
}
const titleEl = ensureLegacyHeaderTitle();
if (titleEl) {
titleEl.style.setProperty(
"position",
isThreadPage() ? "fixed" : "absolute",
"important"
);
const panelW = r.width;
const X_FRAC = 0.045;
const leftPx = panelW * X_FRAC;
titleEl.style.left = `calc(50% - ${panelW / 2}px + ${leftPx}px)`;
titleEl.classList.remove("legacy-title-below");
if (isThreadPage()) {
document.getElementById("legacy-forum-header-title")?.remove();
} else {
const titleEl = ensureLegacyHeaderTitle();
if (titleEl) {
titleEl.style.setProperty("position", "absolute", "important");
const panelW = r.width;
const X_FRAC = 0.045;
const leftPx = panelW * X_FRAC;
titleEl.style.left = `calc(50% - ${panelW / 2}px + ${leftPx}px)`;
titleEl.classList.remove("legacy-title-below");
titleEl.classList.remove("legacy-thread-title");
titleEl.classList.remove("legacy-title-wrap");
document.documentElement.style.setProperty("--legacy-header-title-size", "45px");
document.documentElement.style.setProperty("--legacy-header-title-line", "45px");
document.documentElement.style.setProperty("--legacy-header-title-color", "#ffffff");
document.documentElement.style.setProperty("--legacy-header-title-shadow", "0 1px 2px rgba(0,0,0, 0.7)");
titleEl.style.setProperty("transform", "translateY(-50%)", "important");
const Y_FRAC_FORUM = 0.7;
const topPx = headerH * Y_FRAC_FORUM;
titleEl.style.top = `calc(var(--legacy-threadsheader-top) + ${topPx}px)`;
titleEl.style.maxWidth = "";
}
}
}
};
const clamp01 = (x) => Math.max(0, Math.min(1, x));
const srgbToLin = (c) => {
c = c / 255;
return (c <= 0.04045) ? (c / 12.92) : Math.pow((c + 0.055) / 1.055, 2.4);
};
const relLuminance = ({r,g,b}) => {
const R = srgbToLin(r), G = srgbToLin(g), B = srgbToLin(b);
return 0.2126 * R + 0.7152 * G + 0.0722 * B;
};
const contrastRatio = (rgb1, rgb2) => {
const L1 = relLuminance(rgb1);
const L2 = relLuminance(rgb2);
const hi = Math.max(L1, L2);
const lo = Math.min(L1, L2);
return (hi + 0.05) / (lo + 0.05);
};
const parseCssColor = (str) => {
if (!str) return null;
str = str.trim().toLowerCase();
let m = str.match(/^rgba?\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)(?:\s*,\s*([\d.]+)\s*)?\)$/);
if (m) return {
r: Math.round(+m[1]),
g: Math.round(+m[2]),
b: Math.round(+m[3]),
a: (m[4] === undefined ? 1 : Math.max(0, Math.min(1, +m[4])))
};
m = str.match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/);
if (m) {
const h = m[1];
if (h.length === 3) {
return {
r: parseInt(h[0] + h[0], 16),
g: parseInt(h[1] + h[1], 16),
b: parseInt(h[2] + h[2], 16),
a: 1
};
}
return {
r: parseInt(h.slice(0,2), 16),
g: parseInt(h.slice(2,4), 16),
b: parseInt(h.slice(4,6), 16),
a: 1
};
}
if (!document.body) return null;
const tmp = document.createElement("span");
tmp.style.color = str;
document.body.appendChild(tmp);
const resolved = getComputedStyle(tmp).color;
tmp.remove();
return parseCssColor(resolved);
};
const rgbToHsl = ({r,g,b}) => {
let R = r/255, G = g/255, B = b/255;
const max = Math.max(R,G,B), min = Math.min(R,G,B);
let h=0, s=0, l=(max+min)/2;
const d = max-min;
if (d !== 0) {
s = d / (1 - Math.abs(2*l - 1));
switch(max){
case R: h = ((G-B)/d) % 6; break;
case G: h = (B-R)/d + 2; break;
case B: h = (R-G)/d + 4; break;
}
h *= 60;
if (h < 0) h += 360;
}
return {h, s, l};
};
const hslToRgb = ({h,s,l}) => {
const C = (1 - Math.abs(2*l - 1)) * s;
const X = C * (1 - Math.abs(((h/60) % 2) - 1));
const m = l - C/2;
let r1=0,g1=0,b1=0;
if (0<=h && h<60) { r1=C; g1=X; b1=0; }
else if (60<=h && h<120){ r1=X; g1=C; b1=0; }
else if (120<=h && h<180){ r1=0; g1=C; b1=X; }
else if (180<=h && h<240){ r1=0; g1=X; b1=C; }
else if (240<=h && h<300){ r1=X; g1=0; b1=C; }
else { r1=C; g1=0; b1=X; }
return {
r: Math.round((r1+m)*255),
g: Math.round((g1+m)*255),
b: Math.round((b1+m)*255),
};
};
const getEffectiveBg = (el) => {
let cur = el;
while (cur && cur.nodeType === 1) {
const bg = getComputedStyle(cur).backgroundColor;
const rgb = parseCssColor(bg);
if (rgb && rgb.a !== undefined) {
if (rgb.a > 0.05) return { r: rgb.r, g: rgb.g, b: rgb.b };
} else if (rgb) {
return { r: rgb.r, g: rgb.g, b: rgb.b };
}
cur = cur.parentElement;
}
return { r: 255, g: 255, b: 255 };
};
const fixLowContrastBBCodeColors = (root = document) => {
const MIN_CONTRAST = 1.8;
const nodes = root.querySelectorAll
? root.querySelectorAll(`
.forum-post__body [style*="color"],
.forum-post__body font[color],
.js-forum-post-edit--container [style*="color"],
.js-forum-post-edit--container font[color],
.osu-page--forum-topic-reply .forum-post-content--reply-preview [style*="color"],
.osu-page--forum-topic-reply .forum-post-content--reply-preview font[color],
.osu-page--forum-topic .js-post-preview--preview [style*="color"],
.osu-page--forum-topic .js-post-preview--preview font[color],
.osu-page--forum-topic .bbcode-editor__preview [style*="color"],
.osu-page--forum-topic .bbcode-editor__preview font[color]
`)
: [];
nodes.forEach(el => {
const inSpoiler = el.closest('.spoiler, .bbcode-spoilerbox, .bbcode-spoilerbox__content');
if (inSpoiler) {
const cs = getComputedStyle(inSpoiler);
const hidden =
cs.display === "none" ||
cs.visibility === "hidden" ||
cs.opacity === "0";
if (hidden) return;
}
let c = "";
if (el.tagName === "FONT" && el.getAttribute("color")) {
c = el.getAttribute("color");
} else {
c = el.style?.color || "";
}
if (!c) return;
const fg = parseCssColor(c);
if (!fg) return;
const bg = getEffectiveBg(el);
const cr = contrastRatio(fg, bg);
const hsl = rgbToHsl(fg);
const isNeon =
hsl.s > 0.92 &&
(hsl.l > 0.70 || hueIn(hsl.h, 80, 160));
if (cr >= MIN_CONTRAST && !isNeon) return;
let s = hsl.s;
if (s > 0.85) {
s = (hsl.l > 0.75) ? 0.60 : 0.75;
}
const bgLum = relLuminance(bg);
const dir = (bgLum > 0.5) ? -1 : 1;
let best = fg;
let l = hsl.l;
for (let i = 0; i < 140; i++) {
const candidate = hslToRgb({ h: hsl.h, s, l });
best = candidate;
if (contrastRatio(candidate, bg) >= MIN_CONTRAST) break;
l = clamp01(l + dir * 0.01);
if (l === 0 || l === 1) break;
}
el.style.setProperty("color", rgbToCss(best), "important");
});
};
const hexToRgb = (hex) => {
if (!hex) return null;
hex = hex.trim();
const m = hex.match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i);
if (!m) return null;
const h = m[1].toLowerCase();
if (h.length === 3) {
return {
r: parseInt(h[0] + h[0], 16),
g: parseInt(h[1] + h[1], 16),
b: parseInt(h[2] + h[2], 16),
};
}
return {
r: parseInt(h.slice(0, 2), 16),
g: parseInt(h.slice(2, 4), 16),
b: parseInt(h.slice(4, 6), 16),
};
};
const rgbaFromHex = (hex, a) => {
const rgb = hexToRgb(hex);
if (!rgb) return null;
return `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${a})`;
};
const normalizeGroupColour = (c) => {
if (!c) return c;
const n = c.trim().toLowerCase().replace(/\s+/g, "");
if (n === "#999999" || n === "rgb(153,153,153)") return "#666666";
if (n === "#e45678" || n === "rgb(228,86,120)") return "#fc628c";
return c.trim();
};
const getUserGroupColour = (infoEl) => {
const badge = infoEl.querySelector(".forum-post-info__row--group-badge .user-group-badge");
if (!badge) return null;
let c = badge.style.getPropertyValue("--group-colour")?.trim();
if (c) return normalizeGroupColour(c);
c = getComputedStyle(badge).getPropertyValue("--group-colour")?.trim();
return c ? normalizeGroupColour(c) : null;
};
const getSupporterLevel = (info) => {
const row = info.querySelector(".forum-post-info__row--support-level");
if (!row) return null;
const hearts = row.querySelectorAll(`
i[class*="heart"],
span[class*="heart"],
svg[data-icon="heart"],
svg[class*="heart"]
`);
return Math.min(3, hearts.length || 0);
};
const applySupporterAvatarOverlays = (root = document) => {
root.querySelectorAll(".forum-post-info").forEach(info => {
const avatar = info.querySelector(".forum-post-info__row--avatar .avatar.avatar--forum");
if (!avatar) return;
if (avatar.classList.contains("legacy-banned")) {
avatar.style.removeProperty("--legacy-avatar-white-image");
info.querySelector(".forum-post-info__row--support-level")?.remove();
return;
}
const lvl = getSupporterLevel(info);
if (lvl === null) return;
let img = null;
if (lvl === 1) img = LEGACY_AVATAR_WHITE_L1;
else if (lvl === 2) img = LEGACY_AVATAR_WHITE_L2;
else if (lvl === 3) img = LEGACY_AVATAR_WHITE_L3;
if (img) avatar.style.setProperty("--legacy-avatar-white-image", `url("${img}")`);
else avatar.style.removeProperty("--legacy-avatar-white-image");
info.querySelector(".forum-post-info__row--support-level")?.remove();
});
};
const applyLegacyUserTints = (root = document) => {
const DEFAULT = LEGACY_DEFAULT_USER_COLOUR;
const INFO_ALPHA = 0.10;
root.querySelectorAll(".forum-post-info").forEach(info => {
const avatar = info.querySelector(".forum-post-info__row--avatar .avatar.avatar--forum");
if (!avatar) return;
if (avatar.classList.contains("legacy-banned")) {
info.style.removeProperty("background-color");
avatar.style.removeProperty("--legacy-user-colour");
return;
}
const groupColour = getUserGroupColour(info);
const base = groupColour || DEFAULT;
avatar.style.setProperty("--legacy-user-colour", base);
const bg = rgbaFromHex(base, INFO_ALPHA);
if (bg) info.style.setProperty("background-color", bg, "important");
});
};
const applyRoleStripes = (root = document) => {
const DEFAULT = (LEGACY_DEFAULT_USER_COLOUR || "").trim().toLowerCase();
root.querySelectorAll(".forum-post.js-forum-post").forEach(post => {
const info = post.querySelector(".forum-post-info");
if (!info) return;
const avatar = info.querySelector(".forum-post-info__row--avatar .avatar.avatar--forum");
if (!avatar || avatar.classList.contains("legacy-banned")) {
post.classList.remove("legacy-role-stripe");
post.style.removeProperty("--legacy-role-colour");
return;
}
const groupColour = (getUserGroupColour(info) || "").trim();
const groupLower = groupColour.toLowerCase();
if (!groupColour || groupLower === DEFAULT) {
post.classList.remove("legacy-role-stripe");
post.style.removeProperty("--legacy-role-colour");
return;
}
post.classList.add("legacy-role-stripe");
post.style.setProperty("--legacy-role-colour", groupColour);
});
};
const ensureLegacyAvatarWhiteOverlay = (root = document) => {
root.querySelectorAll(".forum-post-info .avatar.avatar--forum").forEach(avatar => {
if (avatar.querySelector(":scope > .legacy-avatar-white")) return;
const d = document.createElement("div");
d.className = "legacy-avatar-white";
avatar.appendChild(d);
});
};
const applyUserColors = (root = document) => {
root.querySelectorAll(".forum-user-icon[style]").forEach(icon => {
let bg = icon.style.backgroundColor;
if (!bg) return;
const normalized = bg.replace(/\s+/g, "").toLowerCase();
if (
normalized === "rgb(153,235,71)" ||
normalized === "#99eb47"
) {
bg = "#89b300";
}
const nameEl =
icon.nextElementSibling ||
icon.closest("a, .js-usercard, .user-name") ||
icon.parentElement;
if (!nameEl) return;
nameEl.style.setProperty("color", bg, "important");
});
};
const removeForumExtras = (root = document) => {
root
.querySelectorAll(`
div.forum-list__buttons,
div.sort.sort--forum-topics,
li.forum-item--header,
div.forum-title.forum-title--forum
`)
.forEach(el => el.remove());
};
const removeLegacyPagination = (root = document) => {
root.querySelectorAll("nav.forum-pagination.legacy-forum-pagination").forEach(n => n.remove());
};
const buildLegacyPagination = (root = document) => {
const modern = root.querySelector("nav.pagination-v2.pagination-v2--forum");
if (!modern) return;
if (modern.parentElement?.querySelector("nav.forum-pagination.legacy-forum-pagination")) return;
const activeEl = modern.querySelector(".pagination-v2__link--active");
const current = parseInt(activeEl?.textContent?.trim() || "1", 10);
const pageLinks = [...modern.querySelectorAll("ul.pagination-v2__col--pages a.pagination-v2__link[href]")]
.map(a => ({
page: parseInt(a.textContent.trim(), 10),
href: a.getAttribute("href")
}))
.filter(x => Number.isFinite(x.page) && x.href);
const maxVisible = pageLinks.reduce((m, x) => Math.max(m, x.page), current);
const prevHref = modern.querySelector(".pagination-v2__col:first-child a.pagination-v2__link--quick")?.getAttribute("href") || null;
const nextHref = modern.querySelector(".pagination-v2__col:last-child a.pagination-v2__link--quick")?.getAttribute("href") || null;
const prevDisabled = !!modern.querySelector(".pagination-v2__col:first-child .pagination-v2__link--disabled");
const nextDisabled = !!modern.querySelector(".pagination-v2__col:last-child .pagination-v2__link--disabled");
const pagesLiHtml = (() => {
const last = pageLinks.reduce((m, x) => Math.max(m, x.page), current);
const clamp = (v, a, b) => Math.max(a, Math.min(b, v));
const makeHref = (p) =>
(pageLinks.find(x => x.page === p)?.href) || (() => {
const u = new URL(location.href);
u.searchParams.set("page", String(p));
u.hash = "topics";
return u.toString();
})();
const makeItem = (p) => {
const href = makeHref(p);
return (p === current)
? `<li class="active"><span>${p}</span></li>`
: `<li><a class="u-forum--link" href="${href}">${p}</a></li>`;
};
const dots = `<li><span>...</span></li>`;
if (last <= 11) {
return Array.from({ length: last }, (_, i) => makeItem(i + 1)).join("\n");
}
let start, end;
if (current === 6) {
start = 1;
end = 10;
} else if (current < 5) {
start = 1;
end = 4 + current;
} else if (current === 5) {
start = 1;
end = 9;
} else {
start = current - 4;
end = current + 4;
}
start = clamp(start, 1, last);
end = clamp(end, 1, last);
const desired = (current === 6) ? 10 : (current <= 5 ? end : 9);
if (current > 6) {
const len = end - start + 1;
if (len < 9) {
const need = 9 - len;
start = clamp(start - need, 1, last);
}
}
const parts = [];
if (start > 1) {
parts.push(makeItem(1));
if (start > 2) parts.push(dots);
}
for (let p = start; p <= end; p++) parts.push(makeItem(p));
if (end < last) {
if (end < last - 1) parts.push(dots);
parts.push(makeItem(last));
}
return parts.join("\n");
})();
const legacy = document.createElement("nav");
legacy.className = "forum-pagination legacy-forum-pagination";
legacy.innerHTML = `
<ul>
${pagesLiHtml}
</ul>
<ul class="forum-pagination-prevnext">
<li>
${
(prevDisabled || !prevHref)
? `<span><i class="fa fa-angle-left"></i>prev</span>`
: `<a class="u-forum--link" href="${prevHref}"><i class="fa fa-angle-left"></i>prev</a>`
}
</li>
<li>
${
(nextDisabled || !nextHref)
? `<span>next<i class="fa fa-angle-right"></i></span>`
: `<a class="u-forum--link" href="${nextHref}">next<i class="fa fa-angle-right"></i></a>`
}
</li>
</ul>
`;
modern.parentElement?.insertBefore(legacy, modern);
};
const escapeHtml = (s) =>
(s ?? "").replace(/[&<>"']/g, (c) => ({
"&": "&", "<": "<", ">": ">", '"': """, "'": "'"
}[c]));
const buildLegacySubforums = (root = document) => {
root.querySelectorAll(".forum-list").forEach(list => {
const ul = list.querySelector(":scope > ul.forum-list__items");
if (!ul) return;
const items = ul.querySelectorAll(":scope > li.forum-item");
if (!items.length) return;
if (list.querySelector(":scope > ul.forums.legacy-forums")) return;
list.classList.add("legacy-subforums");
const legacyUl = document.createElement("ul");
legacyUl.className = "forums legacy-forums";
items.forEach(item => {
const nameA = item.querySelector(".forum-item__name");
const desc = item.querySelector(".forum-item__description");
const latestA = item.querySelector(".forum-item__latest-post a.u-ellipsis-overflow");
const timeEl = item.querySelector(".forum-item__latest-post time");
const userA = item.querySelector(".forum-item__latest-post a.js-usercard");
const subforumLinks = [...item.querySelectorAll(".forum-item__subforums a[href]")];
const forumHref = nameA?.getAttribute("href") || "#";
const forumName = nameA?.textContent?.trim() || "";
const forumDesc = desc?.textContent?.trim() || "";
const lastHref = latestA?.getAttribute("href") || forumHref;
const lastTitle = latestA?.textContent?.trim() || "";
const timeText = timeEl?.textContent?.trim() || "";
const timeDt = timeEl?.getAttribute("datetime") || "";
const userHref = userA?.getAttribute("href") || "#";
const userName = userA?.textContent?.trim() || "";
const metaDiv = item.querySelector(".forum-item__latest-post > div");
let byWord = "";
if (metaDiv && timeEl && userA) {
const nodes = [...metaDiv.childNodes];
const iTime = nodes.indexOf(timeEl);
const iUser = nodes.indexOf(userA);
if (iTime !== -1 && iUser !== -1 && iUser > iTime) {
byWord = nodes
.slice(iTime + 1, iUser)
.filter(n => n.nodeType === Node.TEXT_NODE)
.map(n => n.textContent)
.join("")
.trim();
}
}
const subforumsHtml = subforumLinks.length
? `<ul class="subforums">
${subforumLinks.map(a => {
const t = a.getAttribute("title") || "";
const h = a.getAttribute("href") || "#";
const n = a.textContent.trim();
return `<li>
<a class="name u-forum--link" href="${escapeHtml(h)}" title="${escapeHtml(t)}">
<i class="fa fa-bars"></i>${escapeHtml(n)}
</a>
</li>`;
}).join("")}
</ul>`
: `<ul class="subforums"></ul>`;
const li = document.createElement("li");
li.className = "forums__forum clickable-row u-forum--hover-area";
li.innerHTML = `
<div class="forums__hover-bar hidden-xs">
<div class="forums__colour-stripe u-forum--bg"></div>
<div class="forums__hover-bar-icon"><i class="fa fa-angle-right"></i></div>
</div>
<div class="left">
<a class="name clickable-row-link u-forum--hover-target u-forum--link" href="${escapeHtml(forumHref)}">
${escapeHtml(forumName)}
</a>
<div class="description">${escapeHtml(forumDesc)}</div>
${subforumsHtml}
</div>
<div class="right hidden-xs">
<div class="right-content">
<a class="legacy-last-title clickable-row-link" href="${escapeHtml(lastHref)}">
${escapeHtml(lastTitle)}
</a>
<div class="legacy-last-meta">
<time class="legacy-last-time timeago" datetime="${escapeHtml(timeDt)}">${escapeHtml(timeText)}</time>
${escapeHtml(" " + byWord + " ")}
<a class="legacy-last-user js-usercard" href="${escapeHtml(userHref)}">${escapeHtml(userName)}</a>
</div>
</div>
</div>
`;
const right = li.querySelector(".right");
const rightContent = li.querySelector(".right-content");
const titleLink = li.querySelector(".last-post a.u-forum--link.title");
const when = li.querySelector(".when-post");
if (right) {
right.style.setProperty("display", "flex", "important");
right.style.setProperty("align-items", "center", "important");
right.style.setProperty("justify-content", "flex-end", "important");
}
if (rightContent) {
rightContent.style.setProperty("display", "flex", "important");
rightContent.style.setProperty("flex-direction", "column", "important");
rightContent.style.setProperty("justify-content", "center", "important");
rightContent.style.setProperty("gap", "2px", "important");
rightContent.style.setProperty("background", "transparent", "important");
rightContent.style.setProperty("background-image", "none", "important");
rightContent.style.setProperty("box-shadow", "none", "important");
rightContent.style.setProperty("border", "0", "important");
}
const killDecor = (el) => {
if (!el) return;
el.style.setProperty("background", "transparent", "important");
el.style.setProperty("background-image", "none", "important");
el.style.setProperty("box-shadow", "none", "important");
el.style.setProperty("border", "0", "important");
el.style.setProperty("outline", "0", "important");
el.style.setProperty("text-decoration", "none", "important");
};
killDecor(titleLink);
killDecor(when);
legacyUl.appendChild(li);
});
const h2 = list.querySelector(":scope > h2.title--forum");
if (h2 && h2.nextSibling) {
h2.parentNode.insertBefore(legacyUl, h2.nextSibling);
} else {
list.appendChild(legacyUl);
}
});
};
const removeLegacySubforums = (root = document) => {
root.querySelectorAll("ul.forums.legacy-forums").forEach(el => el.remove());
root.querySelectorAll(".forum-list.legacy-subforums").forEach(el => el.classList.remove("legacy-subforums"));
};
markLocked();
markImportantTriangles();
applyUserColors();
fixLowContrastBBCodeColors();
applyLegacyUserTints();
applyRoleStripes();
replaceCountryFlagsWithLegacy();
ensureLegacyAvatarWhiteOverlay();
applySupporterAvatarOverlays();
removePostHighlight();
buildLegacyPagination();
buildLegacySubforums();
injectCreateTopicRow();
removeForumExtras();
scheduleLegacyHeaderSync();
window.addEventListener("resize", scheduleLegacyHeaderSync);
const mo = new MutationObserver(muts => {
let sawSomething = false;
for (const m of muts) {
for (const n of m.addedNodes) {
if (n.nodeType === 1) {
removePostHighlight(n);
sawSomething = true;
if (n.matches?.(".forum-post-info")) {
postInfoResizeObserver.observe(n);
}
if (n.querySelectorAll) {
n.querySelectorAll(".forum-post-info").forEach(el => postInfoResizeObserver.observe(el));
}
if (n.matches?.(".forum-topic-entry")) {
const ctx = n.parentNode || document;
markLocked(ctx);
markImportantTriangles(ctx);
applyUserColors(ctx);
applyLegacyUserTints(ctx);
applyRoleStripes(ctx);
ensureLegacyAvatarWhiteOverlay(ctx);
applySupporterAvatarOverlays(ctx);
injectCreateTopicRow(ctx);
buildLegacySubforums(ctx);
buildLegacyPagination(ctx);
syncLegacyPostInfoAvatarSizes(document);
} else {
markLocked(n);
markImportantTriangles(n);
applyUserColors(n);
applyLegacyUserTints(n);
applyRoleStripes(n);
ensureLegacyAvatarWhiteOverlay(n);
applySupporterAvatarOverlays(n);
ensureBannedAvatarPlaceholders(n);
injectCreateTopicRow(n);
removeForumExtras(n);
buildLegacySubforums(n);
buildLegacyPagination(n);
fixLowContrastBBCodeColors(n);
syncLegacyAvatarNames(n);
replaceCountryFlagsWithLegacy(n);
syncLegacyPostInfoAvatarSizes(document);
}
}
}
}
if (sawSomething) {
requestAnimationFrame(() => syncLegacyPostInfoAvatarSizes(document));
setTimeout(() => syncLegacyPostInfoAvatarSizes(document), 50);
setTimeout(() => syncLegacyPostInfoAvatarSizes(document), 250);
}
requestAnimationFrame(legacyApplyLoadMoreFix);
requestAnimationFrame(() => {
markThreadHeaders(document);
ensureThreadPollWrapAndMove();
});
scheduleSupporterRescan();
});
mo.observe(document.documentElement, { childList: true, subtree: true });
const onUrlChange = () => {
const forumId = getForumIdFromUrl();
if (forumId) setLegacyHeaderImageForForum(forumId);
removeCreateTopicRow(document);
injectCreateTopicRow(document);
removeForumExtras(document);
scheduleLegacyHeaderSync();
ensureThreadBannerInFlow();
syncThreadCrumbBannerImage();
setTimeout(syncThreadCrumbBannerImage, 50);
setTimeout(syncThreadCrumbBannerImage, 250);
markThreadHeaders(document);
ensureThreadPollWrapAndMove();
setTimeout(ensureThreadPollWrapAndMove, 50);
setTimeout(ensureThreadPollWrapAndMove, 250);
syncLegacyPostInfoAvatarSizes(document);
setTimeout(() => syncLegacyPostInfoAvatarSizes(document), 50);
setTimeout(() => syncLegacyPostInfoAvatarSizes(document), 250);
ensureBannedAvatarPlaceholders(document);
setTimeout(() => ensureBannedAvatarPlaceholders(document), 250);
removeLegacySubforums(document);
buildLegacySubforums(document);
setTimeout(() => buildLegacySubforums(document), 250);
removeLegacyPagination(document);
buildLegacyPagination(document);
setTimeout(() => buildLegacyPagination(document), 250);
applySupporterAvatarOverlays(document);
setTimeout(() => applySupporterAvatarOverlays(document), 250);
markLocked(document);
markImportantTriangles(document);
applyUserColors(document);
applyLegacyUserTints(document);
applyRoleStripes(document);
ensureLegacyAvatarWhiteOverlay(document);
removePostHighlight(document);
setTimeout(() => injectCreateTopicRow(document), 50);
setTimeout(() => injectCreateTopicRow(document), 250);
setTimeout(() => removeForumExtras(document), 250);
setTimeout(() => markImportantTriangles(document), 250);
fixLowContrastBBCodeColors(document);
setTimeout(() => fixLowContrastBBCodeColors(document), 250);
};
(() => {
const fire = () => window.dispatchEvent(new Event("legacy:urlchange"));
const _pushState = history.pushState;
history.pushState = function () {
_pushState.apply(this, arguments);
fire();
};
const _replaceState = history.replaceState;
history.replaceState = function () {
_replaceState.apply(this, arguments);
fire();
};
window.addEventListener("popstate", fire);
window.addEventListener("legacy:urlchange", onUrlChange);
window.addEventListener("turbo:load", onUrlChange);
window.addEventListener("turbo:render", onUrlChange);
scheduleLegacyHeaderSync();
})();
})();