Unverified Commit dfd665fb authored by lauriii's avatar lauriii
Browse files

Issue #3225188 by mherchel, dipakmdhrm, Gauravmahlawat, jwitkowski79: Olivero:...

Issue #3225188 by mherchel, dipakmdhrm, Gauravmahlawat, jwitkowski79: Olivero: Ensure proper visual hierarchy between headings

(cherry picked from commit 45d92a93)
parent 9c38b992
......@@ -72,54 +72,87 @@ audio {
}
h1 {
margin-top: 1.125rem;
margin-bottom: 1.125rem;
letter-spacing: -0.01em;
color: #0d1214;
font-size: 1.5rem;
font-weight: bold;
line-height: 1.6875rem
font-size: 1.75rem;
line-height: 2.25rem
}
@media (min-width: 43.75rem) {
h1 {
margin-top: 2.25rem;
margin-bottom: 2.25rem;
font-size: 3.75rem;
line-height: 4.5rem
}
}
h2 {
margin-top: 1.125rem;
margin-bottom: 1.125rem;
letter-spacing: -0.01em;
color: #0d1214;
font-size: 1.5rem;
font-weight: bold;
line-height: 1.6875rem
line-height: 2.25rem
}
@media (min-width: 43.75rem) {
h2 {
margin-top: 2.25rem;
margin-bottom: 2.25rem;
font-size: 2.25rem;
line-height: 3.375rem
}
}
h3 {
font-size: 1.25rem;
line-height: 1.6875rem
}
@media (min-width: 43.75rem) {
h3 {
font-size: 1.5rem;
line-height: 2.25rem
}
}
h4 {
font-size: 1.125rem;
line-height: 1.6875rem;
}
h5 {
font-size: 1rem;
line-height: 1.6875rem;
}
h6 {
font-size: 0.875rem;
line-height: 1.125rem;
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin-top: 1.125rem;
margin-bottom: 1.125rem;
color: #0d1214;
font-family: "metropolis", sans-serif;
font-weight: bold
}
@media (min-width: 43.75rem) {
h1,
h2,
h3,
h4,
h5,
h6 {
margin-top: 2.25rem;
margin-bottom: 2.25rem
}
}
[dir="ltr"] ul {
margin-left: 1.5em;
}
......
......@@ -67,42 +67,66 @@ audio {
}
h1 {
margin-block: var(--sp);
letter-spacing: -0.01em;
color: var(--color--gray-0);
font-size: 24px;
font-weight: bold;
line-height: var(--sp1-5);
font-size: 28px;
line-height: var(--sp2);
@media (--md) {
margin-block: var(--sp2);
font-size: 60px;
line-height: var(--sp4);
}
}
h2 {
margin-block: var(--sp);
letter-spacing: -0.01em;
color: var(--color--gray-0);
font-size: 24px;
font-weight: bold;
line-height: var(--sp1-5);
line-height: var(--sp2);
@media (--md) {
margin-block: var(--sp2);
font-size: 36px;
line-height: var(--sp3);
}
}
h3 {
font-size: 20px;
line-height: var(--sp1-5);
@media (--md) {
font-size: 24px;
line-height: var(--sp2);
}
}
h4 {
font-size: 18px;
line-height: var(--sp1-5);
}
h5 {
font-size: 16px;
line-height: var(--sp1-5);
}
h6 {
font-size: 14px;
line-height: var(--sp);
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin-block: var(--sp);
color: var(--color--gray-0);
font-family: var(--font-sans);
font-weight: bold;
@media (--md) {
margin-block: var(--sp2);
}
}
ul {
......
......@@ -15,29 +15,6 @@
color: #313637;
font-family: "Lora", "georgia", serif;
line-height: 1.6875rem
}
.text-content h2, .cke_editable h2 {
margin-top: 2.25rem;
margin-bottom: 1.6875rem;
letter-spacing: 0.12em;
color: #000;
font-size: 1rem;
line-height: 1.6875rem
}
@media (min-width: 43.75rem) {
.text-content h2, .cke_editable h2 {
margin-top: 3.375rem;
margin-bottom: 2.25rem;
letter-spacing: 0.09em;
font-size: 1.3125rem
}
}
.text-content,
.cke_editable {
/*
@todo
......
......@@ -11,22 +11,6 @@
font-family: var(--font-serif);
line-height: var(--sp1-5);
& h2 {
margin-block-start: var(--sp2);
margin-block-end: var(--sp1-5);
letter-spacing: 0.12em;
color: var(--color--black);
font-size: 16px;
line-height: var(--sp1-5);
@media (--md) {
margin-block-start: var(--sp3);
margin-block-end: var(--sp2);
letter-spacing: 0.09em;
font-size: 21px;
}
}
/*
@todo
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment