|
1 | | -# but-head |
| 1 | +# ButHead |
2 | 2 |
|
3 | | -A custom font project with demo landing page. |
| 3 | +A custom monospace font with a unique design philosophy and interactive showcase website. |
4 | 4 |
|
5 | | -## Project Structure |
6 | | - |
7 | | -``` |
8 | | -but-head/ |
9 | | -├── font/ # Font source files and exports |
10 | | -│ ├── source/ # Glyphs source files |
11 | | -│ └── export/ # Exported font files |
12 | | -└── demo/ # Demo landing page (Svelte + Vite) |
13 | | -``` |
14 | | - |
15 | | -## Font |
16 | | - |
17 | | -The font source files are located in the `font/` directory: |
18 | | -- `font/source/` - Glyphs source files (ButHead-Regular.glyphs, ButHead-Italic.glyphs) |
19 | | -- `font/export/` - Exported font files |
20 | | - |
21 | | -## Demo |
| 5 | + |
22 | 6 |
|
23 | | -A simple landing page built with Svelte and Vite to showcase the font. |
| 7 | +## Overview |
24 | 8 |
|
25 | | -### Prerequisites |
| 9 | +ButHead is a display font with monospace character, available in Regular and Italic styles. Designed with distinctive letterforms for visual impact and creative typography. The project includes the font source files and a demo website built with Svelte. |
26 | 10 |
|
27 | | -- Node.js (version 16 or higher) |
28 | | -- pnpm (or npm/yarn) |
| 11 | +## Project Structure |
29 | 12 |
|
30 | | -### Installation |
| 13 | +- **font/** - Font development files |
| 14 | + - `source/` - Glyphs source files (ButHead-Regular.glyphs, ButHead-Italic.glyphs) |
| 15 | + - `otf/` - OpenType font files |
| 16 | + - `web/` - Web font files and CSS |
| 17 | +- **pages/** - Interactive showcase website (Svelte + Vite) |
31 | 18 |
|
32 | | -```bash |
33 | | -# Navigate to demo directory |
34 | | -cd demo |
| 19 | +## Demo |
35 | 20 |
|
36 | | -# Install dependencies |
37 | | -pnpm install |
38 | | -``` |
| 21 | +View the live demo at: https://gitbutlerapp.github.io/but-head/ |
39 | 22 |
|
40 | 23 | ### Development |
41 | 24 |
|
42 | 25 | ```bash |
43 | | -# Start the development server |
44 | | -cd demo |
| 26 | +cd pages |
| 27 | +pnpm install |
45 | 28 | pnpm run dev |
46 | 29 | ``` |
47 | 30 |
|
48 | | -The site will be available at `http://localhost:5173/` |
49 | | - |
50 | 31 | ### Build |
51 | 32 |
|
52 | 33 | ```bash |
53 | | -# Build for production |
54 | | -cd demo |
| 34 | +cd pages |
55 | 35 | pnpm run build |
56 | 36 | ``` |
57 | | - |
58 | | -The built files will be in the `demo/dist` directory. |
59 | | - |
60 | | -### Preview |
61 | | - |
62 | | -```bash |
63 | | -# Preview the production build |
64 | | -cd demo |
65 | | -pnpm run preview |
66 | | -``` |
67 | | - |
68 | | -## Project Structure |
69 | | - |
70 | | -``` |
71 | | -but-head/ |
72 | | -├── src/ |
73 | | -│ ├── App.svelte # Main landing page component |
74 | | -│ ├── app.css # Global styles |
75 | | -│ └── main.js # Application entry point |
76 | | -├── public/ # Static assets |
77 | | -├── index.html # HTML template |
78 | | -└── package.json # Project dependencies |
79 | | -``` |
80 | | - |
81 | | -## Technologies Used |
82 | | - |
83 | | -- [Svelte](https://svelte.dev/) - Frontend framework |
84 | | -- [Vite](https://vitejs.dev/) - Build tool and dev server |
0 commit comments