Replace Sass variables with custom properties on _font-weights.pcss (#10554)

* Replace `$font-normal` and `$font-semi-bold`

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Replace `font-weight: 600` with the custom property

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Replace the existing variables

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

---------

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

res/css/views/settings/tabs/_SettingsTab.pcss

@@ -33,7 +33,7 @@ limitations under the License.
 
 .mx_SettingsTab_heading {
     font-size: $font-20px;
-    font-weight: 600;
+    font-weight: var(--font-semi-bold);
     color: $primary-content;
     margin-top: 10px; /* TODO: Use a spacing variable */
     margin-bottom: 10px; /* TODO: Use a spacing variable */
@@ -47,7 +47,7 @@ limitations under the License.
 .mx_SettingsTab_subheading {
     font-size: $font-16px;
     display: block;
-    font-weight: 600;
+    font-weight: var(--font-semi-bold);
     color: $primary-content;
     margin-top: $spacing-12;
     margin-bottom: 10px; /* TODO: Use a spacing variable */

res/css/views/settings/tabs/room/_NotificationSettingsTab.pcss

@@ -22,7 +22,7 @@ limitations under the License.
         color: $primary-content;
         font-size: $font-15px;
         line-height: $font-18px;
-        font-weight: $font-semi-bold;
+        font-weight: var(--font-semi-bold);
         margin-top: 16px;
         position: relative;
         padding-left: 8px;