Merge pull request #164 from Jaczkulinek/master

honzakostejn · web-flow · commit c1005e5af0aa · 2025-07-02T14:03:54.000+02:00
Adding visual examples
diff --git a/src/en/customizer-guide/index.md b/src/en/customizer-guide/index.md
@@ -1,5 +1,5 @@
 ---
-author: Ondrej Juda
+Author: Ondrej Juda
 ---
 
 Hello! This customizer documentation is here to help you with configuring and customizing TALXIS applications, so they would work as they were designed.
diff --git a/src/en/customizer-guide/modules/contract/configure-contract-review-and-approval.md b/src/en/customizer-guide/modules/contract/configure-contract-review-and-approval.md
@@ -1,5 +1,5 @@
 ---
-author: Ondrej Juda
+Author: Ondrej Juda
 ---
 
 # Configure contract review and approval
diff --git a/src/en/customizer-guide/modules/contract/configure-processes.md b/src/en/customizer-guide/modules/contract/configure-processes.md
@@ -1,5 +1,5 @@
 ---
-author: Ondrej Juda
+Author: Ondrej Juda
 ---
 
 # Configure processes
diff --git a/src/en/customizer-guide/modules/procurement/procurement-approvals-configuration.md b/src/en/customizer-guide/modules/procurement/procurement-approvals-configuration.md
@@ -1,5 +1,5 @@
 ---
-author: Timotej Paluš
+Author: Timotej Paluš
 ---
 
 # Approvals Configuration
diff --git a/src/en/customizer-guide/preparing-content.md b/src/en/customizer-guide/preparing-content.md
@@ -1,5 +1,5 @@
 ---
-author: Ondrej Juda
+Author: Ondrej Juda
 ---
 
 We are preparing this content
diff --git a/src/en/developer-guide/applications/controls/FileExplorer/general.md b/src/en/developer-guide/applications/controls/FileExplorer/general.md
@@ -4,6 +4,12 @@ Author: David Wasserbauer
 
 # File Explorer
 
+## Visual example
+
+<iframe style="border: 0px solid rgba(0, 0, 0, 1);   border-radius: 10px;" width="730" height="600" src="https://embed.figma.com/proto/CIf7LPbQa9gZTMTiH1e07g/NETWORG-Web-UI-Master?page-id=1848%3A5268&node-id=1849-9248&viewport=-499%2C519%2C0.33&scaling=scale-down&content-scaling=fixed&starting-point-node-id=1849%3A9248&embed-host=share" allowfullscreen></iframe>
+
+## Description
+
 Welcome to the documentation for our cutting-edge File Explorer control! 
 
 The File Explorer control is built on the foundations of the File Picker control. This means that you can find similar functionality, but it is essentially a much more powerful version of the File Picker.
diff --git a/src/en/developer-guide/applications/controls/VirtualDataset/general.md b/src/en/developer-guide/applications/controls/VirtualDataset/general.md
@@ -3,6 +3,12 @@ Author: Dominik Brych
 ---
 # Virtual Dataset
 
+## Visual Example
+
+<iframe style="border: 0px solid rgba(0, 0, 0, 1);   border-radius: 10px;" width="730" height="600" src="https://embed.figma.com/proto/CIf7LPbQa9gZTMTiH1e07g/NETWORG-Web-UI-Master?page-id=3654%3A12560&node-id=3654-16688&viewport=136%2C185%2C0.19&scaling=scale-down&content-scaling=fixed&starting-point-node-id=3654%3A16688&embed-host=share" allowfullscreen></iframe>
+
+## Description
+
 Virtual Dataset allows you to bind a Dataset Base Control to a field while providing your own custom Data Source. We currently have two Data Providers - Memory and FetchXml. Memory Provider allows you to work with a collection of data that you have stored in memory and FetchXml Provider allows you to do the same thing with data retrieved through FetchXml. Both of these providers support basic Dataset features, which include:
 
 - **Sorting**
diff --git a/src/en/developer-guide/applications/controls/addresspicker.md b/src/en/developer-guide/applications/controls/addresspicker.md
@@ -6,7 +6,7 @@ Author: Jan Losenicky
 
 ## Visual Example
 
-![Address Picker Displayed On Form](/.attachments/applications/Controls/addresspickercontrol.png)
+<iframe style="border: 0px solid rgba(0, 0, 0, 1);   border-radius: 10px;" width="730" height="600" src="https://embed.figma.com/proto/CIf7LPbQa9gZTMTiH1e07g/NETWORG-Web-UI-Master?page-id=1531%3A8208&node-id=1531-8209&viewport=365%2C414%2C0.24&scaling=scale-down&content-scaling=fixed&starting-point-node-id=1531%3A8209&embed-host=share" allowfullscreen>
 
 ## Description
 
diff --git a/src/en/developer-guide/applications/controls/announcementcard.md b/src/en/developer-guide/applications/controls/announcementcard.md
@@ -3,12 +3,15 @@ Author: Mirza Kobasevic
 ---
 # Announcement Card
 
-This control serves to display basic information in the form of a card.
+## Visual example
 
 <img src='/.attachments/applications/Controls/announcementcard.png'  />
 
+## Description
+
+This control serves to display basic information in the form of a card.
 
-Bindings
+## Bindings
 
 <table>
   <thead>
diff --git a/src/en/developer-guide/applications/controls/attachmentsgrid.md b/src/en/developer-guide/applications/controls/attachmentsgrid.md
diff --git a/src/en/developer-guide/applications/controls/colorpicker.md b/src/en/developer-guide/applications/controls/colorpicker.md
@@ -3,10 +3,13 @@ Author: Dominik Brych
 ---
 # Color Picker
 
-Color Picker enables users to select a color through an interactive palette. Additionally, users can directly input a valid RGB, HEX, or color string into the field. If an invalid color is entered, an error message will be displayed, and the invalid value will not be propagated to the framework. 
+## Visual example
+
+<iframe style="border: 0px solid rgba(0, 0, 0, 1);   border-radius: 10px;" width="730" height="600" src="https://embed.figma.com/proto/CIf7LPbQa9gZTMTiH1e07g/NETWORG-Web-UI-Master?page-id=3578%3A2513&node-id=3578-4408&p=f&viewport=2506%2C1783%2C0.27&scaling=scale-down&content-scaling=fixed&starting-point-node-id=3578%3A4408&embed-host=share" allowfullscreen></iframe>
 
-<img src='/.attachments/applications/Controls/colorpicker.png' width="300px" />
+## Description
 
+Color Picker enables users to select a color through an interactive palette. Additionally, users can directly input a valid RGB, HEX, or color string into the field. If an invalid color is entered, an error message will be displayed, and the invalid value will not be propagated to the framework. 
 
 ## Bindings
 
diff --git a/src/en/developer-guide/applications/controls/companyprofilehinting.md b/src/en/developer-guide/applications/controls/companyprofilehinting.md
@@ -6,8 +6,7 @@ Author: Jan Losenicky
 
 ## Visual Example
 
-![Company Profile Hinting Displayed On Form](/.attachments/applications/Controls/companyprofilehintingcontrol.png)
-
+<iframe style="border: 0px solid rgba(0, 0, 0, 1);   border-radius: 10px;" width="730" height="600" src="https://embed.figma.com/proto/CIf7LPbQa9gZTMTiH1e07g/NETWORG-Web-UI-Master?page-id=1674%3A6023&node-id=1674-6024&viewport=604%2C531%2C0.24&scaling=scale-down&content-scaling=fixed&starting-point-node-id=1674%3A6024&embed-host=share" allowfullscreen></iframe>
 
 ## Description
 
diff --git a/src/en/developer-guide/applications/controls/emaildesigner.md b/src/en/developer-guide/applications/controls/emaildesigner.md
@@ -4,26 +4,26 @@ Author: Adel Šabić
 
 # Email Designer
 
-# Visual Example
+## Visual Example
 
 ![Email Designer Displayed On Form](/.attachments/applications/Controls/emaildesigner.png)
 
-# Description
+## Description
 
 This control is used to design custom email templates. It uses very user friendly email editor to achieve that. It auto saves changes to file on same entity so you are able to export HTML file of template you made.
 
-# Limitations
+## Limitations
 
 If you want to import pictures, you need to import it in base64 format.
 
 ![Email Designer Image Import](/.attachments/applications/Controls/emaildesignerimageimport.png)
 
 Also, don't forget to 1000000 since email editor component produces quite some metadata.
 
-# Binding Field
+## Binding Field
 
 Control can be binded to any field on form of type Multiple.
 
-# Inputs
+## Inputs
 
 - File Attribute (SingleLine.Text) - Name of the attribute where HTML file will be saved
diff --git a/src/en/developer-guide/applications/controls/emailpicker.md b/src/en/developer-guide/applications/controls/emailpicker.md
@@ -4,21 +4,21 @@ Author: Jan Losenicky
 
 # Email Picker
 
-# Visual Example
+## Visual Example
 
-![Email Picker Displayed On Form](/.attachments/applications/Controls/emailpickercontrol.png)
+<iframe style="border: 0px solid rgba(0, 0, 0, 1);   border-radius: 10px;" width="730" height="600" src="https://embed.figma.com/proto/CIf7LPbQa9gZTMTiH1e07g/NETWORG-Web-UI-Master?page-id=1787%3A6793&node-id=1787-6794&viewport=660%2C951%2C0.73&scaling=scale-down&content-scaling=fixed&starting-point-node-id=1787%3A6794&embed-host=share" allowfullscreen></iframe>
 
-# Description
+## Description
 
 This control is used to enter an emails in field. It is checking the format of email and also there is a function to verify the email.
 
 ![Email Picker Displayed On Form](/.attachments/applications/Controls/emailpickerverifying.png)
 
-# Binding Field
+## Binding Field
 
 Control can be binded to any field on form of type SingleLine.Text.
 
-# Inputs
+## Inputs
 
 - Min Mail Count - Minimum of emails imputed
 - Max Mail Count - Maximum of emails that can be imputed
diff --git a/src/en/developer-guide/applications/controls/formbutton.md b/src/en/developer-guide/applications/controls/formbutton.md
@@ -1,10 +1,10 @@
 ---
-author: Jan Losenicky
+Author: Jan Losenicky
 ---
 
 # Form Button
 
-## Displayed on form
+## Visual Example
 
 ![Displayed Form Button Control](/.attachments/applications/Controls/formbuttoncontrol.png)
 
diff --git a/src/en/developer-guide/applications/controls/general.md b/src/en/developer-guide/applications/controls/general.md
@@ -14,6 +14,8 @@ PCF - PowerApps Component Framework helps creating customized reusable component
 
 [Microsoft Docs](https://docs.microsoft.com/en-us/powerapps/developer/component-framework/overview)
 
+[FIGMA Talxis PCF preview](https://www.figma.com/proto/CIf7LPbQa9gZTMTiH1e07g/NETWORG-Web-UI-Master?page-id=797%3A14942&node-id=1426-7570&viewport=1452%2C1062%2C0.49&t=9jixO6YZBPra2kZn-1&scaling=scale-down&content-scaling=fixed&starting-point-node-id=1426%3A7570&show-proto-sidebar=1)
+
 ## How to get custom control into model-driven application?
 
 First step is to import the solution with your custom control to your environment.
diff --git a/src/en/developer-guide/applications/controls/infocard.md b/src/en/developer-guide/applications/controls/infocard.md
@@ -3,13 +3,16 @@ Author: Mirza Kobasevic
 ---
 # Info Card
 
-This control displays basic contact/account information in the form of a card. If control is bound for SingleLine.Text, it displays information of the current user/account. By binding the control to the lookup field, it is possible to display the information of any contact/account.
-
+## Visual Example
 
 <img src='/.attachments/applications/Controls/InfoCard/accountinfocard.png' height='300px' />
 <img src='/.attachments/applications/Controls/InfoCard/contactinfocard.png' height='300px' />
 
-# Bindings
+## Description
+
+This control displays basic contact/account information in the form of a card. If control is bound for SingleLine.Text, it displays information of the current user/account. By binding the control to the lookup field, it is possible to display the information of any contact/account.
+
+## Bindings
 
 <table>
   <thead>
diff --git a/src/en/developer-guide/applications/controls/invoicerecognition.md b/src/en/developer-guide/applications/controls/invoicerecognition.md
@@ -3,10 +3,14 @@ Author: Jan Losenicky
 ---
 # Invoice Recognition
 
-This control displays the Correction UI component feature developed by Konica Minolta which enables you to verify data with the customer register and the rendered invoice and to modify the extracted data from Invoice Miner. Invoice Miner is a cloud-based extraction service that withdraws data from invoices and converts the data into structured JSON content.
+## Visual Example
 
 <img src='/.attachments/applications/Controls/InvoiceRecognition/invoicerecognition-preview.png' />
 
+## Description
+
+This control displays the Correction UI component feature developed by Konica Minolta which enables you to verify data with the customer register and the rendered invoice and to modify the extracted data from Invoice Miner. Invoice Miner is a cloud-based extraction service that withdraws data from invoices and converts the data into structured JSON content.
+
 This control is also providing a communication between Power Apps (dataverse) and Correction UI which allows us to verify the customer/supplier with the the existing records in database, trigger creation of new records and create a new invoice record after accepting the extracted data.
 
 Control strongly relies on `talxis_purchaseinvoiceheader` and `talxis_purchaseinvoicedetail` entities which records are created after accepting the data.
diff --git a/src/en/developer-guide/applications/controls/mappicker.md b/src/en/developer-guide/applications/controls/mappicker.md
@@ -1,12 +1,12 @@
 ---
-author: Jan Losenicky
+Author: Jan Losenicky
 ---
 
 # Map Picker
 
 ## Visual Example
 
-![Displayed Map Picker On Form](/.attachments/applications/Controls/mappickercontrol.png)
+<iframe style="border: 0px solid rgba(0, 0, 0, 1);   border-radius: 10px;" width="730" height="600" src="https://embed.figma.com/proto/CIf7LPbQa9gZTMTiH1e07g/NETWORG-Web-UI-Master?page-id=2006%3A3360&node-id=2006-6922&viewport=2705%2C1824%2C0.28&scaling=scale-down&content-scaling=fixed&starting-point-node-id=2006%3A6922&embed-host=share" allowfullscreen></iframe>
 
 ## Description
 
diff --git a/src/en/developer-guide/applications/controls/phonepicker.md b/src/en/developer-guide/applications/controls/phonepicker.md
@@ -4,19 +4,19 @@ Author: Jan Losenicky
 
 # Phone Picker
 
-# Visual Example
+## Visual Example
 
-![Email Picker Displayed On Form](/.attachments/applications/Controls/phonepickercontrol.png)
+<iframe style="border: 0px solid rgba(0, 0, 0, 1);   border-radius: 10px;" width="730" height="600" src="https://embed.figma.com/proto/CIf7LPbQa9gZTMTiH1e07g/NETWORG-Web-UI-Master?page-id=1791%3A46036&node-id=2710-7449&viewport=582%2C682%2C0.29&scaling=scale-down&content-scaling=fixed&starting-point-node-id=2710%3A7449&embed-host=share" allowfullscreen></iframe>
 
-# Description
+## Description
 
 This control is used to enter a phone number in field. It is checking the format of phone and also there is a function to verify the phone.
 
-# Binding Field
+## Binding Field
 
 Control can be binded to field of type SingleLine.Phone, SingleLine.Text and SingleLine.
 
-# Inputs
+## Inputs
 
 - Default Country Code - Set to "CZ" by default.
 - Place Holder Message - Default vaule is "---"
diff --git a/src/en/developer-guide/getting-started/devkit/troubleshooting.md b/src/en/developer-guide/getting-started/devkit/troubleshooting.md
@@ -1,5 +1,5 @@
 ---
-author: David Wasserbauer
+Author: David Wasserbauer
 ---
 
 # TALXIS DevKit Troubleshooting
diff --git a/src/en/developer-guide/index.md b/src/en/developer-guide/index.md
@@ -1,5 +1,5 @@
 ---
-author: Tomas Prokop
+Author: Tomas Prokop
 ---
 
 # Introduction
diff --git a/src/en/developer-guide/platform/pipelines/appuser.md b/src/en/developer-guide/platform/pipelines/appuser.md
@@ -1,7 +1,7 @@
 ---
 title: Automated App User Import
 tagline: Setting up a pipeline for automated deploy of appuser
-author: Zdeněk Šrejber
+Author: Zdeněk Šrejber
 ---
 
 # **The set up**
diff --git a/src/en/developer-guide/platform/pipelines/deploy.md b/src/en/developer-guide/platform/pipelines/deploy.md
@@ -1,7 +1,7 @@
 ---
 title: Deploy Pipeline
 tagline: Creating a deploy pipeline for a project
-author: Zdeněk Šrejber
+Author: Zdeněk Šrejber
 ---
 
 # **Creating a deploy pipeline for a project**
diff --git a/src/en/developer-guide/preparing-content.md b/src/en/developer-guide/preparing-content.md
@@ -1,5 +1,5 @@
 ---
-author: Tomas Prokop
+Author: Tomas Prokop
 ---
 
 We are preparing this content
diff --git a/src/en/user-guide/index.md b/src/en/user-guide/index.md
@@ -1,5 +1,5 @@
 ---
-author: Timotej Paluš
+Author: Timotej Paluš
 ---
 
 # User guide
diff --git a/src/en/user-guide/model-driven-apps/business-process/contact-management/track-and-manage-activities.md b/src/en/user-guide/model-driven-apps/business-process/contact-management/track-and-manage-activities.md
@@ -1,5 +1,5 @@
 ---
-author: Timotej Paluš
+Author: Timotej Paluš
 ---
 
 # Track and manage activities
diff --git a/src/en/user-guide/model-driven-apps/business-process/contact-management/use-accounts.md b/src/en/user-guide/model-driven-apps/business-process/contact-management/use-accounts.md
@@ -1,5 +1,5 @@
 ---
-author: Timotej Paluš
+Author: Timotej Paluš
 ---
 
 # Use accounts to manage customer companies
diff --git a/src/en/user-guide/model-driven-apps/business-process/contact-management/use-contacts.md b/src/en/user-guide/model-driven-apps/business-process/contact-management/use-contacts.md
@@ -1,5 +1,5 @@
 ---
-author: Timotej Paluš
+Author: Timotej Paluš
 ---
 
 # Use contacts to manage customer people
diff --git a/src/en/user-guide/preparing-content.md b/src/en/user-guide/preparing-content.md
@@ -1,5 +1,5 @@
 ---
-author: Tomas Prokop
+Author: Tomas Prokop
 ---
 
 We are preparing this content
