@@ -12,23 +12,28 @@ Old-iOS skeuomorphism × macOS Sequoia neatness × Ubuntu warmth.
## Install
## Install
Distributed via self-hosted git — install straight from the repo :
Add the registry to your project `.npmrc` :
```
@olly:registry=https://git.ollyhearn.ru/api/packages/olly/npm/
```
Then install:
``` bash
``` bash
npm i git+https://git.ollyhearn.ru/ olly/modern-sk.git
npm install @olly/@ olly/modern-sk
```
```
`react` and `react-dom` (>=18) are peer dependencies — your app provides them.
`react` and `react-dom` (>=18) are peer dependencies — your app provides them.
The package builds itself on install via the `prepare` script.
## Usage
## Usage
Import the stylesheet once at your app root, then use components anywhere:
Import the stylesheet once at your app root, then use components anywhere:
``` tsx
``` tsx
import 'modern-sk/styles.css' ; // required — tokens + components
import '@olly/ modern-sk/styles.css' ; // required — tokens + components
import 'modern-sk/fonts.css' ; // optional — branded faces (see Fonts)
import '@olly/ modern-sk/fonts.css' ; // optional — branded faces (see Fonts)
import { ThemeProvider , TooltipProvider , Button , Card } from 'modern-sk' ;
import { ThemeProvider , TooltipProvider , Button , Card } from '@olly/ modern-sk' ;
export function App() {
export function App() {
return (
return (
@@ -49,7 +54,7 @@ export function App() {
## Fonts
## Fonts
`modern-sk/styles.css` ships **no fonts ** . The type tokens default to a chain
`@olly/ modern-sk/styles.css` ships **no fonts ** . The type tokens default to a chain
that degrades to `system-ui` , so the library works with zero font loading.
that degrades to `system-ui` , so the library works with zero font loading.
To get the branded ModernSK faces (Anta display + Onest + Geist Mono), import
To get the branded ModernSK faces (Anta display + Onest + Geist Mono), import
@@ -57,7 +62,7 @@ the optional stylesheet — Anta is self-hosted and inlined, no asset hosting
needed:
needed:
``` tsx
``` tsx
import 'modern-sk/fonts.css' ;
import '@olly/ modern-sk/fonts.css' ;
```
```
To use your **own ** fonts, skip `fonts.css` and override the tokens anywhere
To use your **own ** fonts, skip `fonts.css` and override the tokens anywhere