diff --git a/src/styles/global.css b/src/styles/global.css index 6f9585b..9d42659 100644 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -30,6 +30,13 @@ body { padding: 0; } +body, input, textarea, select, button { + font-synthesis: none; + -moz-font-feature-settings: "kern"; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing:grayscale +} + ul, ol, li, @@ -124,7 +131,7 @@ button:disabled { } html { - font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", + font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; font-size: 106.25%; quotes: "“" "”"; @@ -135,7 +142,7 @@ body { line-height: 1.47059; font-weight: 400; letter-spacing: -0.022em; - font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", + font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; background-color: #fff; color: #1d1d1f; @@ -488,7 +495,7 @@ html.no-touch.no-reduced-motion .tile[data-focus-method="key"] .media--video { line-height: 1.33337; font-weight: 700; letter-spacing: -0.01em; - font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", + font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; } @@ -527,7 +534,7 @@ html.no-touch.no-reduced-motion .tile[data-focus-method="key"] .media--video { } .tile__category:lang(zh-CN) { - font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", + font-family: system-ui, "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif; } @@ -551,7 +558,7 @@ html.no-touch.no-reduced-motion .tile[data-focus-method="key"] .media--video { line-height: 1.28577; font-weight: 600; letter-spacing: -0.016em; - font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", + font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; display: flex; justify-content: flex-start; @@ -592,7 +599,7 @@ html.no-touch.no-reduced-motion .tile[data-focus-method="key"] .media--video { } .tile__timestamp:lang(zh-CN) { - font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", + font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI' , "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif; } @@ -5408,7 +5415,7 @@ html.no-touch.no-reduced-motion line-height: 1.23536; font-weight: 500; letter-spacing: -0.022em; - font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", + font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; text-align: center; } @@ -5436,7 +5443,7 @@ html.no-touch.no-reduced-motion line-height: 1.23536; font-weight: 600; letter-spacing: -0.022em; - font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", + font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; border: 2px solid; padding: 10px 24px 9px; @@ -5470,7 +5477,7 @@ html.no-touch.no-reduced-motion line-height: 1.23536; font-weight: 700; letter-spacing: -0.022em; - font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", + font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; -webkit-line-clamp: 6; -webkit-box-orient: vertical; @@ -5939,49 +5946,8 @@ html.no-touch.no-reduced-motion "Arial", sans-serif; } -.page-body:lang(ar) { - line-height: 1.57895; - font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", - "Helvetica Neue", "Helvetica", "Arial", sans-serif; -} - -.page-body:lang(ja) { - line-height: 1.47376; - font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", - "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", - "MS Pゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif; -} - -.page-body:lang(ko) { - line-height: 1.52632; - font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", - "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", - "Helvetica", "Arial", sans-serif; -} - -.page-body:lang(th) { - line-height: 1.36844; - font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", - "Helvetica", "Arial", sans-serif; -} - .page-body:lang(zh-CN) { - font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", - "Helvetica Neue", "Helvetica", "Arial", sans-serif; -} - -.page-body:lang(zh-HK) { - font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", - "Helvetica Neue", "Helvetica", "Arial", sans-serif; -} - -.page-body:lang(zh-MO) { - font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", - "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif; -} - -.page-body:lang(zh-TW) { - font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", + font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI' , "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif; } @@ -5991,62 +5957,13 @@ html.no-touch.no-reduced-motion line-height: 1.47059; font-weight: 400; letter-spacing: -0.022em; - font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", + font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; } - .page-body:lang(ar) { - line-height: 1.58824; - letter-spacing: 0em; - font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Text", "SF Pro Icons", - "Helvetica Neue", "Helvetica", "Arial", sans-serif; - } - - .page-body:lang(ja) { - letter-spacing: 0em; - font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", - "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", - "MS Pゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif; - } - - .page-body:lang(ko) { - line-height: 1.58824; - letter-spacing: 0em; - font-family: "SF Pro KR", "SF Pro Text", "SF Pro Icons", "Apple Gothic", - "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", - "Helvetica", "Arial", sans-serif; - } - .page-body:lang(zh) { letter-spacing: 0em; } - - .page-body:lang(th) { - line-height: 1.35296; - letter-spacing: 0em; - font-family: "SF Pro TH", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", - "Helvetica", "Arial", sans-serif; - } - - .page-body:lang(zh-CN) { - font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", - "Helvetica Neue", "Helvetica", "Arial", sans-serif; - } - - .page-body:lang(zh-HK) { - font-family: "SF Pro HK", "SF Pro Text", "SF Pro Icons", "PingFang HK", - "Helvetica Neue", "Helvetica", "Arial", sans-serif; - } - - .page-body:lang(zh-MO) { - font-family: "SF Pro HK", "SF Pro TC", "SF Pro Text", "SF Pro Icons", - "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif; - } - - .page-body:lang(zh-TW) { - font-family: "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", - "Helvetica Neue", "Helvetica", "Arial", sans-serif; - } } .page-body-media { @@ -6266,7 +6183,7 @@ html.no-touch.no-reduced-motion line-height: 1.33337; font-weight: 600; letter-spacing: -0.01em; - font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", + font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; } @@ -6832,21 +6749,12 @@ html.no-touch.no-reduced-motion } .picture { - /* position: absolute; */ - - /* left: 50%; */ - /* top: 0; - height: 100%; - width: 100%; */ - /* transform: translateX(-50%); */ - /* max-width: min(calc(100% - 32px), 650px); */ position: relative; display: flex; align-items: flex-start; justify-content: space-between; margin-left: auto; margin-right: auto; - max-width: min(calc(100% - 32px), 650px); } .picture.no-dl { @@ -7383,7 +7291,7 @@ html.no-touch.no-reduced-motion line-height: 1.33337; font-weight: 700; letter-spacing: -0.01em; - font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", + font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; } @@ -7548,7 +7456,7 @@ html.no-touch.no-reduced-motion line-height: 1.28577; font-weight: 600; letter-spacing: -0.016em; - font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", + font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; }