48 lines
1.4 KiB
HTML
48 lines
1.4 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
@font-face {
|
|
font-family: "AppleSystemUISerif";
|
|
src: local("ui-serif");
|
|
}
|
|
@font-face {
|
|
font-family: "AppleSystemUIMonospace";
|
|
src: local("ui-monospace");
|
|
}
|
|
@font-face {
|
|
font-family: "AppleSystemUIRounded";
|
|
src: local("ui-rounded");
|
|
}
|
|
@font-face {
|
|
font-family: "DotAppleSystemUIFontSerif";
|
|
src: local(".AppleSystemUIFontSerif");
|
|
}
|
|
@font-face {
|
|
font-family: "DotSFNSMono";
|
|
src: local(".SF NS Mono");
|
|
}
|
|
@font-face {
|
|
font-family: "DotSFUIMono";
|
|
src: local(".SF UI Mono");
|
|
}
|
|
@font-face {
|
|
font-family: "DotAppleSystemUIFontRounded";
|
|
src: local(".AppleSystemUIFontRounded");
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
This test makes sure that the bold versions of the design system UI fonts work in @font-face. The test passes if all the text below is bold.
|
|
<div>
|
|
<div style="display: inline-block; font: bold 72px 'AppleSystemUISerif';">HeJllo</div>
|
|
<div style="display: inline-block; font: bold 72px 'AppleSystemUIMonospace';">HeJllo</div>
|
|
<div style="display: inline-block; font: bold 72px 'AppleSystemUIRounded';">HeJllo</div>
|
|
<div style="display: inline-block; font: bold 72px 'DotAppleSystemUIFontSerif';">HeJllo</div>
|
|
<div style="display: inline-block; font: bold 72px 'DotSFNSMono';">HeJllo</div>
|
|
<div style="display: inline-block; font: bold 72px 'DotSFUIMono';">HeJllo</div>
|
|
<div style="display: inline-block; font: bold 72px 'DotAppleSystemUIFontRounded';">HeJllo</div>
|
|
</div>
|
|
</body>
|
|
</html>
|