mirror of https://github.com/apache/superset.git
Introducing Inter UI & Fira typefaces (#9207)
* All the fonts! * dynamic loading * folderizing fonts by family * Shuffling files, getting rid off LESS fanciness * Fira Mono, consolidating on "specimen" for LESS filenames * Fira Code * switch for enabling ligatures * ligatures off for now * license * nixing Fira Mono, using OTF features instead.
This commit is contained in:
parent
b1d83ba8d6
commit
7d572d9e96
|
@ -208,9 +208,9 @@ limitations under the License.
|
|||
subcomponents is subject to the terms and conditions of the following
|
||||
licenses.
|
||||
|
||||
|
||||
========================================================================
|
||||
Third party Apache 2.0 licenses
|
||||
Third party SIL Open Font License v1.1 (OFL-1.1)
|
||||
========================================================================
|
||||
|
||||
(Apache 2.0 License) The Roboto family of fonts (https://github.com/google/roboto)
|
||||
(SIL OPEN FONT LICENSE Version 1.1) The Inter font family (https://github.com/rsms/inter)
|
||||
(SIL OPEN FONT LICENSE Version 1.1) The Fira Code font family (https://github.com/tonsky/FiraCode)
|
|
@ -368,6 +368,7 @@ div.tablePopover {
|
|||
|
||||
.ace_editor,
|
||||
.ace_editor div {
|
||||
font-feature-settings: @font-feature-settings;
|
||||
font-family: @font-family-monospace;
|
||||
}
|
||||
|
||||
|
|
|
@ -0,0 +1,59 @@
|
|||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
@font-face {
|
||||
font-family: 'Fira Code';
|
||||
src: url('woff2/FiraCode-Light.woff2') format('woff2'),
|
||||
url("woff/FiraCode-Light.woff") format("woff");
|
||||
font-weight: 300;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Fira Code';
|
||||
src: url('woff2/FiraCode-Regular.woff2') format('woff2'),
|
||||
url("woff/FiraCode-Regular.woff") format("woff");
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Fira Code';
|
||||
src: url('woff2/FiraCode-Medium.woff2') format('woff2'),
|
||||
url("woff/FiraCode-Medium.woff") format("woff");
|
||||
font-weight: 500;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Fira Code';
|
||||
src: url('woff2/FiraCode-Bold.woff2') format('woff2'),
|
||||
url("woff/FiraCode-Bold.woff") format("woff");
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Fira Code VF';
|
||||
src: url('woff2/FiraCode-VF.woff2') format('woff2-variations'),
|
||||
url('woff/FiraCode-VF.woff') format('woff-variations');
|
||||
/* font-weight requires a range: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Fonts/Variable_Fonts_Guide#Using_a_variable_font_font-face_changes */
|
||||
font-weight: 300 700;
|
||||
font-style: normal;
|
||||
}
|
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
@ -0,0 +1,210 @@
|
|||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 100;
|
||||
font-display: swap;
|
||||
src: url("./Inter-Thin.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-Thin.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 100;
|
||||
font-display: swap;
|
||||
src: url("./Inter-ThinItalic.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-ThinItalic.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 200;
|
||||
font-display: swap;
|
||||
src: url("./Inter-ExtraLight.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-ExtraLight.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 200;
|
||||
font-display: swap;
|
||||
src: url("./Inter-ExtraLightItalic.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-ExtraLightItalic.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
font-display: swap;
|
||||
src: url("./Inter-Light.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-Light.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 300;
|
||||
font-display: swap;
|
||||
src: url("./Inter-LightItalic.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-LightItalic.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url("./Inter-Regular.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-Regular.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url("./Inter-Italic.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-Italic.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
src: url("./Inter-Medium.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-Medium.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
src: url("./Inter-MediumItalic.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-MediumItalic.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-display: swap;
|
||||
src: url("./Inter-SemiBold.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-SemiBold.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 600;
|
||||
font-display: swap;
|
||||
src: url("./Inter-SemiBoldItalic.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-SemiBoldItalic.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: url("./Inter-Bold.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-Bold.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: url("./Inter-BoldItalic.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-BoldItalic.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 800;
|
||||
font-display: swap;
|
||||
src: url("./Inter-ExtraBold.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-ExtraBold.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 800;
|
||||
font-display: swap;
|
||||
src: url("./Inter-ExtraBoldItalic.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-ExtraBoldItalic.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
font-display: swap;
|
||||
src: url("./Inter-Black.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-Black.woff?v=3.12") format("woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 900;
|
||||
font-display: swap;
|
||||
src: url("./Inter-BlackItalic.woff2?v=3.12") format("woff2"),
|
||||
url("./Inter-BlackItalic.woff?v=3.12") format("woff");
|
||||
}
|
||||
|
||||
/* -------------------------------------------------------
|
||||
Variable font.
|
||||
Usage:
|
||||
|
||||
html { font-family: 'Inter', sans-serif; }
|
||||
@supports (font-variation-settings: normal) {
|
||||
html { font-family: 'Inter var', sans-serif; }
|
||||
}
|
||||
*/
|
||||
@font-face {
|
||||
font-family: 'Inter var';
|
||||
font-weight: 100 900;
|
||||
font-display: swap;
|
||||
font-style: normal;
|
||||
font-named-instance: 'Regular';
|
||||
src: url("./Inter-roman.var.woff2?v=3.12") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Inter var';
|
||||
font-weight: 100 900;
|
||||
font-display: swap;
|
||||
font-style: italic;
|
||||
font-named-instance: 'Italic';
|
||||
src: url("./Inter-italic.var.woff2?v=3.12") format("woff2");
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
[EXPERIMENTAL] Multi-axis, single variable font.
|
||||
|
||||
Slant axis is not yet widely supported (as of February 2019) and thus this
|
||||
multi-axis single variable font is opt-in rather than the default.
|
||||
|
||||
When using this, you will probably need to set font-variation-settings
|
||||
explicitly, e.g.
|
||||
|
||||
* { font-variation-settings: "slnt" 0deg }
|
||||
.italic { font-variation-settings: "slnt" 10deg }
|
||||
|
||||
*/
|
||||
@font-face {
|
||||
font-family: 'Inter var experimental';
|
||||
font-weight: 100 900;
|
||||
font-display: swap;
|
||||
font-style: oblique 0deg 10deg;
|
||||
src: url("./Inter.var.woff2?v=3.12") format("woff2");
|
||||
}
|
Binary file not shown.
Binary file not shown.
|
@ -0,0 +1,32 @@
|
|||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
|
||||
/*************************************************************************/
|
||||
/* USAGE NOTES */
|
||||
/* Each typeface used in Superset should have local webfont files. */
|
||||
/* Maintain separate specimen sheets so it's easier to add/remove fonts. */
|
||||
/* NOTE: Add font all licenses to LICENSE.text */
|
||||
/*************************************************************************/
|
||||
|
||||
/******************************* Inter UI ********************************/
|
||||
@import '../fonts/InterUI/specimen.less';
|
||||
|
||||
/******************************* Fira Code ********************************/
|
||||
@import '../fonts/FiraCode/specimen.less';
|
|
@ -19,6 +19,7 @@
|
|||
// Index .less, any imports here will be included in the final css build
|
||||
|
||||
@import '~bootstrap/less/bootstrap.less';
|
||||
@import './fonts.less';
|
||||
@import './variables.less';
|
||||
@import './cosmo/bootswatch.less';
|
||||
|
||||
|
|
|
@ -152,10 +152,18 @@
|
|||
@line-height-normal: @line-height-base;
|
||||
@line-height-loose: 2;
|
||||
|
||||
// ****************************** Features *******************************
|
||||
@use-ligatures: false;
|
||||
|
||||
// setting up OTF settings based on @use-ligatures:
|
||||
.set-otf-options(@use-ligatures);
|
||||
.set-otf-options(true) {@font-feature-settings: "liga" on, "calt" on}
|
||||
.set-otf-options(false) {@font-feature-settings: "liga" off, "calt" off}
|
||||
|
||||
// ****************************** Families ******************************
|
||||
@font-family-sans-serif: Helvetica, Arial;
|
||||
@font-family-sans-serif: "Inter", Helvetica, Arial;
|
||||
@font-family-serif: Georgia, 'Times New Roman', Times, serif;
|
||||
@font-family-monospace: Menlo, Monaco, Consolas, 'Courier New', monospace;
|
||||
@font-family-monospace: 'Fira Code', 'Courier New', monospace;
|
||||
@font-family-base: @font-family-sans-serif;
|
||||
|
||||
/************************************************************************/
|
||||
|
|
|
@ -231,6 +231,7 @@ table.table-no-hover tr:hover {
|
|||
}
|
||||
|
||||
.editable-title.datasource-sql-expression {
|
||||
font-feature-settings: @font-feature-settings;
|
||||
font-family: @font-family-monospace;
|
||||
display: inline-block;
|
||||
min-width: @datasource-sql-expression-width;
|
||||
|
|
Loading…
Reference in New Issue