Update documentation for Components icons (#1730)

* Add dark mode screenshots

* Update light mode screenshots

* Update screenshots calls in the text

* Mention search for icon when creating a new component

* Add crisper screenshots for components creation

* Mention icon is optional

Author: pwizla

docusaurus/docs/user-docs/content-manager/writing-content.md

@@ -82,8 +82,21 @@ Unlike regular fields, the order of the entries of a repeatable component is imp
 
 Dynamic zones are a combination of components, which themselves are composed of several fields. Writing the content of a dynamic zone requires additional steps in order to access the fields.
 
-<img src="/img/assets/content-manager/edit-view_dynamic-zone-1.png" alt="Writing content for a dynamic zone" width="80%" />
-<img src="/img/assets/content-manager/edit-view_dynamic-zone-2.png" alt="Writing content for a dynamic zone" width="80%" />
+<ThemedImage
+  alt="Writing content for a dynamic zone"
+  sources={{
+    light: '/img/assets/content-manager/edit-view_dynamic-zone-1.png',
+    dark: '/img/assets/content-manager/edit-view_dynamic-zone-1_DARK.png',
+  }}
+/>
+
+<ThemedImage
+  alt="Writing content for a dynamic zone"
+  sources={{
+    light: '/img/assets/content-manager/edit-view_dynamic-zone-2.png',
+    dark: '/img/assets/content-manager/edit-view_dynamic-zone-2_DARK.png',
+  }}
+/>
 
 1. Click on the ![Add icon](/img/assets/icons/add_circle.svg) **Add a component to [dynamic zone name]** button.
 2. Choose a component available for the dynamic zone.

docusaurus/docs/user-docs/content-type-builder/creating-new-content-type.md

@@ -40,7 +40,13 @@ New content-types are only considered created once they have been saved. Saving
 
 ## Creating a new component
 
-![Component creation](/img/assets/content-type-builder/component-creation-1.png)
+<ThemedImage
+  alt="Component creation"
+  sources={{
+    light: '/img/assets/content-type-builder/component-creation-1.png',
+    dark: '/img/assets/content-type-builder/component-creation-1_DARK.png',
+  }}
+/>
 
 Components are created from the same-named category of the Content-type Builder's sub navigation.
 
@@ -50,7 +56,7 @@ To create a new component:
 2. In the component creation window, configure the base settings of the new component:
    - Write the name of the component in the *Name* textbox.
    - Select an available category, or enter in the textbox a new category name to create one.
-   - Choose an icon to represent the new component.
+   - _(optional)_ Choose an icon representing the new component. You can use the search ![Search icon](/img/assets/icons/search.svg) to find an icon instead of scrolling through the list.
 3. Click on the **Continue** button.
 4. Add and configure chosen fields for your component (see [Configuring fields for content-types](/user-docs/content-type-builder/configuring-fields-content-type)).
 5. Click on the **Save** button.