[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 (
<div className='dimension'>
<h4>{label}</h4>
<h2>{label}</h2>
{content}
</div>

View File

@@ -49,7 +49,7 @@ export default class ImpactReport extends PureComponent {
return (
<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>
<tbody>

View File

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

View File

@@ -66,7 +66,7 @@ export default class Trends extends PureComponent {
return (
<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}
</div>

View File

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