diff --git a/CHANGELOG.md b/CHANGELOG.md index 0d187779e09a..5ebf8ae3f797 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -27,6 +27,7 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/) - [@osd/pm] Fix `file:`-linked dependencies' resolution to improve ability to test with local packages ([#4342](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4342)) - [Multiple DataSource] Backend support for adding sample data ([#4268](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4268)) - Add configurable defaults and overrides to uiSettings ([#4344](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4344)) +- Introduce new fonts for the Next theme ([#4381](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4381)) - Bump OUI to `1.1.2` to make `anomalyDetection` icon available ([#4408](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4408)) - [Multiple DataSource] Frontend support for adding sample data ([#4412](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4412)) diff --git a/packages/osd-ui-framework/src/global_styling/variables/_font.scss b/packages/osd-ui-framework/src/global_styling/variables/_font.scss index 51a2bab88c07..a93f1e6b9010 100644 --- a/packages/osd-ui-framework/src/global_styling/variables/_font.scss +++ b/packages/osd-ui-framework/src/global_styling/variables/_font.scss @@ -1,6 +1,6 @@ // Font -$kuiFontFamily: $euiFontFamily; +$kuiFontFamily: "var(--font-text)"; $kuiFontSize: $euiFontSize; $kuiLineHeight: $euiLineHeight; $kuiSubTextFontSize: $euiFontSizeS; diff --git a/src/core/public/styles/_ace_overrides.scss b/src/core/public/styles/_ace_overrides.scss index 3f0e3f57d868..ed2d69dec47b 100644 --- a/src/core/public/styles/_ace_overrides.scss +++ b/src/core/public/styles/_ace_overrides.scss @@ -12,6 +12,8 @@ background-color: $euiColorLightestShade; color: $euiTextColor; + /* stylelint-disable-next-line @osd/stylelint/no_restricted_properties */ + font-family: var(--font-code); .ace_scrollbar { @include euiScrollBar; diff --git a/src/core/server/core_app/assets/fonts/readme.md b/src/core/server/core_app/assets/fonts/readme.md index 55cdd675b1d2..dd77b8b2ce91 100644 --- a/src/core/server/core_app/assets/fonts/readme.md +++ b/src/core/server/core_app/assets/fonts/readme.md @@ -1,6 +1,9 @@ ## Font usage -OpenSearch Dashboards packages two fonts: +OpenSearch Dashboards packages four fonts: + +* [Source Sans 3](https://github.com/adobe-fonts/source-sans) v3.052 +* [Source Code Pro](https://github.com/adobe-fonts/source-code-pro) upright v2.042 and italic v1.062. * [Inter UI](https://rsms.me/inter/) fonts were pulled from their site and are at v3.2 * [Roboto Mono](https://fonts.google.com/specimen/Roboto+Mono) was pulled from the Google Fonts website on January 22, 2019. diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/LICENSE.md b/src/core/server/core_app/assets/fonts/source_code_pro/LICENSE.md new file mode 100644 index 000000000000..4cb7aaecdc0f --- /dev/null +++ b/src/core/server/core_app/assets/fonts/source_code_pro/LICENSE.md @@ -0,0 +1,93 @@ +© 2023 Adobe (http://www.adobe.com/), with Reserved Font Name 'Source'. All Rights Reserved. Source is a trademark of Adobe in the United States and/or other countries. + +This Font Software is licensed under the SIL Open Font License, Version 1.1. + +This license is copied below, and is also available with a FAQ at: http://scripts.sil.org/OFL + + +----------------------------------------------------------- +SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007 +----------------------------------------------------------- + +PREAMBLE +The goals of the Open Font License (OFL) are to stimulate worldwide +development of collaborative font projects, to support the font creation +efforts of academic and linguistic communities, and to provide a free and +open framework in which fonts may be shared and improved in partnership +with others. + +The OFL allows the licensed fonts to be used, studied, modified and +redistributed freely as long as they are not sold by themselves. The +fonts, including any derivative works, can be bundled, embedded, +redistributed and/or sold with any software provided that any reserved +names are not used by derivative works. The fonts and derivatives, +however, cannot be released under any other type of license. The +requirement for fonts to remain under this license does not apply +to any document created using the fonts or their derivatives. + +DEFINITIONS +"Font Software" refers to the set of files released by the Copyright +Holder(s) under this license and clearly marked as such. This may +include source files, build scripts and documentation. + +"Reserved Font Name" refers to any names specified as such after the +copyright statement(s). + +"Original Version" refers to the collection of Font Software components as +distributed by the Copyright Holder(s). + +"Modified Version" refers to any derivative made by adding to, deleting, +or substituting -- in part or in whole -- any of the components of the +Original Version, by changing formats or by porting the Font Software to a +new environment. + +"Author" refers to any designer, engineer, programmer, technical +writer or other person who contributed to the Font Software. + +PERMISSION & CONDITIONS +Permission is hereby granted, free of charge, to any person obtaining +a copy of the Font Software, to use, study, copy, merge, embed, modify, +redistribute, and sell modified and unmodified copies of the Font +Software, subject to the following conditions: + +1) Neither the Font Software nor any of its individual components, +in Original or Modified Versions, may be sold by itself. + +2) Original or Modified Versions of the Font Software may be bundled, +redistributed and/or sold with any software, provided that each copy +contains the above copyright notice and this license. These can be +included either as stand-alone text files, human-readable headers or +in the appropriate machine-readable metadata fields within text or +binary files as long as those fields can be easily viewed by the user. + +3) No Modified Version of the Font Software may use the Reserved Font +Name(s) unless explicit written permission is granted by the corresponding +Copyright Holder. This restriction only applies to the primary font name as +presented to the users. + +4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font +Software shall not be used to promote, endorse or advertise any +Modified Version, except to acknowledge the contribution(s) of the +Copyright Holder(s) and the Author(s) or with their explicit written +permission. + +5) The Font Software, modified or unmodified, in part or in whole, +must be distributed entirely under this license, and must not be +distributed under any other license. The requirement for fonts to +remain under this license does not apply to any document created +using the Font Software. + +TERMINATION +This license becomes null and void if any of the above conditions are +not met. + +DISCLAIMER +THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT +OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE +COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, +INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL +DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING +FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM +OTHER DEALINGS IN THE FONT SOFTWARE. diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Black.otf.woff b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Black.otf.woff new file mode 100644 index 000000000000..405e907329af Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Black.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Black.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Black.ttf.woff2 new file mode 100644 index 000000000000..94986c870b84 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Black.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-BlackIt.otf.woff b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-BlackIt.otf.woff new file mode 100644 index 000000000000..f483d0e5c538 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-BlackIt.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-BlackIt.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-BlackIt.ttf.woff2 new file mode 100644 index 000000000000..b7601922aa32 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-BlackIt.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Bold.otf.woff b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Bold.otf.woff new file mode 100644 index 000000000000..c3f5524760e0 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Bold.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Bold.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Bold.ttf.woff2 new file mode 100644 index 000000000000..5ce97745e3b4 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Bold.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-BoldIt.otf.woff b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-BoldIt.otf.woff new file mode 100644 index 000000000000..04ed805df11a Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-BoldIt.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-BoldIt.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-BoldIt.ttf.woff2 new file mode 100644 index 000000000000..89ec6123d1b5 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-BoldIt.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-ExtraLight.otf.woff b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-ExtraLight.otf.woff new file mode 100644 index 000000000000..1477902a4f28 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-ExtraLight.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-ExtraLight.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-ExtraLight.ttf.woff2 new file mode 100644 index 000000000000..45e25c9174fd Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-ExtraLight.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-ExtraLightIt.otf.woff b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-ExtraLightIt.otf.woff new file mode 100644 index 000000000000..a2789f8818bc Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-ExtraLightIt.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-ExtraLightIt.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-ExtraLightIt.ttf.woff2 new file mode 100644 index 000000000000..b6133c119bf5 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-ExtraLightIt.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-It.otf.woff b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-It.otf.woff new file mode 100644 index 000000000000..2add4be738e4 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-It.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-It.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-It.ttf.woff2 new file mode 100644 index 000000000000..86a225f4a07d Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-It.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Light.otf.woff b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Light.otf.woff new file mode 100644 index 000000000000..4539e374f177 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Light.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Light.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Light.ttf.woff2 new file mode 100644 index 000000000000..2a62569287d3 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Light.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-LightIt.otf.woff b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-LightIt.otf.woff new file mode 100644 index 000000000000..9224b22f3dfc Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-LightIt.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-LightIt.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-LightIt.ttf.woff2 new file mode 100644 index 000000000000..d64d5710e6e5 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-LightIt.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Medium.otf.woff b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Medium.otf.woff new file mode 100644 index 000000000000..03ae712d2a86 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Medium.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Medium.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Medium.ttf.woff2 new file mode 100644 index 000000000000..9a9c02eac147 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Medium.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-MediumIt.otf.woff b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-MediumIt.otf.woff new file mode 100644 index 000000000000..5c7320a76a27 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-MediumIt.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-MediumIt.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-MediumIt.ttf.woff2 new file mode 100644 index 000000000000..92b1befaf80a Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-MediumIt.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Regular.otf.woff b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Regular.otf.woff new file mode 100644 index 000000000000..31a4a7d83309 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Regular.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Regular.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Regular.ttf.woff2 new file mode 100644 index 000000000000..40826f1a6795 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Regular.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Semibold.otf.woff b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Semibold.otf.woff new file mode 100644 index 000000000000..c5db9a31d55b Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Semibold.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Semibold.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Semibold.ttf.woff2 new file mode 100644 index 000000000000..db50145e5c52 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-Semibold.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-SemiboldIt.otf.woff b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-SemiboldIt.otf.woff new file mode 100644 index 000000000000..5022a5337b1b Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-SemiboldIt.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-SemiboldIt.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-SemiboldIt.ttf.woff2 new file mode 100644 index 000000000000..89c84391a52c Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodePro-SemiboldIt.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodeVF-Italic.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodeVF-Italic.ttf.woff2 new file mode 100644 index 000000000000..7df879d0881a Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodeVF-Italic.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodeVF-Upright.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodeVF-Upright.ttf.woff2 new file mode 100644 index 000000000000..c4c9147aaf14 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_code_pro/SourceCodeVF-Upright.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/LICENSE.md b/src/core/server/core_app/assets/fonts/source_sans_3/LICENSE.md new file mode 100644 index 000000000000..4cb7aaecdc0f --- /dev/null +++ b/src/core/server/core_app/assets/fonts/source_sans_3/LICENSE.md @@ -0,0 +1,93 @@ +© 2023 Adobe (http://www.adobe.com/), with Reserved Font Name 'Source'. All Rights Reserved. Source is a trademark of Adobe in the United States and/or other countries. + +This Font Software is licensed under the SIL Open Font License, Version 1.1. + +This license is copied below, and is also available with a FAQ at: http://scripts.sil.org/OFL + + +----------------------------------------------------------- +SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007 +----------------------------------------------------------- + +PREAMBLE +The goals of the Open Font License (OFL) are to stimulate worldwide +development of collaborative font projects, to support the font creation +efforts of academic and linguistic communities, and to provide a free and +open framework in which fonts may be shared and improved in partnership +with others. + +The OFL allows the licensed fonts to be used, studied, modified and +redistributed freely as long as they are not sold by themselves. The +fonts, including any derivative works, can be bundled, embedded, +redistributed and/or sold with any software provided that any reserved +names are not used by derivative works. The fonts and derivatives, +however, cannot be released under any other type of license. The +requirement for fonts to remain under this license does not apply +to any document created using the fonts or their derivatives. + +DEFINITIONS +"Font Software" refers to the set of files released by the Copyright +Holder(s) under this license and clearly marked as such. This may +include source files, build scripts and documentation. + +"Reserved Font Name" refers to any names specified as such after the +copyright statement(s). + +"Original Version" refers to the collection of Font Software components as +distributed by the Copyright Holder(s). + +"Modified Version" refers to any derivative made by adding to, deleting, +or substituting -- in part or in whole -- any of the components of the +Original Version, by changing formats or by porting the Font Software to a +new environment. + +"Author" refers to any designer, engineer, programmer, technical +writer or other person who contributed to the Font Software. + +PERMISSION & CONDITIONS +Permission is hereby granted, free of charge, to any person obtaining +a copy of the Font Software, to use, study, copy, merge, embed, modify, +redistribute, and sell modified and unmodified copies of the Font +Software, subject to the following conditions: + +1) Neither the Font Software nor any of its individual components, +in Original or Modified Versions, may be sold by itself. + +2) Original or Modified Versions of the Font Software may be bundled, +redistributed and/or sold with any software, provided that each copy +contains the above copyright notice and this license. These can be +included either as stand-alone text files, human-readable headers or +in the appropriate machine-readable metadata fields within text or +binary files as long as those fields can be easily viewed by the user. + +3) No Modified Version of the Font Software may use the Reserved Font +Name(s) unless explicit written permission is granted by the corresponding +Copyright Holder. This restriction only applies to the primary font name as +presented to the users. + +4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font +Software shall not be used to promote, endorse or advertise any +Modified Version, except to acknowledge the contribution(s) of the +Copyright Holder(s) and the Author(s) or with their explicit written +permission. + +5) The Font Software, modified or unmodified, in part or in whole, +must be distributed entirely under this license, and must not be +distributed under any other license. The requirement for fonts to +remain under this license does not apply to any document created +using the Font Software. + +TERMINATION +This license becomes null and void if any of the above conditions are +not met. + +DISCLAIMER +THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT +OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE +COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, +INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL +DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING +FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM +OTHER DEALINGS IN THE FONT SOFTWARE. diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Black.otf.woff b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Black.otf.woff new file mode 100644 index 000000000000..93ee7d9953fd Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Black.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Black.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Black.ttf.woff2 new file mode 100644 index 000000000000..e02c23f82d5a Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Black.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-BlackIt.otf.woff b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-BlackIt.otf.woff new file mode 100644 index 000000000000..b174a639d798 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-BlackIt.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-BlackIt.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-BlackIt.ttf.woff2 new file mode 100644 index 000000000000..82eec7583653 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-BlackIt.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Bold.otf.woff b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Bold.otf.woff new file mode 100644 index 000000000000..6d59fe54bb3e Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Bold.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Bold.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Bold.ttf.woff2 new file mode 100644 index 000000000000..916ad418f91a Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Bold.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-BoldIt.otf.woff b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-BoldIt.otf.woff new file mode 100644 index 000000000000..c6e81dbe7733 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-BoldIt.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-BoldIt.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-BoldIt.ttf.woff2 new file mode 100644 index 000000000000..6c14c8babeb9 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-BoldIt.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-ExtraLight.otf.woff b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-ExtraLight.otf.woff new file mode 100644 index 000000000000..e1abd35452bd Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-ExtraLight.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-ExtraLight.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-ExtraLight.ttf.woff2 new file mode 100644 index 000000000000..2736d57d5ac2 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-ExtraLight.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-ExtraLightIt.otf.woff b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-ExtraLightIt.otf.woff new file mode 100644 index 000000000000..7ac0efa8876b Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-ExtraLightIt.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-ExtraLightIt.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-ExtraLightIt.ttf.woff2 new file mode 100644 index 000000000000..61206be234a2 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-ExtraLightIt.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-It.otf.woff b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-It.otf.woff new file mode 100644 index 000000000000..e855241addf4 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-It.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-It.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-It.ttf.woff2 new file mode 100644 index 000000000000..6d9eab98a652 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-It.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Light.otf.woff b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Light.otf.woff new file mode 100644 index 000000000000..5bc57652489e Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Light.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Light.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Light.ttf.woff2 new file mode 100644 index 000000000000..0fe3b02cf319 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Light.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-LightIt.otf.woff b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-LightIt.otf.woff new file mode 100644 index 000000000000..3a2c66372885 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-LightIt.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-LightIt.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-LightIt.ttf.woff2 new file mode 100644 index 000000000000..8b5ed0d454c8 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-LightIt.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Medium.otf.woff b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Medium.otf.woff new file mode 100644 index 000000000000..762a10731a57 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Medium.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Medium.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Medium.ttf.woff2 new file mode 100644 index 000000000000..ff95f90d5be2 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Medium.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-MediumIt.otf.woff b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-MediumIt.otf.woff new file mode 100644 index 000000000000..621c0f548aa4 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-MediumIt.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-MediumIt.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-MediumIt.ttf.woff2 new file mode 100644 index 000000000000..3492f7600e90 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-MediumIt.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Regular.otf.woff b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Regular.otf.woff new file mode 100644 index 000000000000..30895f79f7ea Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Regular.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Regular.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Regular.ttf.woff2 new file mode 100644 index 000000000000..e2401aa9f8a0 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Regular.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Semibold.otf.woff b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Semibold.otf.woff new file mode 100644 index 000000000000..e5483931521c Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Semibold.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Semibold.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Semibold.ttf.woff2 new file mode 100644 index 000000000000..a9aced0785d9 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-Semibold.ttf.woff2 differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-SemiboldIt.otf.woff b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-SemiboldIt.otf.woff new file mode 100644 index 000000000000..ee41e959e944 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-SemiboldIt.otf.woff differ diff --git a/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-SemiboldIt.ttf.woff2 b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-SemiboldIt.ttf.woff2 new file mode 100644 index 000000000000..1556ee303c83 Binary files /dev/null and b/src/core/server/core_app/assets/fonts/source_sans_3/SourceSans3-SemiboldIt.ttf.woff2 differ diff --git a/src/core/server/rendering/rendering_service.tsx b/src/core/server/rendering/rendering_service.tsx index c62ee08db6bc..c7c03c1eb72c 100644 --- a/src/core/server/rendering/rendering_service.tsx +++ b/src/core/server/rendering/rendering_service.tsx @@ -101,6 +101,12 @@ export class RenderingService { uiSettings.getOverrideOrDefault('theme:darkMode')) || false; + // At the very least, the schema should define a default theme; the '' will be unreachable + const themeVersion = + (settings.user?.['theme:version']?.userValue ?? + uiSettings.getOverrideOrDefault('theme:version')) || + ''; + const brandingAssignment = await this.assignBrandingConfig( darkMode, opensearchDashboardsConfig as OpenSearchDashboardsConfigType @@ -113,6 +119,7 @@ export class RenderingService { i18n: i18n.translate, locale: i18n.getLocale(), darkMode, + themeVersion, injectedMetadata: { version: env.packageInfo.version, buildNumber: env.packageInfo.buildNum, diff --git a/src/core/server/rendering/types.ts b/src/core/server/rendering/types.ts index 9f0db46074b2..45821c2b8228 100644 --- a/src/core/server/rendering/types.ts +++ b/src/core/server/rendering/types.ts @@ -46,6 +46,7 @@ export interface RenderingMetadata { i18n: typeof i18n.translate; locale: string; darkMode: boolean; + themeVersion: string; injectedMetadata: { version: string; buildNumber: number; diff --git a/src/core/server/rendering/views/__snapshots__/template.test.tsx.snap b/src/core/server/rendering/views/__snapshots__/template.test.tsx.snap index 12cea1e9b430..87a00f601a44 100644 --- a/src/core/server/rendering/views/__snapshots__/template.test.tsx.snap +++ b/src/core/server/rendering/views/__snapshots__/template.test.tsx.snap @@ -14,7 +14,6 @@ Array [ name="viewport" />, , - null, <link href="[object Object]/ui/favicons/apple-touch-icon.png" rel="apple-touch-icon" @@ -60,6 +59,7 @@ Array [ <meta name="add-scripts-here" />, + null, <osd-csp data="{\\"strictCsp\\":true}" />, @@ -152,7 +152,6 @@ Array [ name="viewport" />, <title />, - null, <link href="[object Object]/ui/favicons/apple-touch-icon.png" rel="apple-touch-icon" @@ -198,6 +197,7 @@ Array [ <meta name="add-scripts-here" />, + null, <osd-csp data="{\\"strictCsp\\":true}" />, @@ -290,7 +290,6 @@ Array [ name="viewport" />, <title />, - null, <link href="[object Object]/ui/favicons/apple-touch-icon.png" rel="apple-touch-icon" @@ -336,6 +335,7 @@ Array [ <meta name="add-scripts-here" />, + null, <osd-csp data="{\\"strictCsp\\":true}" />, @@ -431,7 +431,6 @@ Array [ name="viewport" />, <title />, - null, <link href="[object Object]/ui/favicons/apple-touch-icon.png" rel="apple-touch-icon" @@ -477,6 +476,7 @@ Array [ <meta name="add-scripts-here" />, + null, <osd-csp data="{\\"strictCsp\\":true}" />, @@ -572,7 +572,6 @@ Array [ name="viewport" />, <title />, - null, <link href="[object Object]/ui/favicons/apple-touch-icon.png" rel="apple-touch-icon" @@ -618,6 +617,7 @@ Array [ <meta name="add-scripts-here" />, + null, <osd-csp data="{\\"strictCsp\\":true}" />, @@ -733,7 +733,6 @@ Array [ <title> custom title , - null, , + null, , @@ -873,7 +873,6 @@ Array [ custom title , - null, , + null, , @@ -1016,7 +1016,6 @@ Array [ custom title , - null, , + null, , @@ -1175,7 +1175,6 @@ Array [ name="viewport" />, , - null, <link href="/customFavicon" rel="apple-touch-icon" @@ -1221,6 +1220,7 @@ Array [ <meta name="add-scripts-here" />, + null, <osd-csp data="{\\"strictCsp\\":true}" />, @@ -1334,7 +1334,6 @@ Array [ name="viewport" />, <title />, - null, <link href="[object Object]/ui/favicons/apple-touch-icon.png" rel="apple-touch-icon" @@ -1380,6 +1379,7 @@ Array [ <meta name="add-scripts-here" />, + null, <osd-csp data="{\\"strictCsp\\":true}" />, diff --git a/src/core/server/rendering/views/fonts.tsx b/src/core/server/rendering/views/fonts.tsx index b3e95ed417ef..3f2196b56558 100644 --- a/src/core/server/rendering/views/fonts.tsx +++ b/src/core/server/rendering/views/fonts.tsx @@ -36,6 +36,7 @@ import { RenderingMetadata } from '../types'; interface Props { url: RenderingMetadata['uiPublicUrl']; + theme: string; } interface FontFace { @@ -49,7 +50,228 @@ interface FontFace { }>; } -export const Fonts: FunctionComponent<Props> = ({ url }) => { +export const Fonts: FunctionComponent<Props> = ({ url, theme }) => { + // For next theme + const sourceSans3: FontFace = { + family: 'Source Sans 3', + variants: [ + { + weight: 200, + style: 'normal', + sources: [ + `${url}/fonts/source_sans_3/SourceSans3-ExtraLight.ttf.woff2`, + `${url}/fonts/source_sans_3/SourceSans3-ExtraLight.otf.woff`, + ], + }, + { + weight: 200, + style: 'italic', + sources: [ + `${url}/fonts/source_sans_3/SourceSans3-ExtraLightIt.ttf.woff2`, + `${url}/fonts/source_sans_3/SourceSans3-ExtraLightIt.otf.woff`, + ], + }, + { + weight: 300, + style: 'normal', + sources: [ + `${url}/fonts/source_sans_3/SourceSans3-Light.ttf.woff2`, + `${url}/fonts/source_sans_3/SourceSans3-Light.otf.woff`, + ], + }, + { + weight: 300, + style: 'italic', + sources: [ + `${url}/fonts/source_sans_3/SourceSans3-LightIt.ttf.woff2`, + `${url}/fonts/source_sans_3/SourceSans3-LightIt.otf.woff`, + ], + }, + { + weight: 400, + style: 'normal', + sources: [ + `${url}/fonts/source_sans_3/SourceSans3-Regular.ttf.woff2`, + `${url}/fonts/source_sans_3/SourceSans3-Regular.otf.woff`, + ], + }, + { + weight: 400, + style: 'italic', + sources: [ + `${url}/fonts/source_sans_3/SourceSans3-It.ttf.woff2`, + `${url}/fonts/source_sans_3/SourceSans3-It.otf.woff`, + ], + }, + { + weight: 600, + style: 'normal', + sources: [ + `${url}/fonts/source_sans_3/SourceSans3-Semibold.ttf.woff2`, + `${url}/fonts/source_sans_3/SourceSans3-Semibold.otf.woff`, + ], + }, + { + weight: 600, + style: 'italic', + sources: [ + `${url}/fonts/source_sans_3/SourceSans3-SemiboldIt.ttf.woff2`, + `${url}/fonts/source_sans_3/SourceSans3-SemiboldIt.otf.woff`, + ], + }, + { + weight: 700, + style: 'normal', + sources: [ + `${url}/fonts/source_sans_3/SourceSans3-Bold.ttf.woff2`, + `${url}/fonts/source_sans_3/SourceSans3-Bold.otf.woff`, + ], + }, + { + weight: 700, + style: 'italic', + sources: [ + `${url}/fonts/source_sans_3/SourceSans3-BoldIt.ttf.woff2`, + `${url}/fonts/source_sans_3/SourceSans3-BoldIt.otf.woff`, + ], + }, + { + weight: 900, + style: 'normal', + sources: [ + `${url}/fonts/source_sans_3/SourceSans3-Black.ttf.woff2`, + `${url}/fonts/source_sans_3/SourceSans3-Black.otf.woff`, + ], + }, + { + weight: 900, + style: 'italic', + sources: [ + `${url}/fonts/source_sans_3/SourceSans3-BlackIt.ttf.woff2`, + `${url}/fonts/source_sans_3/SourceSans3-BlackIt.otf.woff`, + ], + }, + ], + }; + const sourceCodePro: FontFace = { + family: 'Source Code Pro', + variants: [ + { + weight: 200, + style: 'normal', + sources: [ + `${url}/fonts/source_code_pro/SourceCodePro-ExtraLight.ttf.woff2`, + `${url}/fonts/source_code_pro/SourceCodePro-ExtraLight.otf.woff`, + ], + }, + { + weight: 200, + style: 'italic', + sources: [ + `${url}/fonts/source_code_pro/SourceCodePro-ExtraLightIt.ttf.woff2`, + `${url}/fonts/source_code_pro/SourceCodePro-ExtraLightIt.otf.woff`, + ], + }, + { + weight: 300, + style: 'normal', + sources: [ + `${url}/fonts/source_code_pro/SourceCodePro-Light.ttf.woff2`, + `${url}/fonts/source_code_pro/SourceCodePro-Light.otf.woff`, + ], + }, + { + weight: 300, + style: 'italic', + sources: [ + `${url}/fonts/source_code_pro/SourceCodePro-LightIt.ttf.woff2`, + `${url}/fonts/source_code_pro/SourceCodePro-LightIt.otf.woff`, + ], + }, + { + weight: 400, + style: 'normal', + sources: [ + `${url}/fonts/source_code_pro/SourceCodePro-Regular.ttf.woff2`, + `${url}/fonts/source_code_pro/SourceCodePro-Regular.otf.woff`, + ], + }, + { + weight: 400, + style: 'italic', + sources: [ + `${url}/fonts/source_code_pro/SourceCodePro-It.ttf.woff2`, + `${url}/fonts/source_code_pro/SourceCodePro-It.otf.woff`, + ], + }, + { + weight: 500, + style: 'normal', + sources: [ + `${url}/fonts/source_code_pro/SourceCodePro-Medium.ttf.woff2`, + `${url}/fonts/source_code_pro/SourceCodePro-Medium.otf.woff`, + ], + }, + { + weight: 500, + style: 'italic', + sources: [ + `${url}/fonts/source_code_pro/SourceCodePro-MediumIt.ttf.woff2`, + `${url}/fonts/source_code_pro/SourceCodePro-MediumIt.otf.woff`, + ], + }, + { + weight: 600, + style: 'normal', + sources: [ + `${url}/fonts/source_code_pro/SourceCodePro-Semibold.ttf.woff2`, + `${url}/fonts/source_code_pro/SourceCodePro-Semibold.otf.woff`, + ], + }, + { + weight: 600, + style: 'italic', + sources: [ + `${url}/fonts/source_code_pro/SourceCodePro-SemiboldIt.ttf.woff2`, + `${url}/fonts/source_code_pro/SourceCodePro-SemiboldIt.otf.woff`, + ], + }, + { + weight: 700, + style: 'normal', + sources: [ + `${url}/fonts/source_code_pro/SourceCodePro-Bold.ttf.woff2`, + `${url}/fonts/source_code_pro/SourceCodePro-Bold.otf.woff`, + ], + }, + { + weight: 700, + style: 'italic', + sources: [ + `${url}/fonts/source_code_pro/SourceCodePro-BoldIt.ttf.woff2`, + `${url}/fonts/source_code_pro/SourceCodePro-BoldIt.otf.woff`, + ], + }, + { + weight: 900, + style: 'normal', + sources: [ + `${url}/fonts/source_code_pro/SourceCodePro-Black.ttf.woff2`, + `${url}/fonts/source_code_pro/SourceCodePro-Black.otf.woff`, + ], + }, + { + weight: 900, + style: 'italic', + sources: [ + `${url}/fonts/source_code_pro/SourceCodePro-BlackIt.ttf.woff2`, + `${url}/fonts/source_code_pro/SourceCodePro-BlackIt.otf.woff`, + ], + }, + ], + }; + + // ToDo [NEW THEME]: Remove these fonts and their files when the theme is released: https://github.com/opensearch-project/OpenSearch-Dashboards/issues/4301 const interUi: FontFace = { family: 'Inter UI', variants: [ @@ -252,94 +474,119 @@ export const Fonts: FunctionComponent<Props> = ({ url }) => { ], }; - return ( - <style - dangerouslySetInnerHTML={{ - __html: ` - ${[interUi, roboto] - .flatMap(({ family, variants }) => - variants.map(({ style, weight, format, sources, unicodeRange }) => { - const src = sources - .map((source) => - source.startsWith(url) - ? `url('${source}') format('${format || source.split('.').pop()}')` - : `local('${source}')` - ) - .join(', '); + /* + Single variable font. + + Note that you may want to do something like this to make sure you're serving + constant fonts to older browsers: + html { + font-family: 'Inter UI', sans-serif; + } + @supports (font-variation-settings: normal) { + html { + font-family: 'Inter UI var', sans-serif; + } + } + + BUGS: + - Safari 12.0 will default to italic instead of regular when font-weight + is provided in a @font-face declaration. + Workaround: Use 'Inter UI var alt' for Safari, or explicitly set + \`font-variation-settings: 'slnt' DEGREE\`. + + @font-face { + font-family: 'Inter UI var'; + font-weight: 100 900; + font-style: oblique 0deg 10deg; + src: + url('${url}/fonts/inter_ui/Inter-UI.var.woff2') format('woff2-variations'), + url('${url}/fonts/inter_ui/Inter-UI.var.woff2') format('woff2'); + } + + 'Inter UI var alt' is recommended for Safari and Edge, for reliable italics. - return ` + @supports (font-variation-settings: normal) { + html { + font-family: 'Inter UI var alt', sans-serif; + } + } + + @font-face { + font-family: 'Inter UI var alt'; + font-weight: 100 900; + font-style: normal; + font-named-instance: 'Regular'; + src: + url('${url}/fonts/inter_ui/Inter-UI-upright.var.woff2') format('woff2 supports variations(gvar)'), + url('${url}/fonts/inter_ui/Inter-UI-upright.var.woff2') format('woff2-variations'), + url('${url}/fonts/inter_ui/Inter-UI-upright.var.woff2') format('woff2'); + } + @font-face { + font-family: 'Inter UI var alt'; + font-weight: 100 900; + font-style: italic; + font-named-instance: 'Italic'; + src: + url('${url}/fonts/inter_ui/Inter-UI-italic.var.woff2') format('woff2 supports variations(gvar)'), + url('${url}/fonts/inter_ui/Inter-UI-italic.var.woff2') format('woff2-variations'), + url('${url}/fonts/inter_ui/Inter-UI-italic.var.woff2') format('woff2'); + } + */ + const fontText = theme === 'v7' ? interUi : sourceSans3; + const fontCode = theme === 'v7' ? roboto : sourceCodePro; + const fontsDefinitionRules = [fontText, fontCode] + .flatMap(({ family, variants }) => + variants.map(({ style, weight, format, sources, unicodeRange }) => { + const src = sources + .map((source) => + source.startsWith(url) + ? `url('${source}') format('${format || source.split('.').pop()}')` + : `local('${source}')` + ) + .join(', '); + + return ` @font-face { font-family: '${family}'; font-style: ${style}; font-weight: ${weight}; - src: ${src};${ - unicodeRange - ? ` - unicode-range: ${unicodeRange};` - : '' - } + src: ${src}; + ${unicodeRange ? `unicode-range: ${unicodeRange};` : ''} }`; - }) - ) - .join('\n')} - /* - Single variable font. + }) + ) + .join('\n'); - Note that you may want to do something like this to make sure you're serving - constant fonts to older browsers: - html { - font-family: 'Inter UI', sans-serif; - } - @supports (font-variation-settings: normal) { - html { - font-family: 'Inter UI var', sans-serif; - } - } + /* + * The default fonts are added as CSS variables, overriding OUI's, and then + * the CSS variables are consumed. + */ + const fontRules = ` + :root { + --font-text: "${fontText.family}", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, + sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; - BUGS: - - Safari 12.0 will default to italic instead of regular when font-weight - is provided in a @font-face declaration. - Workaround: Use 'Inter UI var alt' for Safari, or explicitly set - \`font-variation-settings: 'slnt' DEGREE\`. + --font-code: "${fontCode.family}", Consolas, Menlo, Courier, monospace; - @font-face { - font-family: 'Inter UI var'; - font-weight: 100 900; - font-style: oblique 0deg 10deg; - src: - url('${url}/fonts/inter_ui/Inter-UI.var.woff2') format('woff2-variations'), - url('${url}/fonts/inter_ui/Inter-UI.var.woff2') format('woff2'); - } + --oui-font-family: var(--font-text); + --oui-code-font-family: var(--font-code); + } - 'Inter UI var alt' is recommended for Safari and Edge, for reliable italics. + code, pre, kbd, samp { + font-family: var(--font-code); + } + html, input, textarea, select, button { + font-family: var(--font-text); + } - @supports (font-variation-settings: normal) { - html { - font-family: 'Inter UI var alt', sans-serif; - } - } + `; - @font-face { - font-family: 'Inter UI var alt'; - font-weight: 100 900; - font-style: normal; - font-named-instance: 'Regular'; - src: - url('${url}/fonts/inter_ui/Inter-UI-upright.var.woff2') format('woff2 supports variations(gvar)'), - url('${url}/fonts/inter_ui/Inter-UI-upright.var.woff2') format('woff2-variations'), - url('${url}/fonts/inter_ui/Inter-UI-upright.var.woff2') format('woff2'); - } - @font-face { - font-family: 'Inter UI var alt'; - font-weight: 100 900; - font-style: italic; - font-named-instance: 'Italic'; - src: - url('${url}/fonts/inter_ui/Inter-UI-italic.var.woff2') format('woff2 supports variations(gvar)'), - url('${url}/fonts/inter_ui/Inter-UI-italic.var.woff2') format('woff2-variations'), - url('${url}/fonts/inter_ui/Inter-UI-italic.var.woff2') format('woff2'); - } - */ + return ( + <style + dangerouslySetInnerHTML={{ + __html: ` + ${fontsDefinitionRules} + ${fontRules} `, }} /> diff --git a/src/core/server/rendering/views/template.test.tsx b/src/core/server/rendering/views/template.test.tsx index 9366b753770f..39a3e1401ea3 100644 --- a/src/core/server/rendering/views/template.test.tsx +++ b/src/core/server/rendering/views/template.test.tsx @@ -17,6 +17,7 @@ function mockProps() { uiPublicUrl: `${http.basePath}/ui`, locale: '', darkMode: true, + themeVersion: 'v7', i18n: () => '', bootstrapScriptUrl: `${http.basePath}/bootstrap.js`, strictCsp: true, diff --git a/src/core/server/rendering/views/template.tsx b/src/core/server/rendering/views/template.tsx index 6af9a474b5de..2306b7d82564 100644 --- a/src/core/server/rendering/views/template.tsx +++ b/src/core/server/rendering/views/template.tsx @@ -43,6 +43,7 @@ export const Template: FunctionComponent<Props> = ({ uiPublicUrl, locale, darkMode, + themeVersion, injectedMetadata, i18n, bootstrapScriptUrl, @@ -174,7 +175,6 @@ export const Template: FunctionComponent<Props> = ({ <meta httpEquiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <meta name="viewport" content="width=device-width" /> <title>{applicationTitle} - {/** * Favicons (generated from https://realfavicongenerator.net/) * @@ -229,6 +229,9 @@ export const Template: FunctionComponent = ({ {/* Inject stylesheets into the before scripts so that KP plugins with bundled styles will override them */} + + {/* Place fonts after styles that would be injected later to make sure nothing overrides them */} + {createElement('osd-csp', {