Use source sans 3 font

client/package.json

@@ -96,7 +96,6 @@
     "lodash-es": "^4.17.4",
     "markdown-it": "12.0.2",
     "mini-css-extract-plugin": "^1.3.1",
-    "npm-font-source-sans-pro": "^1.0.2",
     "p2p-media-loader-hlsjs": "^0.6.2",
     "path-browserify": "^1.0.0",
     "primeng": "^11.0.0-rc.1",

client/src/app/+videos/+video-watch/video-watch.component.scss

@@ -197,7 +197,7 @@ $video-info-margin-left: 44px;
             line-height: 1.37;
 
             a:nth-of-type(2) {
-              font-weight: 500;
+              font-weight: $font-regular;
               font-size: 90%;
             }
 

client/src/app/menu/menu.component.scss

@@ -15,6 +15,7 @@ $menu-link-icon-margin-right: 18px;
   word-break: break-word;
   padding-right: 20px;
   transition: background-color .1s ease-in-out;
+  line-height: $line-height-normal;
 
   &.active {
     background-color: rgba(255, 255, 255, 0.15);
@@ -208,6 +209,7 @@ menu {
     flex-direction: column;
     align-items: flex-start;
     border-top: 1px solid var(--greyForegroundColor);
+    line-height: $line-height-normal;
 
     a {
       @include menu-link;

client/src/app/shared/shared-thumbnail/video-thumbnail.component.scss

@@ -27,7 +27,7 @@
     border-radius: 3px;
     font-size: 12px;
     font-weight: $font-semibold;
-    line-height: 1.2;
+    line-height: 1.1;
     z-index: z(miniature);
   }
 

client/src/sass/bootstrap.scss

@@ -88,6 +88,9 @@ $icon-font-path: '~@neos21/bootstrap3-glyphicons/assets/fonts/';
   }
 }
 
+.badge {
+  line-height: 1.1;
+}
 
 @media screen and (min-width: #{breakpoint(md)}) {
   .modal:before {
@@ -377,7 +380,7 @@ ngb-tooltip-window {
   &:not(.callout-light) {
     border-left-width: .25rem;
   }
-  
+
   &.callout-info {
     border-color: pvar(--mainColorLightest);
     border-left-color: pvar(--mainColor);

client/src/sass/include/_fonts.scss

@@ -1,23 +1,15 @@
-$FontPathSourceSansPro: '~npm-font-source-sans-pro/fonts';
-$basePath: '#{$FontPathSourceSansPro}/WOFF2/TTF/SourceSansPro';
-
-@mixin fontface($name, $path, $weight: null, $style: null, $exts: woff2) {
-  $src: null;
-  @each $ext in $exts {
-    $src: append($src, url(quote($path + "." + $ext)) format(quote($ext)), comma);
-  }
-  @font-face {
-    font-family: quote($name);
-    font-weight: $weight;
-    font-style: $style;
-    font-stretch: normal;
-    font-display: swap;
-    src: $src;
-  }
+@font-face{
+  font-family: 'Source Sans Pro';
+  font-weight: 200 900;
+  font-style: normal;
+  font-stretch: normal;
+  src: url('../fonts/source-sans/WOFF2/VAR/SourceSans3VF-Roman.ttf.woff2') format('woff2');
 }
 
-@include fontface('Source Sans Pro', '#{$basePath}-Regular.ttf', 400, normal);
-@include fontface('Source Sans Pro', '#{$basePath}-It.ttf', 400, italic);
-@include fontface('Source Sans Pro', '#{$basePath}-Semibold.ttf', 600, normal);
-@include fontface('Source Sans Pro', '#{$basePath}-SemiboldIt.ttf', 600, italic);
-@include fontface('Source Sans Pro', '#{$basePath}-Bold.ttf', 700, normal);
+@font-face{
+  font-family: 'Source Sans Pro';
+  font-weight: 200 900;
+  font-style: italic;
+  font-stretch: normal;
+  src: url('../fonts/source-sans/WOFF2/VAR/SourceSans3VF-Italic.ttf.woff2') format('woff2');
+}

client/src/sass/include/_mixins.scss

@@ -180,6 +180,7 @@
 
 @mixin grey-button {
   @include button-focus($grey-button-outline-color);
+
   background-color: $grey-background-color;
   color: pvar(--greyForegroundColor);
 
@@ -247,6 +248,10 @@
 }
 
 @mixin button-with-icon($width: 20px, $margin-right: 3px, $top: -1px) {
+  display: inline-flex;
+  align-items: center;
+  line-height: normal !important;
+
   my-global-icon {
     position: relative;
     width: $width;
@@ -807,7 +812,6 @@
   .dashboard-num, .dashboard-text {
     text-align: center;
     font-size: 130%;
-    line-height: 21px;
     color: pvar(--mainForegroundColor);
     line-height: 30px;
     margin-bottom: 20px;

client/src/sass/include/_variables.scss

@@ -7,6 +7,7 @@ $main-fonts: 'Source Sans Pro', sans-serif;
 $font-regular: 400;
 $font-semibold: 600;
 $font-bold: 700;
+$line-height-normal: 1.2;
 
 $grey-background-color: #E5E5E5;
 $grey-background-hover-color: #EFEFEF;

client/yarn.lock

@@ -7721,11 +7721,6 @@ npm-bundled@^1.0.1:
   dependencies:
     npm-normalize-package-bin "^1.0.1"
 
-npm-font-source-sans-pro@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/npm-font-source-sans-pro/-/npm-font-source-sans-pro-1.0.2.tgz#c55c8ae368eebdbcaca65425a0d7e1f9a192a03e"
-  integrity sha1-xVyK42juvbysplQloNfh+aGSoD4=
-
 npm-install-checks@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/npm-install-checks/-/npm-install-checks-4.0.0.tgz#a37facc763a2fde0497ef2c6d0ac7c3fbe00d7b4"

server/tests/api/notifications/moderation-notifications.ts

@@ -604,7 +604,7 @@ describe('Test moderation notifications', function () {
     })
 
     it('Should not send a notification to moderators on new video without auto-blacklist', async function () {
-      this.timeout(40000)
+      this.timeout(60000)
 
       const name = 'video without auto-blacklist ' + uuidv4()