| 6 |
6 |
|
|
| 7 |
7 |
|
## What you can customize
|
| 8 |
8 |
|
|
| 9 |
|
- |
- **Your profile** (`u.makenot.work/yourname`) — full HTML and CSS.
|
| 10 |
|
- |
- **Each project** (`u.makenot.work/yourname/project-slug`) — full HTML and CSS.
|
|
9 |
+ |
- **Your profile** (`u.makenot.work/yourname`): full HTML and CSS.
|
|
10 |
+ |
- **Each project** (`u.makenot.work/yourname/project-slug`): full HTML and CSS.
|
| 11 |
11 |
|
- **Item pages** inherit their parent project's CSS automatically. There is no separate item editor: style your items by styling the project. A project's buy button, file list, and price slots carry its look onto every item.
|
| 12 |
12 |
|
|
| 13 |
13 |
|
## The editor
|
| 36 |
36 |
|
Almost everything. Your CSS is automatically scoped to your page's canvas, so you cannot accidentally restyle the platform chrome around it. A few notes:
|
| 37 |
37 |
|
|
| 38 |
38 |
|
- `@import` is not allowed (it would pull in off-platform CSS). Put everything in the one editor.
|
| 39 |
|
- |
- `url(...)` must resolve to Makenot.work — your own uploaded files, or the built-in assets below.
|
|
39 |
+ |
- `url(...)` must resolve to Makenot.work: your own uploaded files, or the built-in assets below.
|
| 40 |
40 |
|
- `@font-face` works, but its `src` must be on-platform.
|
| 41 |
41 |
|
- Selectors like `html`, `body`, and `:root` are scoped to your canvas, so put CSS variables on a wrapper element rather than `:root`.
|
| 42 |
42 |
|
- Fast strobing animations are capped; a reduced-motion fallback is added automatically.
|
| 43 |
43 |
|
|
| 44 |
44 |
|
## System slots
|
| 45 |
45 |
|
|
| 46 |
|
- |
Project and item pages include a few elements you can style but not remove: the buy/subscribe block (`.mnw-buy`), the file list (`.mnw-files`), and the item block (`.mnw-item`). Style them to match your page. Rules that try to hide them (for example `display: none`) are dropped — visitors always have a way to buy and a way to report.
|
|
46 |
+ |
Project and item pages include a few elements you can style but not remove: the buy/subscribe block (`.mnw-buy`), the file list (`.mnw-files`), and the item block (`.mnw-item`). Style them to match your page. Rules that try to hide them (for example `display: none`) are dropped. Visitors always have a way to buy and a way to report.
|
| 47 |
47 |
|
|
| 48 |
48 |
|
## Using your own files
|
| 49 |
49 |
|
|
| 50 |
|
- |
Any file you've uploaded can be referenced by its on-platform URL — as an `<img>`, a `<video>`/`<audio>` source, or a CSS `background-image`. The buy button still appears for paid items; the page is your storefront, not a way around checkout.
|
|
50 |
+ |
Any file you've uploaded can be referenced by its on-platform URL: as an `<img>`, a `<video>`/`<audio>` source, or a CSS `background-image`. The buy button still appears for paid items; the page is your storefront, not a way around checkout.
|
| 51 |
51 |
|
|
| 52 |
52 |
|
## Built-in assets
|
| 53 |
53 |
|
|
| 63 |
63 |
|
.code { font-family: "Plex Mono", monospace; }
|
| 64 |
64 |
|
```
|
| 65 |
65 |
|
|
| 66 |
|
- |
**Background patterns** (`/static/patterns/`): tileable SVGs in a neutral gray that sit on light or dark backgrounds — `dots.svg`, `grid.svg`, `diagonal.svg`, `checker.svg`.
|
|
66 |
+ |
**Background patterns** (`/static/patterns/`): tileable SVGs in a neutral gray that sit on light or dark backgrounds: `dots.svg`, `grid.svg`, `diagonal.svg`, `checker.svg`.
|
| 67 |
67 |
|
|
| 68 |
68 |
|
```css
|
| 69 |
69 |
|
.hero {
|