Skip to content

Commit 028ea53

Browse files
committed
docs: update CSS structure documentation for c-content-main split
- Reflect the split of `c-content-main.css` into `c-content-main/` and `burger-editor/` directories. - Update `style.css` import examples to include the new `main` layer. - Add detailed descriptions for the new directory structures and their respective files. - Add a reference link to the Burger Editor core README. Relates to d-zero-dev/frontend-env#820 Made-with: Cursor
1 parent 5158537 commit 028ea53

1 file changed

Lines changed: 32 additions & 2 deletions

File tree

src/css/structure.md

Lines changed: 32 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,19 @@
1616
└── 📂 style/
1717
├── 📂 base/
1818
│ └── root.css
19+
├── 📂 burger-editor/
20+
│ ├── 📂 bge-container/
21+
│ │ └── bge-container.css
22+
│ ├── 📂 bge-item/
23+
│ │ ├── bgi-base.css
24+
│ │ ├── bgi-button.css
25+
│ │ ︙
26+
│ │ └── bgi-wysiwyg.css
27+
│ └── index.css
28+
├── 📂 c-content-main/
29+
│ ├── cc-form.css
30+
│ ├── element.css
31+
│ └── index.css
1932
└── 📂 general/
2033
├── all.css
2134
├── body.css
@@ -53,9 +66,10 @@ CSSレイヤーを利用してインポートするファイルを分類しま
5366
@import '@/component/c-nav-breadcrumb.css' layer(components);
5467
@import '@/component/c-title-page.css' layer(components);
5568
@import '@/component/c-pagination.css' layer(components);
56-
@import '@/component/c-content-main.css' layer(components);
69+
@import '@/style/c-content-main/index.css' layer(main);
70+
@import '@/style/burger-editor/index.css' layer(main);
5771

58-
@layer reset, base, general, components;
72+
@layer reset, base, general, components, main;
5973
```
6074

6175
## `__assets/_libs/style/base/root.css`
@@ -106,6 +120,22 @@ CSSレイヤーを利用してインポートするファイルを分類しま
106120
- サイト全体で共通すると断定できる場合。 **ただし、ほとんどの場合、その判断は失敗に終わるので推奨しないでください。**
107121
- CMSなどから入力された要素を、セレクターで判定できない場合(判定できない構造は、HTMLとCSSの設計を見直す方を優先します)
108122

123+
## `__assets/_libs/style/c-content-main/`
124+
125+
メインコンテンツ(`.c-content-main`)に関するスタイルを定義します。CMSなどで管理されるHTMLを扱うことが多いため、例外的に専用のディレクトリを設けています。
126+
127+
- `element.css`: `h2`, `p`, `ul` などの基本要素のスタイル
128+
- `cc-form.css`: フォーム(`.cc-form-*`)に関するスタイル
129+
- `index.css`: これらをとりまとめるインポート用ファイル
130+
131+
## `__assets/_libs/style/burger-editor/`
132+
133+
ブロックエディタ「Burger Editor」に関連するスタイルを定義します。コンテナ、フレーム、アイテムといったエディタの構成要素に基づいた設計となっています。(👉 [Burger Editor の仕様](https://github.com/d-zero-dev/BurgerEditor/blob/dev/packages/%40burger-editor/core/README.md)
134+
135+
- `bge-container/bge-container.css`: コンテナおよびコンテナフレームのスタイル。コンテナクエリを用いたグリッドレイアウトやインラインレイアウトの制御を定義します。
136+
- `bge-item/`: 各アイテムごとのスタイル。ボタン、テーブル、WYSIWYGなど、アイテムの種類に応じた定義を格納します。
137+
- `index.css`: これらをとりまとめるインポート用ファイル。
138+
109139
## `__assets/_libs/style/component/`
110140

111141
要素はコンポーネント単位に分割して管理します。(👉[HTMLガイドライン > コンポーネント](../html/components.md)

0 commit comments

Comments
 (0)