@bug-on/m3-expressive 1.0.0 → 1.1.0

package/dist/material-symbols-self-hosted.css

@@ -4,56 +4,57 @@
  * SETUP STEPS:
  *
  * Step 1 — Download font files
- * Truy cập: https://github.com/google/material-design-icons/tree/master/variablefont
+ * Visit: https://github.com/google/material-design-icons/tree/master/variablefont
  * Download file: MaterialSymbolsOutlined[FILL,GRAD,opsz,wght].woff2
- * (và Rounded / Sharp nếu cần)
+ * (and Rounded / Sharp if needed)
  *
  * Step 2 — Place font files in your app
- * Recommended location: public/fonts/ hoặc src/assets/fonts/
+ * Recommended location: public/fonts/ or src/assets/fonts/
  * Example: public/fonts/MaterialSymbolsOutlined.woff2
  *
- * Step 3 — Copy và điều chỉnh @font-face block bên dưới
- * Thay đổi src url() để trỏ đúng đường dẫn trong project của bạn
+ * Step 3 — Copy and adjust @font-face block below
+ * Change src url() to point to the correct path in your project
  *
- * @deprecated New integrations should install `@bug-on/m3-fonts` and import
- * `@bug-on/m3-fonts/material-symbols.css`. This legacy export remains only
+ * @deprecated New integrations should install `@bug-on/md3-fonts` and import
+ * `@bug-on/md3-fonts/material-symbols.css`. This legacy export remains only
  * for backwards compatibility and will be removed in the next major version.
  *
- * Step 4 — Import file này:
+ * Step 4 — Import this file:
  *   import '@bug-on/m3-expressive/material-symbols-self-hosted.css'
  *
  * PERFORMANCE NOTES:
- * - Self-hosting tốt hơn CDN khi bạn dùng CDN + HTTP/2 cho static assets
- * - Nếu không có CDN, Google Fonts CDN có thể nhanh hơn do cache sharing
- * - Dùng font-display: block cho icon fonts (xem lý do ở file CDN)
- * - WOFF2 là format duy nhất cần thiết (100% modern browser support, Brotli compression)
- * - Không cần WOFF fallback nữa
+ * - Self-hosting is better than CDN when using HTTP/2 CDN for static assets
+ * - Without a CDN, Google Fonts CDN may be faster due to cache sharing
+ * - Use font-display: block for icon fonts (see reasons in CDN file)
+ * - WOFF2 is the only format needed (100% modern browser support, Brotli compression)
+ * - WOFF fallback is no longer required
  *
- * SUBSETTING (QUAN TRỌNG để giảm file size):
- * Full variable font ~295 KB. Sau khi subset còn ~1-2 KB cho vài chục icons.
- * Dùng tool: https://everythingfonts.com/subsetter
- * Hoặc dùng Google Fonts text parameter để subset trên CDN:
+
+ * SUBSETTING (IMPORTANT for reducing file size):
+ * Full variable font ~295 KB. After subsetting ~1-2 KB for a few dozen icons.
+ * Use tool: https://everythingfonts.com/subsetter
+ * Or use Google Fonts text parameter to subset on CDN:
  *   ?family=Material+Symbols+Outlined&text=home%20search%20settings
  *
  * GDPR NOTE:
- * Self-hosting loại bỏ việc gửi user IP đến Google servers,
- * giải quyết GDPR compliance requirement.
+ * Self-hosting eliminates sending user IP addresses to Google servers,
+ * resolving GDPR compliance requirements.
  */
 
 @font-face {
 	font-family: "Material Symbols Outlined";
 	font-style: normal;
-	/* Khai báo full axis range để browser biết đây là variable font */
+	/* Declare full axis range so browser recognizes variable font */
 	font-weight: 100 700;
-	/* font-display: block là bắt buộc cho icon fonts:
-   * - Tránh render text thô "arrow_forward" thay vì icon
-   * - Max 3s block, sau đó icon xuất hiện
-   * Tham khảo: https://web.dev/articles/font-best-practices#icon_fonts */
+	/* font-display: block is required for icon fonts:
+   * - Prevents rendering raw text "arrow_forward" instead of icon
+   * - Max 3s block, then icon appears
+   * Reference: https://web.dev/articles/font-best-practices#icon_fonts */
 	font-display: block;
 	src: url("/fonts/MaterialSymbolsOutlined[FILL,GRAD,opsz,wght].woff2")
 		format("woff2");
-	/* unicode-range: chỉ load font khi page chứa ký tự trong range này.
-   * Material Symbols dùng PUA (Private Use Area) cho ligatures. */
+	/* unicode-range: loads font only when page contains characters in range.
+   * Material Symbols uses PUA (Private Use Area) for ligatures. */
 }
 
 /*