Update image names in docs

docs/README.md

@@ -6,15 +6,14 @@ DevsCard is a fully customizable template to create your online resume without w
 
 Apart from the website template, DevsCard offers you plenty of additional features that will make it easier to take care of your online and offline presence, including:
 
-* **✍️ Intellisense** — provide your data in TypeScript files, getting autocompletion and description of each property right in your IDE.
+- **✍️ Intellisense** — provide your data in TypeScript files, getting autocompletion and description of each property right in your IDE.
-* **📱 Responsiveness** — the resume is created and automatically tested to look great on mobile and desktop devices.
+- **📱 Responsiveness** — the resume is created and automatically tested to look great on mobile and desktop devices.
-* **🌠 Assets optimization** — all images in your CV are minimized and resized automatically at build time.
+- **🌠 Assets optimization** — all images in your CV are minimized and resized automatically at build time.
-* **⚡️ Performance** — get 100 for all Lighthouse metrics, ensuring a great experience for visitors and a high score for search engines.
+- **⚡️ Performance** — get 100 for all Lighthouse metrics, ensuring a great experience for visitors and a high score for search engines.
-* **📄 PDF generation** — generate an accompanying PDF version of your CV with one command.
+- **📄 PDF generation** — generate an accompanying PDF version of your CV with one command.
-* **🔶 Built-in icon sets** — choose from over 100 000 [Iconify](https://iconify.design/) icons to represent your skills.
+- **🔶 Built-in icon sets** — choose from over 100 000 [Iconify](https://iconify.design/) icons to represent your skills.
-* **🌍 I18n** — customize your resume's locale, date formatting, and used translations.
+- **🌍 I18n** — customize your resume's locale, date formatting, and used translations.
-* **🔎 SEO friendly** — the entire website is designed with SEO in mind. All SEO-related config properties are required and well-described.
+- **🔎 SEO friendly** — the entire website is designed with SEO in mind. All SEO-related config properties are required and well-described.
-* **🏭 Favicons generation** — invoke one command to generate all favicons and full app manifest for your website.
+- **🏭 Favicons generation** — invoke one command to generate all favicons and full app manifest for your website.
-* **🛠 Data helpers** — use built-in helpers to define your skills/socials once and reuse them across the configuration.
+- **🛠 Data helpers** — use built-in helpers to define your skills/socials once and reuse them across the configuration.
-* **🔀 Data transformers** — utilize type-safe data transformers to create multiple variants of your resume without duplicating your data.
+- **🔀 Data transformers** — utilize type-safe data transformers to create multiple variants of your resume without duplicating your data.
-

docs/quick-setup-guide.md

@@ -4,11 +4,11 @@
 
 1\. Create a fork of the [project repository](https://github.com/KonradSzwarc/devscard).
 
-<figure><img src=".gitbook/assets/CleanShot 2023-01-28 at 14.04.20@2x.png" alt=""><figcaption></figcaption></figure>
+<figure><img src=".gitbook/assets/fork-repository.png" alt=""><figcaption></figcaption></figure>
 
 2\. Go to the forked repository and clone it to your local machine.
 
-<figure><img src=".gitbook/assets/CleanShot 2023-01-28 at 14.08.09@2x.png" alt=""><figcaption></figcaption></figure>
+<figure><img src=".gitbook/assets/clone-repository.png" alt=""><figcaption></figcaption></figure>
 
 3\. Open the cloned project in your IDE of choice and run `npm install`.
 
@@ -20,18 +20,18 @@
 
 To fill the CV with your data, go to the `src/data` directory. There you should focus on three places:
 
-* `config.ts` — use it to provide metadata of your website and set up its locales.
+- `config.ts` — use it to provide metadata of your website and set up its locales.
-* `sections` — contains files with data for each section of the resume.
+- `sections` — contains files with data for each section of the resume.
-* `helpers` — helper functions you can utilize to reduce the amount of repetitiveness when setting up your socials and skills.
+- `helpers` — helper functions you can utilize to reduce the amount of repetitiveness when setting up your socials and skills.
-  * `links.ts` — functions that ensure you always use the same icon and name when providing links to external websites. We provide the most popular socials out-of-the-box, so there is a chance you won't edit anything in this file.
+  - `links.ts` — functions that ensure you always use the same icon and name when providing links to external websites. We provide the most popular socials out-of-the-box, so there is a chance you won't edit anything in this file.
-  * `skills.ts` — one place where you define your skills to reuse them in multiple sections. You can remove the skills used in the example template and replace them with your own.
+  - `skills.ts` — one place where you define your skills to reuse them in multiple sections. You can remove the skills used in the example template and replace them with your own.
 
 #### **Tips**
 
-* You can hover over each configuration property to get its description.
+- You can hover over each configuration property to get its description.
-  * Some property descriptions start with `[WEB]` or `[PDF]`. It means those properties are used only in the web/pdf version of the resume.
+  - Some property descriptions start with `[WEB]` or `[PDF]`. It means those properties are used only in the web/pdf version of the resume.
-* Although you can provide URLs for images, we highly recommend putting all images in the `src/assets` directory and importing them using the `import` statement. This way, images will be auto-optimized, so you won't have to worry about their dimensions.
+- Although you can provide URLs for images, we highly recommend putting all images in the `src/assets` directory and importing them using the `import` statement. This way, images will be auto-optimized, so you won't have to worry about their dimensions.
-  * To know the aspect ratio of an image, hover over the `image` property.
+  - To know the aspect ratio of an image, hover over the `image` property.
 
 ## 3. Generate PDF (optional)
 
@@ -49,22 +49,22 @@ As the resume is entirely static, you can deploy it to any hosting provider. In
 
 3\. Go to the "Sites" tab and choose "Import from Git".
 
-<figure><img src=".gitbook/assets/CleanShot 2023-01-28 at 16.16.16@2x.png" alt=""><figcaption></figcaption></figure>
+<figure><img src=".gitbook/assets/netlify-import-project.png" alt=""><figcaption></figcaption></figure>
 
 4\. Connect Netlify with your GitHub account.
 
-<figure><img src=".gitbook/assets/CleanShot 2023-01-28 at 16.21.01@2x.png" alt=""><figcaption></figcaption></figure>
+<figure><img src=".gitbook/assets/netlify-connect-github.png" alt=""><figcaption></figcaption></figure>
 
 5\. Pick a repository with your forked project
 
-<figure><img src=".gitbook/assets/CleanShot 2023-01-28 at 16.22.45@2x.png" alt=""><figcaption></figcaption></figure>
+<figure><img src=".gitbook/assets/netlify-pick-repository.png" alt=""><figcaption></figcaption></figure>
 
 6\. On the last step, go with the default settings suggested by Netlify and click "Deploy site".
 
-<figure><img src=".gitbook/assets/CleanShot 2023-01-28 at 16.26.29@2x (1).png" alt=""><figcaption></figcaption></figure>
+<figure><img src=".gitbook/assets/netlify-build-settings.png" alt=""><figcaption></figcaption></figure>
 
 7\. After around one minute, your resume will be live 🎉
 
-<figure><img src=".gitbook/assets/CleanShot 2023-01-28 at 16.28.33@2x.png" alt=""><figcaption></figcaption></figure>
+<figure><img src=".gitbook/assets/netlify-deployed-site.png" alt=""><figcaption></figcaption></figure>
 
 From now on, each push to `main` branch will cause redeploy of the Netlify website. You may want to go to the "Site settings" tab to update your site name or even [set up your domain](https://youtu.be/bY7Tkh9Vz8I).