Roll back headings

app/components/Chart.tsx

@@ -126,10 +126,10 @@ function ChartTooltip({
 
 	return (
 		<div className={styles.tooltip}>
-			<h2 className="text-center text-md">
+			<h3 className="text-center text-md">
 				{header()}
 				{headerSuffix}
-			</h2>
+			</h3>
 			{dataPoints.map((dataPoint, index) => {
 				const color = dataPoint.style?.fill ?? "var(--color-accent)";
 

app/components/MobileNav.tsx

@@ -380,9 +380,9 @@ function MenuOverlay({
 							<div className={styles.panelIconContainer}>
 								<Tv size={18} />
 							</div>
-							<h2 className={styles.panelTitle}>
+							<h3 className={styles.panelTitle}>
 								{t("front:sideNav.streams")}
-							</h2>
+							</h3>
 						</header>
 						{streams.length === 0 ? (
 							<div className={styles.sideNavEmpty}>

app/features/badges/routes/badges.$id.edit.tsx

@@ -54,7 +54,7 @@ function Managers({ data }: { data: BadgeDetailsLoaderData }) {
 	return (
 		<div className="stack md">
 			<div className="stack sm">
-				<h2 className={styles.editSmallHeader}>Managers</h2>
+				<h3 className={styles.editSmallHeader}>Managers</h3>
 				<UserSearch
 					key={managers.map((m) => m.id).join("-")}
 					label="Add new manager"
@@ -135,7 +135,7 @@ function Owners({ data }: { data: BadgeDetailsLoaderData }) {
 	return (
 		<div className="stack md">
 			<div className="stack sm">
-				<h2 className={styles.editSmallHeader}>Owners</h2>
+				<h3 className={styles.editSmallHeader}>Owners</h3>
 				<UserSearch
 					label="Add new owner"
 					className="text-center"

app/features/plus-voting/routes/plus.voting.results.tsx

@@ -80,9 +80,9 @@ function Results({
 			<div className="stack lg">
 				{results.map((tiersResults) => (
 					<div className="stack md" key={tiersResults.tier}>
-						<h2 className={styles.tierHeader}>
+						<h3 className={styles.tierHeader}>
 							<span>+{tiersResults.tier}</span>
-						</h2>
+						</h3>
 						{(["passed", "failed"] as const).map((status) => (
 							<div key={status} className={styles.passedInfoContainer}>
 								<h4 className={styles.passedHeader}>

app/features/scrims/components/ScrimCard.tsx

@@ -61,7 +61,7 @@ export function ScrimPostCard({
 						owner={owner}
 					/>
 				</div>
-				<h2 className={styles.teamName}>
+				<h3 className={styles.teamName}>
 					{isPickup ? (
 						<>
 							<span className={styles.pickupLabel}>{t("scrims:pickupBy")}</span>
@@ -70,7 +70,7 @@ export function ScrimPostCard({
 					) : (
 						teamName
 					)}
-				</h2>
+				</h3>
 				<div className={styles.rightIconsContainer}>
 					{post.isPrivate ? <ScrimVisibilityPopover /> : null}
 					<ScrimTeamMembersPopover users={post.users} />
@@ -496,7 +496,7 @@ export function ScrimRequestCard({
 						owner={owner}
 					/>
 				</div>
-				<h2 className={styles.teamName}>
+				<h3 className={styles.teamName}>
 					{isPickup ? (
 						<>
 							<span className={styles.pickupLabel}>{t("scrims:pickupBy")}</span>
@@ -505,7 +505,7 @@ export function ScrimRequestCard({
 					) : (
 						teamName
 					)}
-				</h2>
+				</h3>
 				<div className={styles.rightIconsContainer}>
 					<ScrimTeamMembersPopover users={request.users} />
 				</div>

app/features/sendouq-match/routes/q.match.$id.tsx

@@ -492,7 +492,7 @@ function ReportWeaponsForm() {
 				value={JSON.stringify(weaponsUsage)}
 			/>
 			<div className="stack horizontal md justify-between w-max mx-auto">
-				<h2 className="text-md">{t("q:match.report.whoToReport")}</h2>
+				<h3 className="text-md">{t("q:match.report.whoToReport")}</h3>
 				<label className="stack horizontal xs items-center mb-0">
 					{t("q:match.report.whoToReport.me")}
 					<input

app/features/sendouq/routes/q.info.tsx

@@ -170,13 +170,13 @@ function BeforeJoining() {
 	return (
 		<section>
 			<h2 id="before-joining">Before joining</h2>
-			<h2>Make a sendou.ink account</h2>
+			<h3>Make a sendou.ink account</h3>
 			<p>
 				Click “log in” on the front page (mobile) or top right (desktop). Agree
 				to connecting your Discord account, you will be redirected and the
 				account is made.
 			</p>
-			<h2>Select your map pool</h2>
+			<h3>Select your map pool</h3>
 			<p>
 				Optional - if you don&apos;t have a preference then skip this step and
 				other players in the lobby get to choose. On the{" "}
@@ -200,19 +200,19 @@ function BeforeJoining() {
 				Finally hit save to save your preference (also do this for each step
 				below).
 			</p>
-			<h2>Weapon pool</h2>
+			<h3>Weapon pool</h3>
 			<p>
 				Choose up to 4 weapons that you will be playing. Don&apos;t skip this
 				step as it&apos;s important for team building reasons.
 			</p>
-			<h2>Voice chat</h2>
+			<h3>Voice chat</h3>
 			<p>
 				Select whether you can voice chat, listen only or neither. Also select
 				the languages you speak. Again this is an important step so don&apos;t
 				skip this one. Note if you select that you can voice chat it&apos;s
 				expected that you will join the voice chat when asked.
 			</p>
-			<h2>Avoiding Splattercolor Screen</h2>
+			<h3>Avoiding Splattercolor Screen</h3>
 			<p>
 				You can select to avoid Splattercolor Screen. This option exists for
 				accessibility reasons. Toggling this option means screen will be banned
@@ -220,13 +220,13 @@ function BeforeJoining() {
 				will see that screen would be banned in your set so it&apos;s not
 				advised to select this option unnecessarily.
 			</p>
-			<h2>Bio</h2>
+			<h3>Bio</h3>
 			<p>
 				On your user profile page put a short description to your bio about your
 				previous competitive experience etc. information you think would be
 				useful for team building purposes.
 			</p>
-			<h2>Friend code</h2>
+			<h3>Friend code</h3>
 			<p>
 				On the SendouQ front page enter your friend code. It&apos;s your
 				responsibility to make sure it matches the account you will be playing
@@ -234,7 +234,7 @@ function BeforeJoining() {
 				the rules. If you need to change friend code after setting it use the
 				helpdesk on our Discord server.
 			</p>
-			<h2>Reading rules</h2>
+			<h3>Reading rules</h3>
 			<p>
 				Read the <Link to={SENDOUQ_RULES_PAGE}>rules</Link>. You agree to follow
 				them when you play SendouQ.
@@ -247,8 +247,8 @@ function JoiningTheQueue() {
 	return (
 		<section>
 			<h2 id="joining-the-queue">Joining the queue</h2>
-			<h2>Joining solo</h2> <p>Click “Join solo” on the SendouQ front page.</p>
-			<h2>Joining with 1-3 mates</h2>
+			<h3>Joining solo</h3> <p>Click “Join solo” on the SendouQ front page.</p>
+			<h3>Joining with 1-3 mates</h3>
 			<p>
 				Click “Join with mates” on the SendouQ front page. On the following page
 				share the invite link with your mates. You can also “Quick add” mates if
@@ -283,7 +283,7 @@ function FindingAGroup() {
 				</p>
 				<p>Repeat this grouping up process till you have a full group of 4.</p>
 			</p>
-			<h2>Plus Server icons</h2>
+			<h3>Plus Server icons</h3>
 			<p>
 				<Image alt="" path={navIconUrl("plus")} size={24} />
 				<p>
@@ -291,20 +291,20 @@ function FindingAGroup() {
 					<Link to={FAQ_PAGE}>FAQ</Link> for more info.
 				</p>
 			</p>
-			<h2>Adding a note</h2>
+			<h3>Adding a note</h3>
 			<p>
 				You can add a public note if you want to communicate something to other
 				groups that might influence grouping up somehow. E.g. message that you
 				will be streaming the set with VC so people who don&apos;t want to
 				appear on stream can avoid your group.
 			</p>
-			<h2>Inactivity</h2>
+			<h3>Inactivity</h3>
 			<p>
 				If you don&apos;t do any actions for 30 minutes your group will be
 				marked inactive and hidden. Click the prompt that you are still looking
 				to be visible again.
 			</p>
-			<h2>Group managers</h2>
+			<h3>Group managers</h3>
 			<p>
 				Only the group owner or manager can send invites. When groups merge then
 				the previous owner and manager will have it in the new group as well.
@@ -326,7 +326,7 @@ function FindingAnOpponent() {
 				level (and they are free to not accept). You will also see the modes the
 				set would have before deciding on challenging/accepting.
 			</p>
-			<h2>Rechallenging</h2>
+			<h3>Rechallenging</h3>
 			<p>
 				Sometimes it can take a while for a group to accept your challenge. If
 				you don&apos;t have a strong preference about modes you might consider
@@ -355,19 +355,19 @@ function PlayingTheMatch() {
 				Then just play matches till either team has reached 4 wins and report
 				the score. Your SP will be adjusted after both teams report the score.
 			</p>
-			<h2>Canceling the match</h2>
+			<h3>Canceling the match</h3>
 			<p>
 				Match can be canceled if both teams agree to (read the rules). Click the
 				cancel button to request canceling the match. If the other team agrees
 				then they can also click it to confirm and lock the match.
 			</p>
-			<h2>Enemy not reporting</h2>
+			<h3>Enemy not reporting</h3>
 			<p>
 				As the first measure contact the opponent and politely remind them to.
 				If that is not working then come to the helpdesk channel on our Discord
 				to get help from admin.
 			</p>
-			<h2>Private note</h2>
+			<h3>Private note</h3>
 			<p>
 				After the set you can leave private notes about your teammates. If you
 				had good experience with someone why not leave a positive reminder so
@@ -377,14 +377,14 @@ function PlayingTheMatch() {
 				phase. Clicking their avatar in the group up phase will show what you
 				wrote about them.
 			</p>
-			<h2>Joining again with the same group</h2>
+			<h3>Joining again with the same group</h3>
 			<p>
 				As a group owner you can use the &quot;Look again with same group&quot;
 				to instantly join the queue with the same roster. Note that this button
 				should only be used if you checked with all your mates that they can
 				still play another set.
 			</p>
-			<h2>Stats</h2>
+			<h3>Stats</h3>
 			<p>
 				While reporting the score you can also report weapons. You can view
 				statistics on your user profile. You can for example see your win rate
@@ -400,7 +400,7 @@ function OtherTopics() {
 	return (
 		<section>
 			<h2 id="other-topics">Other topics</h2>
-			<h2>Ranking algorithm</h2>
+			<h3>Ranking algorithm</h3>
 			<p>
 				The ranking algorithm used is called OpenSkill. Most common question
 				people have is how is it possible that their higher ranked mate loses
@@ -413,7 +413,7 @@ function OtherTopics() {
 				Only the whole set&apos;s result matters so points gained/lost are the
 				same whether the set ends 4-3 or 4-0.
 			</p>
-			<h2>Ranking tiers</h2>
+			<h3>Ranking tiers</h3>
 			<p>
 				<Link to={TIERS_PAGE}>
 					View full list of tiers and current SP criteria
@@ -437,14 +437,14 @@ function OtherTopics() {
 				that threshold tiers switch being calculated based on players on the
 				leaderboard only.
 			</p>
-			<h2>Rank history</h2>
+			<h3>Rank history</h3>
 			<p>
 				You can see your ranking history graph on your user profile&apos;s
 				“Seasons” page. Note that to to view your rank history, two conditions
 				must be met: 1. You have completed a minimum of 7 sets. 2. These sets
 				were played across 3 separate days, according to server time.
 			</p>
-			<h2>Team ranking</h2>
+			<h3>Team ranking</h3>
 			<p>
 				Team ranking is just ranking of unique rosters of 4. This means that If
 				your team has 5 members (A, B, C, D, E) then you would potentially have
@@ -458,7 +458,7 @@ function OtherTopics() {
 				ranking per player so you might not show up at all if the mates of your
 				rankings have higher rankings with other players.
 			</p>
-			<h2>Ranked tournaments</h2>
+			<h3>Ranked tournaments</h3>
 			<p>
 				In addition to SendouQ, tournaments can also affect your ranking. Check
 				the <Link to={CALENDAR_PAGE}>calendar</Link> to find tournaments hosted
@@ -472,13 +472,13 @@ function OtherTopics() {
 				have their ranking changed. If you sub in the middle of a set then
 				it&apos;s counted based on people who played the majority of the set.
 			</p>
-			<h2>SendouQ Season Finale</h2>
+			<h3>SendouQ Season Finale</h3>
 			<p>
 				Top 12 teams are invited to a SendouQ Season Finale event that typically
 				happens 1 week after season ending. It has a price pot of $500 and is
 				Splat Zones only.
 			</p>
-			<h2>Off-season</h2>
+			<h3>Off-season</h3>
 			<p>
 				For off-season (usually around 2 weeks between seasons) SendouQ is not
 				available.

app/features/tournament-bracket/components/BracketMapListDialog.tsx

@@ -895,7 +895,7 @@ function RoundMapList({
 
 	return (
 		<div>
-			<h2>{name}</h2>
+			<h3>{name}</h3>
 			<div className={styles.roundControls}>
 				<button
 					type="button"

app/features/tournament-bracket/components/OrganizerMatchMapListDialog.tsx

@@ -81,7 +81,7 @@ export function OrganizerMatchMapListDialog({
 				</div>
 				{bannedMaps && bannedMaps?.length > 0 ? (
 					<div className="mt-2">
-						<h2 className="text-sm">Banned maps</h2>
+						<h3 className="text-sm">Banned maps</h3>
 						<div className="text-xs">
 							{bannedMaps.map((map, i) => {
 								const bannedByTeam = tournament.teamById(

app/features/tournament/routes/to.$id.register.tsx

@@ -446,9 +446,9 @@ function RegistrationProgress({
 
 	return (
 		<div>
-			<h2 className={clsx(styles.sectionHeader, "text-center")}>
+			<h3 className={clsx(styles.sectionHeader, "text-center")}>
 				{t("tournament:pre.steps.header")}
-			</h2>
+			</h3>
 			<section className={clsx(styles.section, "stack md")}>
 				<div className="stack horizontal lg justify-center text-sm font-semi-bold">
 					{steps.map((step, i) => {
@@ -675,9 +675,9 @@ function TeamInfo({
 	return (
 		<div>
 			<div className="stack horizontal justify-between">
-				<h2 className={styles.sectionHeader}>
+				<h3 className={styles.sectionHeader}>
 					2. {t("tournament:pre.info.header")}
-				</h2>
+				</h3>
 				{canUnregister &&
 				tournament.isLeagueSignup &&
 				!tournament.registrationOpen ? (
@@ -875,7 +875,7 @@ function FriendCode() {
 
 	return (
 		<div>
-			<h2 className={styles.sectionHeader}>1. Friend code</h2>
+			<h3 className={styles.sectionHeader}>1. Friend code</h3>
 			<section className={styles.section}>
 				<div className={clsx(styles.sectionInputContainer, "mx-auto")}>
 					<FriendCodeInput friendCode={user?.friendCode} />
@@ -901,9 +901,9 @@ function FriendCode() {
 function GoogleFormsLink() {
 	return (
 		<div>
-			<h2 className={styles.sectionHeader}>
+			<h3 className={styles.sectionHeader}>
 				Additional Requirement: Google Form
-			</h2>
+			</h3>
 			<section className={clsx(styles.section, "stack lg items-center")}>
 				<a
 					href={import.meta.env.VITE_LEAGUE_GOOGLE_FORM_URL}
@@ -975,9 +975,9 @@ function FillRoster({
 
 	return (
 		<div>
-			<h2 className={styles.sectionHeader}>
+			<h3 className={styles.sectionHeader}>
 				3. {t("tournament:pre.roster.header")}
-			</h2>
+			</h3>
 			<section className={clsx(styles.section, "stack lg items-center")}>
 				{playersAvailableToDirectlyAdd.length > 0 && canAddMembers ? (
 					<>
@@ -1199,9 +1199,9 @@ function CounterPickMapPoolPicker() {
 
 	return (
 		<div>
-			<h2 className={styles.sectionHeader}>
+			<h3 className={styles.sectionHeader}>
 				4. {t("tournament:pre.pool.header")}
-			</h2>
+			</h3>
 			<section className={styles.section}>
 				<fetcher.Form method="post" className="stack lg">
 					<input