diff --git a/docs/src/components/SideBySide.astro b/docs/src/components/SideBySide.astro
index 6bc3ed745..e09806a61 100644
--- a/docs/src/components/SideBySide.astro
+++ b/docs/src/components/SideBySide.astro
@@ -16,8 +16,14 @@ function findImage(img: string) {
---
diff --git a/docs/src/content/docs/index.mdx b/docs/src/content/docs/index.mdx
index 0847265e6..d246d28ed 100644
--- a/docs/src/content/docs/index.mdx
+++ b/docs/src/content/docs/index.mdx
@@ -19,13 +19,17 @@ import ExternalLink from '../../components/ExternalLink.astro';
- [Text Prompts](/prompts): magical things you can do inside the text box
- - [Discord](https://discord.gg/pWyzHfHHhU)
- - 🗪 Discussions
- - 🐞 Issues
- - 📦 Release change log
+ - [ Discord](https://discord.gg/pWyzHfHHhU)
+ - Discussions
+ - Issues
+ - Release change log
Tutorials and videos made by users.
+ - _en_ [ Live & Regions](https://www.youtube.com/watch?v=czqCABRlbSA) by [@IntelligentImage](https://www.youtube.com/@IntelligentImage)
+ - _en_ [ Refine & ControlNet](https://www.youtube.com/watch?v=0vkZ9wvcZag) by [@nodonmai](https://www.youtube.com/@nodonmai)
+ - _en_ [ Krita AI Playlist](https://www.youtube.com/playlist?list=PLOea84sp_XoHZCSErUjCoqE0Gc6pjJksf) by [@streamtabulous](https://www.youtube.com/@streamtabulous)
+ - _es_ [ Introduction](https://www.youtube.com/watch?v=vxboB47oyqA&t=31s) by [@elussicreativo](https://www.youtube.com/@elussicreativo)
diff --git a/docs/src/content/docs/regions.mdx b/docs/src/content/docs/regions.mdx
index eea67d572..b8b220d90 100644
--- a/docs/src/content/docs/regions.mdx
+++ b/docs/src/content/docs/regions.mdx
@@ -107,8 +107,8 @@ Regions must be attached to paint layers or layer groups. When creating a new
region, it is linked to the active layer by default. If the active layer already
has a region, creating a new region will automatically create a new layer.
-The area covered by a region is defined by the pixel opacity of the linked it is
-linked to. Fully transparent pixels will not be affected.
+The area covered by a region is defined by the pixel opacity of the layer it is
+linked to. Fully transparent pixels are not affected by the region.
Selecting a region's text input will also make the linked layer active, and the
text focus will follow when switching layers. Regions can be removed with the
@@ -206,7 +206,7 @@ to the root region.
## Workflows
-This section describes some common workflows to get started. Once setup, regions
+This section describes some common workflows to get started. Once they are set up, regions
are flexible and multi-purpose. You can switch between and combine workflows!
### Regions from scratch
@@ -353,17 +353,18 @@ for the whole group without touching individual layers.
### Region hierarchies
Regions can be nested. When work starts on an image, the number of regions
-should be low and their size relative to the canvas relatively large. That's
-because regardless of your canvas resolution, initial generation will use a
-lower number of pixels and too many regions slow down computation a lot.
+should be low and their size relative to the canvas large. That's because
+regardless of your canvas resolution, initial generation will use a lower number
+of pixels and too many regions slow down computation a lot.
-As work continues, you might want to split up subjects or describe parts more
+As work continues, you might want to split up subjects, or describe parts more
precisely. Instead of creating further regions at the top level, you can add
sub-regions inside existing regions. This allows to manage complexity better:
* The UI shows text prompt and details for the current parent region and its
direct child regions. Other regions remain hidden.
* Generating the whole image will only use top-level regions. Refining a single
- region will make use of its child regions.
+ region will make use of its child regions. The total number of regions for
+ each generation remains manageable.
* Selections can apply the most relevant regions across the whole hierarchy
- (depending on coverage).
+ depending on coverage.
diff --git a/docs/src/styles/custom.css b/docs/src/styles/custom.css
index 1900aedbd..140dd2798 100644
--- a/docs/src/styles/custom.css
+++ b/docs/src/styles/custom.css
@@ -31,7 +31,7 @@
/* Light mode colors. */
:root[data-theme='light'] {
--sl-color-accent-low: rgb(240, 169, 142);
- --sl-color-accent: rgb(141, 90, 68);
+ --sl-color-accent: rgb(141, 83, 68);
--sl-color-accent-high: #4b1500;
--sl-color-white: #191817;
--sl-color-gray-1: #292624;
@@ -49,10 +49,15 @@
}
.front-cards {
- display: flex;
gap: 1rem;
}
+@media screen and (min-width: 800px) {
+ .front-cards {
+ display: flex;
+ }
+}
+
.front-cards ul {
list-style: none;
padding-left: 0;