set monospaced font-family for number

This commit is contained in:
afc163 2017-03-31 13:45:16 +08:00
parent cb2460c412
commit b526083fa6
6 changed files with 19 additions and 8 deletions

View File

@ -1,5 +1,12 @@
@import "../color/colors"; @import "../color/colors";
// http://stackoverflow.com/a/13611748/3040605
@font-face {
font-family: "Helvetica Neue For Number";
src: local("Helvetica Neue");
unicode-range: U+30-39;
}
// Prefix // Prefix
@ant-prefix : ant; @ant-prefix : ant;
@ -26,7 +33,7 @@
// ------ Base & Require ------ // ------ Base & Require ------
@body-background : #fff; @body-background : #fff;
@component-background : #fff; @component-background : #fff;
@font-family : -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif; @font-family : "Helvetica Neue For Number", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
@code-family : Consolas, Menlo, Courier, monospace; @code-family : Consolas, Menlo, Courier, monospace;
@heading-color : fade(#000, 85%); @heading-color : fade(#000, 85%);
@text-color : fade(#000, 65%); @text-color : fade(#000, 65%);

View File

@ -29,6 +29,10 @@ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
> 参考自https://www.smashingmagazine.com/2015/11/using-system-ui-fonts-practical-guide/ > 参考自https://www.smashingmagazine.com/2015/11/using-system-ui-fonts-practical-guide/
另外,在中后台系统中,数字经常需要进行纵向对比展示,我们单独将数字的字体设置为 `Helvetica Neue`,使其为等宽字体。
> 技术方案http://stackoverflow.com/questions/13611420/set-a-font-specifically-for-all-numbers-on-the-page
## 字号 ## 字号
Ant Design 使用不同的字号和字重来传递视觉的信息层次。默认字体为 `12pt`,展示型页面可以设置为 `14pt`,其他字体字号相应升级。 Ant Design 使用不同的字号和字重来传递视觉的信息层次。默认字体为 `12pt`,展示型页面可以设置为 `14pt`,其他字体字号相应升级。

View File

@ -9,7 +9,7 @@ body {
} }
body { body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimSun, sans-serif; font-family: @font-family;
line-height: 1.5; line-height: 1.5;
color: @text-color; color: @text-color;
font-size: 14px; font-size: 14px;
@ -46,7 +46,7 @@ a {
.aside-container { .aside-container {
padding-bottom: 50px; padding-bottom: 50px;
font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimSun, sans-serif; font-family: Lato, @font-family;
&.ant-menu-inline .ant-menu-submenu-title h4, &.ant-menu-inline .ant-menu-submenu-title h4,
&.ant-menu-inline > .ant-menu-item, &.ant-menu-inline > .ant-menu-item,

View File

@ -78,7 +78,7 @@
border: 0; border: 0;
float: right; float: right;
font-size: 14px; font-size: 14px;
font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimSun, sans-serif; font-family: Lato, @font-family;
} }
#nav li { #nav li {

View File

@ -10,7 +10,7 @@
top: 53%; top: 53%;
color: #fff; color: #fff;
text-align: right; text-align: right;
font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimSun, sans-serif; font-family: Lato, @font-family;
} }
.banner-text-wrapper h2 { .banner-text-wrapper h2 {
font-size: 40px; font-size: 40px;
@ -108,7 +108,7 @@
position: relative; position: relative;
top: 20%; top: 20%;
left: -30px; left: -30px;
font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimSun, sans-serif; font-family: Lato, @font-family;
z-index: 1; z-index: 1;
} }
.text-wrapper h2, .text-wrapper h2,

View File

@ -19,7 +19,7 @@
line-height: 40px; line-height: 40px;
margin-bottom: 24px; margin-bottom: 24px;
margin-top: 8px; margin-top: 8px;
font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimSun, sans-serif; font-family: Lato, @font-family;
.subtitle { .subtitle {
font-weight: normal; font-weight: normal;
@ -34,7 +34,7 @@
.markdown h5, .markdown h5,
.markdown h6 { .markdown h6 {
color: @heading-color; color: @heading-color;
font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimSun, sans-serif; font-family: Lato, @font-family;
margin: 1.6em 0 0.6em; margin: 1.6em 0 0.6em;
font-weight: 500; font-weight: 500;
clear: both; clear: both;