Merge pull request #150 from NGO-Algorithm-Audit/feature/structural_edits

Tool to NL version webpage

Author: jfparie

content/english/technical-tools/implementation-tool.md

@@ -15,18 +15,6 @@ subtitle: >
   [Github](https://github.com/NGO-Algorithm-Audit/AlgorithmAudit_website) or via
   [[email protected]](mailto:[email protected]).
 image: /images/svg-illustrations/case_repository.svg
-overview_block:
-  - title: Identification of AI-systems and high-risk algorithms
-    content: >
-      By answering maximum 8 targeted questions, you can determine whether a
-      data-driven application qualifies as an AI-system or as an impactful
-      algorithm. Complete the dynamic questionnaire to find out.
-    icon: fas fa-search
-    id: quick-scan
-    items:
-      - title: Identify
-        icon: fas fa-star
-        link: classification-quick-scan/#form
 ---
 
 {{< webapp id="webapp" appId="AIActImplementationTool" src="https://ai-documentation.s3.eu-central-1.amazonaws.com/AI-Act-Questionnaire-v1.0.0.js" title="" >}}

content/nederlands/technical-tools/implementation-tool.md

@@ -1,44 +1,70 @@
 ---
 type: regular
-title: Documentatie voor AI-systemen
+title: Documentation for AI-systems
 subtitle: >
-  Open-source templates voor modeldocumentatie. Afgestemd op de eisen uit de AI
-  Verordening en Nederlandse soft law kaders, zoals het [Onderzoekskader
-  Algoritmes](https://www.rijksoverheid.nl/documenten/rapporten/2023/07/11/onderzoekskader-algoritmes-adr-2023#:~:text=De%20Auditdienst%20Rijk%20heeft%20een,risico's%20beheerst%20\(kunnen\)%20worden.)
-  van de Audit Dienst Rijk, het
-  [Algoritmekader](https://minbzk.github.io/Algoritmekader/) van het Ministerie
-  van Binnenlandse Zaken en de Impact Assessment Mensenrechten en Algoritmes
+  Open-source templates voor modeldocumentatie. Afgestemd op de eisen uit de AI Verordening en Nederlandse soft law kaders, zoals het [Onderzoekskader
+  algoritmes](https://www.rijksoverheid.nl/documenten/rapporten/2023/07/11/onderzoekskader-algoritmes-adr-2023#:~:text=De%20Auditdienst%20Rijk%20heeft%20een,risico's%20beheerst%20\(kunnen\)%20worden.)
+  van de Audit Dienst Rijk, het [Algoritmekader
+  ](https://minbzk.github.io/Algoritmekader/) van het Ministerie van Binnenlandse Zaken en de Impact Assessment Mensenrechten en Algoritmes
   ([IAMA](https://www.rijksoverheid.nl/documenten/rapporten/2021/02/25/impact-assessment-mensenrechten-en-algoritmes)).
 
 
   Help mee ontwikkelen, deel feedback middels
   [Github](https://github.com/NGO-Algorithm-Audit/AlgorithmAudit_website) of via
   [[email protected]](mailto:[email protected]).
 image: /images/svg-illustrations/case_repository.svg
-overview_block:
-  - title: Identificatie van AI systemen en impactvolle algoritmes
-    content: >
-      Aan de hand van maximaal 7 vragen kun je al een gedegen inschatting maken
-      of een datagedreven toepassing een AI systeem of impactvol algoritme
-      betreft. Vul de dynamische vragenlijst in.
-    icon: fas fa-search
-    id: quick-scan
-    items:
-      - title: Identificeer
-        icon: fas fa-star
-        link: classification-quick-scan/#form
 ---
 
-{{< container_open icon="fas fa-wrench" title="Documentatie en classificatie tool" id="landing-container" >}}
+{{< webapp id="webapp" appId="AIActImplementationTool" src="https://ai-documentation.s3.eu-central-1.amazonaws.com/AI-Act-Questionnaire-v1.0.0.js" title="" >}}
 
-Maak gebruik van dynamische vragenlijsten om algoritmes en AI systemen te documenten en classificeren.
+<style>
+    /* Targeting the first direct div inside #AIActImplementationTool */
+    #AIActImplementationTool > div:first-child {
+        height: auto!important;
+        padding: 12px;
+    }
 
-* [Identificatie van AI systemen en impactvolle algoritmes (max. 7 vragen)](#quick-scan)
+    /* Styling for form-group elements inside #AIActImplementationTool */
+    #AIActImplementationTool .form-group {
+        display: block;
+    }
 
-{{< container_close >}}
+    /* Styling color output area inside #AIActImplementationTool */
+    #AIActImplementationTool .card-body .bg-primary {
+        background-color: #F8E5E3;
+    }
 
-{{< overview_block index="0" >}}
+    /* Styling for form-group elements header labels inside #AIActImplementationTool */
+    #AIActImplementationTool .form-group .form-label {
+        margin-left: 0;
+        color: black;
+    }
 
-<!-- {{< overview_block index="1" >}}
+    /* Styling for form-group elements labels inside #AIActImplementationTool */
+    #AIActImplementationTool .form-group label {
+        color: black;
+    }
 
-{{< overview_block index="2" >}} -->
+    /* Styling for intermediate-output labels in #AIActImplementationTool */
+    #AIActImplementationTool .intermediate-output label {
+        font-weight: 700;
+    }
+
+    /* Styling for intermediate-output textareas in #AIActImplementationTool */
+    #AIActImplementationTool .intermediate-output textarea {
+        border: none;
+        background-color: transparent;
+        resize: none;
+        width: 100%;
+        height: auto;
+        padding: 0;
+        margin: 0;
+        font-size: inherit;
+        font-family: inherit;
+        line-height: inherit;
+        color: inherit;
+        overflow: hidden;
+        white-space: pre-wrap;
+        word-wrap: break-word;
+    }
+</style>