update documentation

docs/docs/alterations/_category_.json

@@ -1,6 +1,6 @@
 {
     "label": "Available Methods",
-    "position": 3,
+    "position": 5,
     "collapsed": false,
     "link": {
         "type": "generated-index",

docs/docs/getting-started.md

@@ -4,40 +4,42 @@ sidebar_position: 1
 
 # Getting Started
 
-Get started by **creating a new site**.
+## Installation
 
-Or **try Docusaurus immediately** with **[docusaurus.new](https://docusaurus.new)**.
+Install the package from Composer:
 
-### What you'll need
+```bash
+composer require sergix44/imagezen
+```
 
-- [Node.js](https://nodejs.org/en/download/) version 16.14 or above:
-  - When installing Node.js, you are recommended to check all checkboxes related to dependencies.
+:::info
+ImageZen requires PHP 8.2 or higher.
+:::
 
-## Generate a new site
+## Basic Usage
 
-Generate a new Docusaurus site using the **classic template**.
+Basically all you need to do is to create an instance of the `Image` class:
 
-The classic template will automatically be added to your project after you run the command:
+```php
+use SergiX44\ImageZen\Image;
 
-```bash
-npm init docusaurus@latest my-website classic
+$image = Image::make('path/to/image.jpg');
 ```
 
-You can type this command into Command Prompt, Powershell, Terminal, or any other integrated terminal of your code editor.
-
-The command also installs all necessary dependencies you need to run Docusaurus.
+Basically almost every method call returns the same instance, so you can chain them:
 
-## Start your site
+```php
 
-Run the development server:
+use SergiX44\ImageZen\Image;
+use SergiX44\ImageZen\Format;
 
-```bash
-cd my-website
-npm run start
+$image = Image::make('path/to/image.jpg')
+    ->resize(300, 200)
+    ->greyscale()
+    ->blur(10);
+
+$image->save('path/to/destination.png', Format::PNG);
+$mime = $image->mime();
 ```
 
-The `cd` command changes the directory you're working with. In order to work with your newly created Docusaurus site, you'll need to navigate the terminal there.
-
-The `npm run start` command builds your website locally and serves it through a development server, ready for you to view at http://localhost:3000/.
-
-Open `docs/intro.md` (this page) and edit some lines: the site **reloads automatically** and displays your changes.
+You can see all the available methods in the [API Reference](/docs/category/available-methods).

docs/docs/supported-formats.md

@@ -0,0 +1,74 @@
+---
+sidebar_position: 2
+---
+
+# Backends
+
+ImageZen supports two backends: GD and Imagick.
+Those are listed in the `SergiX44\ImageZen\Backend` enum.
+
+- `Backend::GD`
+- `Backend::IMAGICK`
+
+The default backend is `Backend::GD`, but you can change it by setting the second parameter
+of the `Image::make()` method or the `Image::canvas()` method.
+
+```php
+use SergiX44\ImageZen\Image;
+use SergiX44\ImageZen\Backend;
+
+// by default is GD
+$image = Image::make('path/to/image.jpg');
+$image = Image::canvas(300, 200);
+
+// -> same as
+$image = Image::make('path/to/image.jpg', Backend::GD);
+$image = Image::canvas(300, 200, Backend::GD);
+
+// for imagick
+$image = Image::make('path/to/image.jpg', Backend::IMAGICK);
+$image = Image::canvas(300, 200, Backend::IMAGICK);
+```
+
+## Supported Formats
+
+All the available formats are listed in the `SergiX44\ImageZen\Format` enum,
+here is a list of them, and the supported backends:
+
+| Format         | GD | Imagick |
+|----------------|----|:-------:|
+| `Format::PNG`  | ✔  |    ✔    |
+| `Format::JPEG` | ✔  |    ✔    |
+| `Format::WEBP` | ✔  |    ✔    |
+| `Format::GIF`  | ✔  |    ✔    |
+| `Format::BMP`  | ✔  |    ✔    |
+| `Format::TIFF` | ❌  |    ✔    |
+| `Format::HEIC` | ✔  |    ✔    |
+| `Format::AVIF` | ✔  |    ✔    |
+
+Imagick supports more formats than GD, but it's not available by default in most PHP installations.
+It's also marginally faster than GD, but it's not noticeable in most cases.
+
+## Colors
+
+ImageZen supports different color formats as input, managed by the `SergiX44\ImageZen\Color` class, here an example:
+They gets automatically converted to the backend format, so you don't have to worry about it.
+
+```php
+use SergiX44\ImageZen\Draws\Color;
+
+$color = Color::from('#ff0000');
+$color = Color::from('#f00');
+
+$color = Color::rgb(255, 0, 0);
+$color= Color::rgba(255, 0, 0, 0.5);
+
+
+// has also a variety of built-in colors
+$color = Color::transparent();
+$color = Color::black();
+$color = Color::white();
+$color = Color::red();
+// ...
+
+```

docs/docusaurus.config.js

@@ -42,14 +42,14 @@ const config = {
                     // Please change this to your repo.
                     // Remove this to remove the "edit this page" links.
                     editUrl:
-                        'https://github.com/sergix44/imagezen/tree/master/docs/docs/',
+                        'https://github.com/sergix44/imagezen/tree/master/docs/',
                 },
                 blog: {
                     showReadingTime: true,
                     // Please change this to your repo.
                     // Remove this to remove the "edit this page" links.
                     editUrl:
-                        'https://github.com/sergix44/imagezen/tree/master/docs/blog/',
+                        'https://github.com/sergix44/imagezen/tree/master/docs/',
                 },
                 theme: {
                     customCss: require.resolve('./src/css/custom.css'),

docs/src/css/custom.css

@@ -6,25 +6,25 @@
 
 /* You can override the default Infima variables here. */
 :root {
-    --ifm-color-primary: #C96856;
-    --ifm-color-primary-dark: #A05348;
-    --ifm-color-primary-darker: #805239;
-    --ifm-color-primary-darkest: #60442A;
-    --ifm-color-primary-light: #D57F6D;
-    --ifm-color-primary-lighter: #E89C8D;
-    --ifm-color-primary-lightest: #F8BAA8;
+    --ifm-color-primary: #242D40;
+    --ifm-color-primary-dark: #1A1F2A;
+    --ifm-color-primary-darker: #111521;
+    --ifm-color-primary-darkest: #0B0F19;
+    --ifm-color-primary-light: #394356;
+    --ifm-color-primary-lighter: #4C576B;
+    --ifm-color-primary-lightest: #667288;
   --ifm-code-font-size: 95%;
   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
 }
 
 /* For readability concerns, you should choose a lighter palette in dark mode. */
 [data-theme='dark'] {
-    --ifm-color-primary: #A05348;
-    --ifm-color-primary-dark: #80473D;
-    --ifm-color-primary-darker: #663A31;
-    --ifm-color-primary-darkest: #4F2E26;
-    --ifm-color-primary-light: #B95F54;
-    --ifm-color-primary-lighter: #D27569;
-    --ifm-color-primary-lightest: #E89C8D;
+    --ifm-color-primary: #4B5D69;
+    --ifm-color-primary-dark: #3C4B55;
+    --ifm-color-primary-darker: #2E3A41;
+    --ifm-color-primary-darkest: #232B32;
+    --ifm-color-primary-light: #5A6E7A;
+    --ifm-color-primary-lighter: #6B7E8A;
+    --ifm-color-primary-lightest: #80959F;
   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
 }