diff --git a/fonts/PublicSans-Bold.woff b/fonts/PublicSans-Bold.woff new file mode 100644 index 000000000..a6ec97c04 Binary files /dev/null and b/fonts/PublicSans-Bold.woff differ diff --git a/fonts/PublicSans-BoldItalic.woff b/fonts/PublicSans-BoldItalic.woff new file mode 100644 index 000000000..1cfc35bd8 Binary files /dev/null and b/fonts/PublicSans-BoldItalic.woff differ diff --git a/fonts/PublicSans-Italic.woff b/fonts/PublicSans-Italic.woff new file mode 100644 index 000000000..5193fdceb Binary files /dev/null and b/fonts/PublicSans-Italic.woff differ diff --git a/fonts/PublicSans-Light.woff b/fonts/PublicSans-Light.woff new file mode 100644 index 000000000..079c8d9a3 Binary files /dev/null and b/fonts/PublicSans-Light.woff differ diff --git a/fonts/PublicSans-LightItalic.woff b/fonts/PublicSans-LightItalic.woff new file mode 100644 index 000000000..6cca8467b Binary files /dev/null and b/fonts/PublicSans-LightItalic.woff differ diff --git a/fonts/PublicSans-Regular.woff b/fonts/PublicSans-Regular.woff new file mode 100644 index 000000000..fbe27e2cc Binary files /dev/null and b/fonts/PublicSans-Regular.woff differ diff --git a/stylesheets/_modules.scss b/stylesheets/_modules.scss index 3af867ec2..d355119e3 100644 --- a/stylesheets/_modules.scss +++ b/stylesheets/_modules.scss @@ -1248,7 +1248,7 @@ } .module-group-notification__contact { - font-family: 'SF Pro Text'; + font-family: 'Public Sans'; font-weight: bold; } diff --git a/stylesheets/_session.scss b/stylesheets/_session.scss index a70be1e63..c8833aeb2 100644 --- a/stylesheets/_session.scss +++ b/stylesheets/_session.scss @@ -1,39 +1,64 @@ +// Fonts changed to 'Public Sans' and Space Mono' as per req. Chad. +$session-font-default: 'Public Sans'; +$session-font-mono: 'SpaceMono'; + @font-face { - font-family: 'SpaceMono'; + font-family: $session-font-mono; src: url('../fonts/SpaceMono-Regular.ttf') format('truetype'); } @font-face { - font-family: 'SpaceMono'; + font-family: $session-font-mono; src: url('../fonts/SpaceMono-Bold.ttf') format('truetype'); font-weight: bold; } @font-face { - font-family: 'SpaceMono'; + font-family: $session-font-mono; src: url('../fonts/SpaceMono-Italic.ttf') format('truetype'); font-style: italic; } @font-face { - font-family: 'SpaceMono'; + font-family: $session-font-mono; src: url('../fonts/SpaceMono-BoldItalic.ttf') format('truetype'); font-weight: bold; font-style: italic; } + +// Public Sans is an open replacement for 'SF Pro Text' +@font-face { + font-family: $session-font-default; + src: url('../fonts/PublicSans-Regular.woff') format('woff'); +} +@font-face { + font-family: $session-font-default; + src: url('../fonts/PublicSans-Italic.woff') format('woff'); + font-style: italic; +} @font-face { - font-family: 'Wasa'; - src: url('../fonts/Wasa-Bold.otf') format('opentype'); + font-family: $session-font-default; + src: url('../fonts/PublicSans-Bold.woff') format('woff'); font-weight: bold; } @font-face { - font-family: 'SF Pro Text'; - src: url('../fonts/SFProText-Regular.ttf') format('truetype'); + font-family: $session-font-default; + src: url('../fonts/PublicSans-BoldItalic.woff') format('woff'); + font-weight: bold; + font-style: italic; +} +@font-face { + font-family: $session-font-default; + src: url('../fonts/PublicSans-Light.woff') format('woff'); + font-weight: lighter; } @font-face { - font-family: 'SF Pro Display'; - src: url('../fonts/SFProDisplay-Regular.otf') format('opentype'); + font-family: $session-font-default; + src: url('../fonts/PublicSans-LightItalic.woff') format('woff'); + font-weight: lighter; + font-style: italic; } + @keyframes fadein { from { opacity: 0; @@ -44,8 +69,6 @@ } // Session Colors -$session-font-family: 'Wasa'; - $session-color-green: #00f782; $session-color-green-alt-1: #00f480; $session-color-green-alt-2: #00fd73; @@ -191,9 +214,9 @@ $session-modal-size-lg: 650px; $session-conversation-header-height: 60px; -@mixin fontWasaBold { +@mixin fontDefaultBold { font-weight: bold; - font-family: $session-font-family; + font-family: $session-font-default; } * { @@ -368,7 +391,7 @@ $session_message-container-border-radius: 5px; line-height: 40px; padding: 0px $session-margin-lg; font-size: $session-font-md; - font-family: $session-font-family; + font-family: $session-font-default; border-radius: 500px; &:not(.disabled):hover { @@ -471,7 +494,7 @@ $session_message-container-border-radius: 5px; display: flex; align-items: center; justify-content: center; - font-family: $session-font-family; + font-family: $session-font-default; border-radius: 50%; font-weight: 700; background: $session-color-danger; @@ -521,16 +544,18 @@ $session-element-border-green: 4px solid $session-color-green; .module-conversation-header__title-flex, .module-conversation-header__title { - font-family: Wasa; + font-family: $session-font-default; + font-weight: bold; width: 100%; display: flex; font-size: $session-font-md; &-text { @include session-color-subtle($session-color-white); - font-family: 'SF Pro Text'; + font-family: $session-font-default; font-weight: 300; font-size: $session-font-xs; + line-height: $session-font-xs; } .module-contact-name { @@ -740,7 +765,7 @@ label { padding: $session-margin-lg; - font-family: 'Wasa'; + font-family: $session-font-default; text-align: center; line-height: 18px; font-size: $session-font-md; @@ -778,7 +803,7 @@ label { &__body { padding: 0px $session-margin-lg $session-margin-lg $session-margin-lg; - font-family: 'Wasa'; + font-family: $session-font-default; line-height: $session-font-md; font-size: $session-font-sm; @@ -923,7 +948,7 @@ label { background-color: $session-shade-4; color: $session-color-white; - font-family: 'Wasa'; + font-family: $session-font-default; font-size: $session-font-sm; line-height: $session-icon-size-sm; font-weight: 700; @@ -1081,7 +1106,7 @@ label { word-break: break-all; font-size: $session-font-md; padding: 0px $session-margin-lg; - font-family: 'SF Pro Text'; + font-family: $session-font-default; font-weight: 100; color: rgba($session-color-white, 0.8); font-size: $session-font-md; @@ -1283,7 +1308,7 @@ label { } &__description { - font-family: 'SF Pro Text'; + font-family: $session-font-default; font-size: $session-font-sm; font-weight: 100; max-width: 700px; @@ -1358,7 +1383,7 @@ label { text-align: center; font-size: $session-font-xl; letter-spacing: 5px; - font-family: 'SF Pro Text'; + font-family: $session-font-default; } } } @@ -1393,7 +1418,7 @@ label { .discussion-container { .module-message { - font-family: 'SF Pro Text'; + font-family: $session-font-default; border-radius: 5px; &__text--incoming { @@ -1606,7 +1631,7 @@ input { /* Memberlist */ .member-list-container .member { &-item { - font-family: 'SF Pro Text'; + font-family: $session-font-default; padding: $session-margin-sm $session-margin-md; background-color: $session-shade-5; @@ -1671,7 +1696,7 @@ input { height: 400px; text-align: center; - font-family: 'SF Pro Text'; + font-family: $session-font-default; } &__title h1 { @@ -1687,7 +1712,7 @@ input { } &__info { - font-family: 'Wasa'; + font-family: $session-font-default; margin-bottom: 2 * $session-margin-lg; &--title { @@ -1697,7 +1722,7 @@ input { } &--subtitle { - font-family: 'SF Pro Text'; + font-family: $session-font-default; font-weight: 300; line-height: $session-font-md; opacity: 0.8; @@ -1737,7 +1762,7 @@ input { } &__no-contacts { - font-family: 'SpaceMono'; + font-family: $session-font-mono; text-align: center; padding: 20px; } @@ -1758,7 +1783,7 @@ input { .session-member-item { cursor: pointer; - font-family: 'SF Pro Text'; + font-family: $session-font-default; padding: 0px $session-margin-sm; height: 50px; display: flex; diff --git a/stylesheets/_session_left_pane.scss b/stylesheets/_session_left_pane.scss index 851a4f5d6..4e9c4a7c7 100644 --- a/stylesheets/_session_left_pane.scss +++ b/stylesheets/_session_left_pane.scss @@ -112,7 +112,7 @@ $session-compose-margin: 20px; &__user__profile { &-number, &-name { - @include fontWasaBold(); + @include fontDefaultBold(); font-size: 15px; @at-root .light-theme #{&} { @@ -193,7 +193,7 @@ $session-compose-margin: 20px; .session-button { margin-left: auto; - @include fontWasaBold(); + @include fontDefaultBold(); } &-buttons { @@ -302,7 +302,7 @@ $session-compose-margin: 20px; font-size: $session-font-sm; line-height: $session-font-h3; margin: 0px 20px; - font-family: 'SF Pro Display'; + font-family: $session-font-default; } .session-id-editable { @@ -375,7 +375,7 @@ $session-compose-margin: 20px; border: none; flex-grow: 1; font-size: $session-font-sm; - font-family: 'SF Pro Text'; + font-family: $session-font-default; &:focus { outline: none !important; @@ -637,7 +637,7 @@ $session-compose-margin: 20px; border-radius: 50px; color: $session-color-light-grey; border: 1px solid $session-color-dark-grey; - font-family: 'SF Pro Text'; + font-family: $session-font-default; font-size: $session-font-sm; } } diff --git a/stylesheets/_session_signin.scss b/stylesheets/_session_signin.scss index e0dce956c..83a6ac984 100644 --- a/stylesheets/_session_signin.scss +++ b/stylesheets/_session_signin.scss @@ -17,7 +17,7 @@ &-text { color: $session-color-white; - font-family: $session-font-family; + font-family: $session-font-default; .title { font-size: 100px; @@ -87,7 +87,7 @@ } &__tab { - @include fontWasaBold(); + @include fontDefaultBold(); width: 100%; padding-bottom: 10px; background-color: transparent; @@ -244,7 +244,7 @@ overflow-wrap: break-word; padding: 0px 5px 20px 5px; display: inline-block; - font-family: 'SpaceMono'; + font-family: $session-font-mono; user-select: all; } } diff --git a/stylesheets/_session_theme.scss b/stylesheets/_session_theme.scss index 1dffb5817..a27cc917c 100644 --- a/stylesheets/_session_theme.scss +++ b/stylesheets/_session_theme.scss @@ -103,7 +103,7 @@ } @mixin session-h-title { - @include fontWasaBold(); + @include fontDefaultBold(); } h1 {