[Glitch] Revamp heading levels in settings & admin pages

Port 68984de5b5 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
diondiondion
2026-03-17 11:32:24 +01:00
committed by Claire
parent bd9e7d6060
commit 5b9cb55701
5 changed files with 17 additions and 15 deletions

View File

@@ -85,7 +85,7 @@ export default class Dimension extends PureComponent {
return ( return (
<div className='dimension'> <div className='dimension'>
<h4>{label}</h4> <h2>{label}</h2>
{content} {content}
</div> </div>

View File

@@ -49,7 +49,7 @@ export default class ImpactReport extends PureComponent {
return ( return (
<div className='dimension'> <div className='dimension'>
<h4><FormattedMessage id='admin.impact_report.title' defaultMessage='Impact summary' /></h4> <FormattedMessage id='admin.impact_report.title' defaultMessage='Impact summary' tagName="h2" />
<table> <table>
<tbody> <tbody>

View File

@@ -145,7 +145,7 @@ export default class Retention extends PureComponent {
return ( return (
<div className='retention'> <div className='retention'>
<h4>{title}</h4> <h2>{title}</h2>
{content} {content}
</div> </div>

View File

@@ -66,7 +66,7 @@ export default class Trends extends PureComponent {
return ( return (
<div className='trends trends--compact'> <div className='trends trends--compact'>
<h4><FormattedMessage id='trends.trending_now' defaultMessage='Trending now' /></h4> <FormattedMessage id='trends.trending_now' defaultMessage='Trending now' tagName='h2' />
{content} {content}
</div> </div>

View File

@@ -267,7 +267,7 @@ $content-width: 840px;
} }
} }
h2 small { h1 small {
font-size: 12px; font-size: 12px;
display: block; display: block;
font-weight: 500; font-weight: 500;
@@ -281,22 +281,16 @@ $content-width: 840px;
} }
} }
h2 { :where(h1),
.heading-large {
color: var(--color-text-primary); color: var(--color-text-primary);
font-size: 24px; font-size: 24px;
line-height: 36px; line-height: 36px;
font-weight: 700; font-weight: 700;
} }
h3 { :where(h2):not(.heading-medium),
color: var(--color-text-primary); .heading-small {
font-size: 20px;
line-height: 28px;
font-weight: 400;
margin-bottom: 30px;
}
h4 {
text-transform: uppercase; text-transform: uppercase;
font-size: 13px; font-size: 13px;
font-weight: 700; font-weight: 700;
@@ -306,6 +300,14 @@ $content-width: 840px;
border-top: 1px solid var(--color-border-primary); border-top: 1px solid var(--color-border-primary);
} }
.heading-medium {
color: var(--color-text-primary);
font-size: 20px;
line-height: 28px;
font-weight: 400;
margin-bottom: 30px;
}
h6 { h6 {
font-size: 16px; font-size: 16px;
color: var(--color-text-primary); color: var(--color-text-primary);