Update the documentation (#105)

* Rearrange the documentation files

* Update the main article

* Add an article to explain the vapor integration

* Update the getting started article

* Update the conversion article

* Update the globalization article

* Add an article with an element overview

* Update some articles

* Add articles for the components

* Update the articles of the components

* Update the abstraction article

* Add an article to explain the css deployment

* Rename some files

* Update some of the articles

* Update the readme file

* Update some of the articles

Author: mattesmohr

README.md

@@ -1,9 +1,9 @@
 <div align="center">
     <img src="https://avatars.githubusercontent.com/u/26165732?s=200&v=4" width="100" height="100" alt="avatar" />
     <h1/>HTMLKit</h1>
-    <p>Render dynamic HTML templates in a typesafe and performant way! By using Swift's powerful language features and a pre-rendering algorithm, HTMLKit will render insanely fast templates but also catch bugs that otherwise might occur with other templating options.</p>
+    <p>Create and render HTML templates with HTMLKit.</p>
     <a href="https://swiftpackageindex.com/vapor-community/htmlkit/documentation">
-        <img src="https://img.shields.io/badge/Documentation-17.10.2022-red" alt="documentation" />
+        <img src="https://img.shields.io/badge/Documentation-available-red" alt="documentation" />
     </a>
     <a href="https://swiftpackageindex.com/vapor-community/HTMLKit">
         <img src="https://img.shields.io/endpoint?url=https%3A%2F%2Fswiftpackageindex.com%2Fapi%2Fpackages%2Fvapor-community%2FHTMLKit%2Fbadge%3Ftype%3Dswift-versions" alt="versions" />

Sources/HTMLKit/Framework/Core/Primitives/Layouts/Layouts.swift

@@ -4,19 +4,13 @@
  */
 
 /// A type that defines a page layout.
-///
-/// The page covers the whole frame of a hompage. It can contain views and components.
 public protocol Page: AnyLayout, GlobalElement {
 }
 
 /// A type that defines a view layout.
-///
-/// The view is a single part of page. It can contain views ad components.
 public protocol View: AnyLayout, GlobalElement {
 }
 
 /// A type that defines a component layout.
-///
-/// The component is a partial part of a view or page.
 public protocol Component: AnyLayout, GlobalElement {
 }

Sources/HTMLKit/HTMLKit.docc/Essentials/GettingStarted.md

@@ -0,0 +1,31 @@
+# Getting started
+
+Learn how to use the framework.
+
+> Important: The framework requires Swift 5.6 or higher. 
+
+### Manifest
+
+To use the the framework in your project you need to add it to the package manifest first.
+
+```swift
+let package = Package(
+    ...
+    dependencies: [
+        // 1. Add the package
+        .package(url: "https://github.com/vapor-community/HTMLKit.git", from: "2.8.0"),
+    ],
+    targets: [
+        .target(
+            ...
+            dependencies: [
+                /// 2. Add the product
+                .product(name: "HTMLKit", package: "HTMLKit"),
+            ]
+        ),
+        ...
+    ]
+)
+```
+
+Import the module in one of your files next.

Sources/HTMLKit/HTMLKit.docc/Essentials/Getting_started.md

@@ -0,0 +1,45 @@
+# Vapor integration
+
+Use the framework together with Vapor.
+
+## Overview
+
+The HTMLKit framework uses the web framework [Vapor](https://swiftpackageindex.com/vapor/vapor) as its standard view renderer.
+
+### Configure
+
+Before you can use the view renderer, you need to do some adjustments in the *configure.swift* file of your Vapor project:
+
+```swift
+/// 1. Load the module
+import HTMLKitVapor
+import Vapor
+
+public func configure(_ app: Application) throws {
+
+    /// 2. Specify the view renderer
+    app.views.use(.htmlkit)
+    
+    /// 3. Add the layout
+    app.htmlkit.views.add(view: ExampleTemplate.ExampleView())
+
+    try routes(app)
+}
+```
+
+### Request
+
+Now you can call the method *render* on the request in one of your controllers:
+
+```swift
+import Vapor
+
+final class ExampleController {
+
+    func getIndex(_ request: Request) async throws -> View {
+
+        /// 1. Name the layout
+        return try await request.view.render("ExampleTemplate.IndexView")
+    }
+}
+```