Release/2025.1.10 (#30)

* release: version 2025.1.10
feat: fonts
fix: var(--sf-c-table-bd)

* fix: font-weight: 300

* feat: build

Author: Sarmaged

base.css

@@ -1,6 +1,6 @@
 {
   "name": "style-forge.base",
-  "version": "2025.1.8",
+  "version": "2025.1.10",
   "description": "Style-Forge.Base: foundational CSS variables, base styles, typography, colors, utilities for consistent design.",
   "type": "module",
   "main": "base.css",

package.json

@@ -10,7 +10,7 @@ table {
   border-spacing: 0;
 }
 
-table, td, th { border: 1px solid hsl(var(--sf-table-c-bd)) }
+table, td, th { border: 1px solid hsl(var(--sf-c-table-bd)) }
 tbody, tfoot, thead { background: none }
 td, th { padding: 0.5em 0.75em }
 

src/table.css

@@ -9,11 +9,19 @@
 ::backdrop { background: hsl(var(--sf-c-backdrop) / 20%) }
 
 html {
-  font-family: var(--sf-ff);
-  font-size: var(--sf-fz);
-  font-weight: var(--sf-fw);
+  font-family: var(--sf-ff, sans-serif);
+  font-size: var(--sf-fz, 1rem);
+  font-weight: var(--sf-fw, 400);
+  font-synthesis: style;
+  font-optical-sizing: auto;
+  font-stretch: normal;
+
+  text-size-adjust: 100%;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
 
-  line-height: var(--sf-lh);
+  line-height: var(--sf-lh, 0.8);
 
   color: hsl(var(--sf-c-txt));
   background: hsl(var(--sf-c-bg));
@@ -22,9 +30,6 @@ html {
   height: 100%;
 
   box-sizing: border-box;
-
-  font-stretch: normal;
-  text-size-adjust: 100%;
 }
 
 body {
@@ -92,7 +97,7 @@ img
 /* /// */
 
 html.var {
-  font-family: Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
+  font-family: 'Inter', ui-sans-serif, system-ui, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
   font-size: 16px;
   font-weight: 400;
 

src/tag.css

@@ -94,7 +94,7 @@ html.var details
 html.var small,
 html.var sub,
 html.var sup
-{ font-size: 12px; font-weight: 400 }
+{ font-size: 12px; font-weight: 300 }
 
 html.var h1 { font-size: 48px; font-weight: 700 }
 html.var h2 { font-size: 40px; font-weight: 700 }

src/text.css

@@ -1,5 +1,5 @@
 :root {
-  --sf-ff: system-ui, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
+  --sf-ff: 'Inter', ui-sans-serif, system-ui, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
 
   --sf-lh: 0.8;
   --sf-lh-normal: 1.1875;
@@ -34,5 +34,5 @@
   --sf-c-bg: 0 0% 100%;
   --sf-c-shape-bg: 0 0% 90%;
   --sf-c-backdrop: 0 0% 10%;
-  --sf-table-c-bd: 0 0% 75%;
+  --sf-c-table-bd: 0 0% 75%;
 }