Skip to content

Commit cdca8a4

Browse files
1aron1aron
committed
Update metadata categories and fix links in documentation; remove unused markup-driven files
1 parent 475c364 commit cdca8a4

29 files changed

Lines changed: 1359 additions & 459 deletions

‎internal‎

‎packages/server/tests/e2e/beta.css.master.co/docs/installation/general/document.html‎

Lines changed: 2 additions & 2 deletions
Large diffs are not rendered by default.

‎site/app/[locale]/guide/browser-support/content.mdx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import IESvg from 'internal/svgs/ie.svg'
22

3-
The Master CSS [runtime engine](/guide/rendering-modes/runtime-rendering) uses [Web APIs - Mutation Observer](https://developer.mozilla.org/zh-TW/docs/Web/API/MutationObserver) which **even <IESvg width="18" height="18" className="inline-block v:middle" alt="IE 11 Supports" /> IE 11 supports** to observe the DOM tree and traverse each class through a high-performant rule engine to generate the corresponding CSS rules and inject it into the browser instantly.
3+
The Master CSS [runtime engine](/guide/rendering-modes#runtime-rendering) uses [Web APIs - Mutation Observer](https://developer.mozilla.org/zh-TW/docs/Web/API/MutationObserver) which **even <IESvg width="18" height="18" className="inline-block v:middle" alt="IE 11 Supports" /> IE 11 supports** to observe the DOM tree and traverse each class through a high-performant rule engine to generate the corresponding CSS rules and inject it into the browser instantly.
44

55
In the CSS architecture, we use native CSS cascade layers to organize styles, which are [supported on **iOS 15.4**](https://caniuse.com/?search=%40layer) and above.
66

‎site/app/[locale]/guide/flash-of-unstyled-content/content.mdx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ Upon accessing the page, the browser starts rendering the document. However, the
99
The unstyled state can occur in a flash if the browser doesn't block rendering while a stylesheet is downloaded and processed.
1010

1111
### Prevent premature rendering
12-
When you [pre-render](/guide/rendering-modes/progressive-rendering) the page, the required styles will be included during the page load. FOUC occurs when using only [runtime rendering](/guide/rendering-modes/runtime-rendering).
12+
When you [pre-render](/guide/rendering-modes#progressive-rendering) the page, the required styles will be included during the page load. FOUC occurs when using only [runtime rendering](/guide/rendering-modes#runtime-rendering).
1313

1414
(o) Add `html <html hidden>` to avoid FOUC.
1515
```html

‎site/app/[locale]/guide/installation/(main)/cdn/content.mdx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import brands from 'internal/data/brands'
22

3-
Copy and paste the CDN to instantly launch the [runtime engine](/guide/rendering-modes/runtime-rendering) in your browser — *no installation required*.
3+
Copy and paste the CDN to instantly launch the [runtime engine](/guide/rendering-modes#runtime-rendering) in your browser — *no installation required*.
44
<StepSection>
55
<Step>
66
### <StepNum />Start in one step

‎site/app/[locale]/guide/installation/(main)/content.mdx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
The easiest way to use Master CSS [runtime](/guide/rendering-modes/runtime-rendering) from scratch is to initialize in the application's entry file.
1+
The easiest way to use Master CSS [runtime](/guide/rendering-modes#runtime-rendering) from scratch is to initialize in the application's entry file.
22

33
## Installation [sr-only]
44
<StepSection>

site/app/[locale]/guide/introduction/components/CriticalCSSForDocsSitesBenchmark.tsx renamed to site/app/[locale]/guide/introduction/components/CriticalCSSBenchmark.tsx

File renamed without changes.

site/app/[locale]/guide/markup-driven/components/GeneratedCSSBasedOnMarkup.mdx renamed to site/app/[locale]/guide/introduction/components/GeneratedCSSBasedOnMarkup.mdx

Lines changed: 6 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -44,29 +44,9 @@ What! Style without writing CSS rules?
4444
<Code name="home.html" lang="html">
4545
{code3}
4646
</Code>
47-
48-
Generated CSS:
49-
```css
50-
/* Actual output would be minified. */
51-
.p\:32 {
52-
padding: 2rem
53-
}
54-
55-
.text\:center {
56-
text-align: center
57-
}
58-
59-
.bg\:blue {
60-
background-color: #175fe9
61-
}
62-
63-
.bg\:red\:hover:hover {
64-
background-color: #d11a1e
65-
}
66-
67-
@media (width>=64rem) {
68-
.p\:48\@md {
69-
padding: 3rem
70-
}
71-
}
72-
```
47+
<details>
48+
<summary>Generated CSS</summary>
49+
<Class2CSS>
50+
{'bg:blue bg:red:hover p:32 p:48@md text:center'}
51+
</Class2CSS>
52+
</details>

site/app/[locale]/guide/markup-driven/components/PrematureAbstraction.mdx renamed to site/app/[locale]/guide/introduction/components/PrematureAbstraction.mdx

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,7 @@ export const code3 = `
6060

6161
import mountainImage from '~/site/public/images/mountain.jpg'
6262

63+
You always abstract your style, even when unsure about its reusability.
6364
<Demo>
6465
<div className="mx:auto max-w:480">
6566
<div className="flex translateY(-5):hover ~transform|.2s overflow:hidden bg:surface r:10 s:panel center-content">
@@ -71,13 +72,15 @@ import mountainImage from '~/site/public/images/mountain.jpg'
7172
</div>
7273
</div>
7374
</Demo>
74-
(!) You always abstract your style, even when unsure about its reusability.
7575
<Code name="card.html" lang="html">
7676
{code1}
7777
</Code>
78-
<Code name="card.css" lang="css">
79-
{code2}
80-
</Code>
78+
<details>
79+
<summary>View the traditional CSS file</summary>
80+
<Code name="card.css" lang="css">
81+
{code2}
82+
</Code>
83+
</details>
8184
(o) Quickly build styles in markup without naming baggage. <Dropped p1={code1 + code2} p2={code3} target="class" />
8285
<Code name="card.html" lang="html">
8386
{code3}

0 commit comments

Comments
 (0)