From 6536265ce2c5a2ae81023cc26aaa3cc11e85703b Mon Sep 17 00:00:00 2001 From: Germain Date: Fri, 7 Jul 2023 11:13:53 +0100 Subject: [PATCH 1/4] Restoring optional ligatures by resetting letter-spacing --- res/css/_common.pcss | 3 --- res/css/views/rooms/_EventTile.pcss | 1 - 2 files changed, 4 deletions(-) diff --git a/res/css/_common.pcss b/res/css/_common.pcss index 7a0528102d5..1b11324e815 100644 --- a/res/css/_common.pcss +++ b/res/css/_common.pcss @@ -91,7 +91,6 @@ html { body { font: var(--cpd-font-body-md-regular); - letter-spacing: var(--cpd-font-letter-spacing-body-md); background-color: $background; color: $primary-content; @@ -134,7 +133,6 @@ b { h2 { color: $primary-content; font: var(--cpd-font-heading-lg-regular); - letter-spacing: var(--cpd-font-letter-spacing-heading-lg); margin-top: 16px; margin-bottom: 16px; } @@ -351,7 +349,6 @@ legend { /* Styles copied/inspired by GroupLayout, ReplyTile, and EventTile variants. */ .markdown-body { font: var(--cpd-font-body-md-regular) !important; - letter-spacing: var(--cpd-font-letter-spacing-body-md); font-family: inherit !important; white-space: normal !important; line-height: inherit !important; diff --git a/res/css/views/rooms/_EventTile.pcss b/res/css/views/rooms/_EventTile.pcss index 3d3053219ee..f14d7cd04f7 100644 --- a/res/css/views/rooms/_EventTile.pcss +++ b/res/css/views/rooms/_EventTile.pcss @@ -697,7 +697,6 @@ $left-gutter: 64px; .markdown-body { font: var(--cpd-font-body-md-regular) !important; - letter-spacing: var(--cpd-font-letter-spacing-body-md); font-family: inherit !important; white-space: normal !important; line-height: inherit !important; From 188eb849a16c1a5a7d82741c69945c0e83c3cd93 Mon Sep 17 00:00:00 2001 From: Germain Date: Mon, 10 Jul 2023 14:40:45 +0100 Subject: [PATCH 2/4] Revert "Restoring optional ligatures by resetting letter-spacing" This reverts commit 6536265ce2c5a2ae81023cc26aaa3cc11e85703b. --- res/css/_common.pcss | 3 +++ res/css/views/rooms/_EventTile.pcss | 1 + 2 files changed, 4 insertions(+) diff --git a/res/css/_common.pcss b/res/css/_common.pcss index 1b11324e815..7a0528102d5 100644 --- a/res/css/_common.pcss +++ b/res/css/_common.pcss @@ -91,6 +91,7 @@ html { body { font: var(--cpd-font-body-md-regular); + letter-spacing: var(--cpd-font-letter-spacing-body-md); background-color: $background; color: $primary-content; @@ -133,6 +134,7 @@ b { h2 { color: $primary-content; font: var(--cpd-font-heading-lg-regular); + letter-spacing: var(--cpd-font-letter-spacing-heading-lg); margin-top: 16px; margin-bottom: 16px; } @@ -349,6 +351,7 @@ legend { /* Styles copied/inspired by GroupLayout, ReplyTile, and EventTile variants. */ .markdown-body { font: var(--cpd-font-body-md-regular) !important; + letter-spacing: var(--cpd-font-letter-spacing-body-md); font-family: inherit !important; white-space: normal !important; line-height: inherit !important; diff --git a/res/css/views/rooms/_EventTile.pcss b/res/css/views/rooms/_EventTile.pcss index f14d7cd04f7..3d3053219ee 100644 --- a/res/css/views/rooms/_EventTile.pcss +++ b/res/css/views/rooms/_EventTile.pcss @@ -697,6 +697,7 @@ $left-gutter: 64px; .markdown-body { font: var(--cpd-font-body-md-regular) !important; + letter-spacing: var(--cpd-font-letter-spacing-body-md); font-family: inherit !important; white-space: normal !important; line-height: inherit !important; From 15ab2ad4a3259cfd6005adc30a9e165c7189bae6 Mon Sep 17 00:00:00 2001 From: Germain Date: Mon, 10 Jul 2023 14:41:38 +0100 Subject: [PATCH 3/4] Restore ligatures with inter dynamic metrics --- res/css/_common.pcss | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/res/css/_common.pcss b/res/css/_common.pcss index 7a0528102d5..8cf28b96e02 100644 --- a/res/css/_common.pcss +++ b/res/css/_common.pcss @@ -92,6 +92,14 @@ html { body { font: var(--cpd-font-body-md-regular); letter-spacing: var(--cpd-font-letter-spacing-body-md); + /** + * We want to apply Inter Dynamic metrics (https://rsms.me/inter/dynmetrics/) + * We need to tweak the `letter-spacing` property and doing so, disables by + * default the optional ligatures + * `font-feature-settings` allows us to override this behaviour and have the + * correct ligatures and the proper dynamic metric spacing. + */ + font-feature-settings: 'kern' 1, 'liga' 1, 'calt' 1; background-color: $background; color: $primary-content; From dd7b06a1592f1ddaa636f43cc6bbda7bd36e8019 Mon Sep 17 00:00:00 2001 From: Germain Date: Mon, 10 Jul 2023 14:49:21 +0100 Subject: [PATCH 4/4] lintfix --- res/css/_common.pcss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/res/css/_common.pcss b/res/css/_common.pcss index 8cf28b96e02..65d76939b4c 100644 --- a/res/css/_common.pcss +++ b/res/css/_common.pcss @@ -99,7 +99,7 @@ body { * `font-feature-settings` allows us to override this behaviour and have the * correct ligatures and the proper dynamic metric spacing. */ - font-feature-settings: 'kern' 1, 'liga' 1, 'calt' 1; + font-feature-settings: "kern" 1, "liga" 1, "calt" 1; background-color: $background; color: $primary-content;