Skip to content

Commit d209daf

Browse files
FlorianRapplFlorianRappl
committed
Include documention
1 parent d2dc894 commit d209daf

13 files changed

+215
-9
lines changed

‎CHANGELOG.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# 0.15.1
22

3-
Release on (tbd)
3+
Release on Sunday, June 6 2021.
44

55
- Extended values for the `width` declaration (#69)
66

‎doc/index.md

-7
This file was deleted.

‎docs/README.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
# AngleSharp.Css Documentation
2+
3+
We have more detailed information regarding the following subjects:
4+
5+
- [API Documentation](tutorials/01-API.md)

‎docs/general/01-Basics.md

+62
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
---
2+
title: "Getting Started"
3+
section: "AngleSharp.Css"
4+
---
5+
# Getting Started
6+
7+
## Requirements
8+
9+
AngleSharp.Css comes currently in two flavors: on Windows for .NET 4.6 and in general targetting .NET Standard 2.0 platforms.
10+
11+
Most of the features of the library do not require .NET 4.6, which means you could create your own fork and modify it to work with previous versions of the .NET-Framework.
12+
13+
You need to have AngleSharp installed already. This could be done via NuGet:
14+
15+
```ps1
16+
Install-Package AngleSharp
17+
```
18+
19+
## Getting AngleSharp.Css over NuGet
20+
21+
The simplest way of integrating AngleSharp.Css to your project is by using NuGet. You can install AngleSharp.Css by opening the package manager console (PM) and typing in the following statement:
22+
23+
```ps1
24+
Install-Package AngleSharp.Css
25+
```
26+
27+
You can also use the graphical library package manager ("Manage NuGet Packages for Solution"). Searching for "AngleSharp.Css" in the official NuGet online feed will find this library.
28+
29+
## Setting up AngleSharp.Css
30+
31+
To use AngleSharp.Css you need to add it to your `Configuration` coming from AngleSharp itself.
32+
33+
If you just want a configuration *that works* (as close as possible to real browsers) you should use the following code:
34+
35+
```cs
36+
var config = Configuration.Default
37+
.WithCss(); // from AngleSharp.Css
38+
```
39+
40+
This will register a parser for CSS related content. The CSS parsing options and more could be set with parameters of the `WithCss` method.
41+
42+
Alternatively, all the (desired) parts may be registered individually as well. That mostly boils down to three elementary parts:
43+
44+
- A CSS parser (implementing the `ICssParser` interface, e.g., `CssParser`)
45+
- A factory for creating CSS declarations (`IDeclarationFactory`)
46+
- The styling service that can handle CSS documents, see `CssStylingService`
47+
48+
For an interactive DOM (i.e., to handle `style` attribute changes in the HTML document) an observer needs to be registered as well.
49+
50+
Furthermore, for some CSSOM features (e.g., media queries) a render device is required.
51+
52+
```cs
53+
var config = Configuration.Default
54+
.WithCss()
55+
.WithRenderDevice(new DefaultRenderDevice
56+
{
57+
DeviceHeight = 768,
58+
DeviceWidth = 1024,
59+
});
60+
```
61+
62+
If no specific `IRenderDevice` (e.g., via creating an `DefaultRenderDevice` object) instance is created a default implementation will be set.

‎doc/Values.md renamed to ‎docs/general/02-Values.md

+4
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
1+
---
2+
title: "Types of Values"
3+
section: "AngleSharp.Css"
4+
---
15
# Types of Values
26

37
For details see [CSS2 specification](https://www.w3.org/TR/CSS2/cascade.html#value-stages).

‎doc/API.md renamed to ‎docs/tutorials/01-API.md

+5-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
1+
---
2+
title: "API Documentation"
3+
section: "AngleSharp.Css"
4+
---
15
# API Documentation
26

37
## CSSOM - Basics
@@ -25,7 +29,7 @@ AngleSharp uses converters to parse a given source to an `ICssValue` instance. T
2529

2630
The `ICssValue` interface is split in various interfaces with respect to their usage.
2731

28-
![The CSSOM Value Tree](cssom-value-tree.png)
32+
![The CSSOM Value Tree](./cssom-value-tree.png)
2933

3034
A converter may also implement the `IValueAggregator` interface, which indicates that the declaration behind it is actually a shorthand that can additionally merge values into a shorthand representation or split the shorthand representation into the atoms described by the shorthand.
3135

‎docs/tutorials/02-Examples.md

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
---
2+
title: "Examples"
3+
section: "AngleSharp.Css"
4+
---
5+
# Example Code
6+
7+
This is a (growing) list of examples for every-day usage of AngleSharp.Css.
8+
9+
## Some Example
10+
11+
(tbd)

‎docs/tutorials/03-Questions.md

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
---
2+
title: "Questions"
3+
section: "AngleSharp.Css"
4+
---
5+
# Frequently Asked Questions
6+
7+
## What to ask?
8+
9+
(tbd)

‎doc/cssom-value-tree.png renamed to ‎docs/tutorials/cssom-value-tree.png

File renamed without changes.

‎src/AngleSharp.Css.Docs/docs.config.json

+28
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
{
2+
"name": "AngleSharp.Css",
3+
"author": "Florian Rappl",
4+
"branch": "devel",
5+
"repositoryUrl": "https://github.com/AngleSharp/AngleSharp.Css",
6+
"rootDir": "../../",
7+
"outputDir": "./dist",
8+
"sitemap": {
9+
"general": {
10+
"sections": [
11+
{
12+
"generator": "markdown",
13+
"segment": "css",
14+
"dir": "general"
15+
}
16+
]
17+
},
18+
"docs": {
19+
"sections": [
20+
{
21+
"generator": "markdown",
22+
"segment": "css",
23+
"dir": "tutorials"
24+
}
25+
]
26+
}
27+
}
28+
}

‎src/AngleSharp.Css.Docs/package.json

+58
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
{
2+
"name": "@anglesharp/css",
3+
"version": "0.16.0",
4+
"preview": true,
5+
"description": "The doclet for the AngleSharp.Css documentation.",
6+
"keywords": [
7+
"pilet"
8+
],
9+
"dependencies": {},
10+
"devDependencies": {
11+
"@anglesharp/website": "1.0.0",
12+
"@types/react": "^17.0.5",
13+
"@types/react-dom": "^17.0.5",
14+
"@types/react-router": "latest",
15+
"@types/react-router-dom": "^5.1.7",
16+
"@types/node": "^15.3.0",
17+
"typescript": "^4.2.4",
18+
"@dbeining/react-atom": "4.1.19",
19+
"@libre/atom": "1.3.3",
20+
"history": "4.10.1",
21+
"react": "17.0.2",
22+
"react-dom": "17.0.2",
23+
"react-router": "5.2.0",
24+
"react-router-dom": "5.2.0",
25+
"tslib": "2.2.0",
26+
"path-to-regexp": "1.8.0",
27+
"piral-cli": "^0.13.3-pre.2480",
28+
"piral-cli-parcel": "^0.13.3-pre.2480"
29+
},
30+
"peerDependencies": {
31+
"@dbeining/react-atom": "*",
32+
"@libre/atom": "*",
33+
"history": "*",
34+
"react": "*",
35+
"react-dom": "*",
36+
"react-router": "*",
37+
"react-router-dom": "*",
38+
"tslib": "*",
39+
"path-to-regexp": "*",
40+
"@anglesharp/website": "*"
41+
},
42+
"scripts": {
43+
"start": "pilet debug",
44+
"build": "pilet build",
45+
"upgrade": "pilet upgrade"
46+
},
47+
"main": "dist/index.js",
48+
"files": [
49+
"dist"
50+
],
51+
"piral": {
52+
"comment": "Keep this section to use the Piral CLI.",
53+
"name": "@anglesharp/website"
54+
},
55+
"peerModules": [
56+
"piral-docs-tools/components"
57+
]
58+
}

‎src/AngleSharp.Css.Docs/src/index.tsx

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import { PiletApi } from 'piral-docs-tools';
2+
3+
const createDoclet = require('piral-docs-tools/doclet');
4+
5+
export function setup(api: PiletApi) {
6+
createDoclet(api);
7+
}

‎src/AngleSharp.Css.Docs/tsconfig.json

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
{
2+
"compilerOptions": {
3+
"declaration": true,
4+
"noImplicitAny": false,
5+
"removeComments": false,
6+
"noLib": false,
7+
"emitDecoratorMetadata": true,
8+
"experimentalDecorators": true,
9+
"target": "es6",
10+
"sourceMap": true,
11+
"outDir": "./dist",
12+
"skipLibCheck": true,
13+
"lib": ["dom", "es2018"],
14+
"moduleResolution": "node",
15+
"module": "esnext",
16+
"jsx": "react",
17+
"importHelpers": true
18+
},
19+
"include": [
20+
"./src"
21+
],
22+
"exclude": [
23+
"node_modules"
24+
]
25+
}

0 commit comments

Comments
 (0)