-
Notifications
You must be signed in to change notification settings - Fork 27.6k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
docs: remove --save from npm install; avoid system-ui #10252
Conversation
Stats from current PRDefault Server ModeGeneral
Client Bundles (main, webpack, commons)
Client Bundles (main, webpack, commons) Modern
Legacy Client Bundles (polyfills)
Client Pages
Client Pages Modern
Client Build Manifests
Rendered Page Sizes
Serverless ModeGeneral
Client Bundles (main, webpack, commons)
Client Bundles (main, webpack, commons) Modern
Legacy Client Bundles (polyfills)
Client Pages
Client Pages Modern
Client Build Manifests
Serverless bundles
Commit: 764781e |
@@ -15,7 +15,7 @@ For example, consider the following stylesheet named `styles.css`: | |||
|
|||
```css | |||
body { | |||
font-family: 'SF Pro Text', 'SF Pro Icons', system-ui; | |||
font-family: sans-serif; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hmm, this was partially intentional to show the property would get compiled.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@Timer If we want to show that the style will change, how about monospace
? That'll make the change obvious.
Or we can use the stack we use on Next.js site (which doesn't use system-ui
).
Stats from current PRDefault Server Mode (Decrease detected ✓)General Overall decrease ✓
Client Bundles (main, webpack, commons)
Client Bundles (main, webpack, commons) Modern
Legacy Client Bundles (polyfills)
Client Pages
Client Pages Modern
Client Build Manifests
Rendered Page Sizes
Serverless Mode (Decrease detected ✓)General Overall decrease ✓
Client Bundles (main, webpack, commons)
Client Bundles (main, webpack, commons) Modern
Legacy Client Bundles (polyfills)
Client Pages
Client Pages Modern
Client Build Manifests
Serverless bundles
Commit: f8391b5 |
Stats from current PRDefault Server Mode (Decrease detected ✓)General Overall decrease ✓
Client Bundles (main, webpack, commons)
Client Bundles (main, webpack, commons) Modern
Legacy Client Bundles (polyfills)
Client Pages
Client Pages Modern
Client Build Manifests
Rendered Page Sizes
Serverless Mode (Decrease detected ✓)General Overall decrease ✓
Client Bundles (main, webpack, commons)
Client Bundles (main, webpack, commons) Modern
Legacy Client Bundles (polyfills)
Client Pages
Client Pages Modern
Client Build Manifests
Serverless bundles
Commit: 3f36f70 |
Stats from current PRDefault Server Mode (Decrease detected ✓)General Overall decrease ✓
Client Bundles (main, webpack, commons)
Client Bundles (main, webpack, commons) Modern
Legacy Client Bundles (polyfills)
Client Pages
Client Pages Modern
Client Build Manifests
Rendered Page Sizes
Serverless Mode (Decrease detected ✓)General Overall decrease ✓
Client Bundles (main, webpack, commons)
Client Bundles (main, webpack, commons) Modern
Legacy Client Bundles (polyfills)
Client Pages
Client Pages Modern
Client Build Manifests
Serverless bundles
Commit: c7bcf14 |
npm install instructionsI think it's better to include--save
tonpm install sass
because we also do so for Next.js setup doc.npm install --save
→npm install
--save
has been the default fornpm install
since npm 5.system-ui
Also, I don't know where the CSS font-family stack used in the doc came from (it was added on this commit 086ce5d) but it seemed problematic.
First,
SF Pro Icons
is actually not part of a system Mac font. It seems like it's used on apple.com but is actually loaded as a webfont:https://www.apple.com/wss/fonts/SF-Pro-Icons/v1/SFProIcons_regular.woff
. So if you're not on apple.com, you won't have this font.Second,
system-ui
should NOT be the last font on the font stack. system-ui is not supported on Firefox (you need to use-apple-system
) or Edge.Furthermore, system-ui seems to be problematic for Windows on Simplified Chinese environment. To fix this, we must put
Segoe UI
beforesystem-ui
.system-ui
because of this reason and hasn't added it back.If we want to keep the stack simple and avoid adding all the system fonts, I thought we should just use
sans-serif
.