copmonents alignement on page

OP-TED · Nov 28, 2024 · 39669cc · 39669cc
1 parent 817a2e8
commit 39669cc
Show file tree

Hide file tree

Showing 8 changed files with 10 additions and 23 deletions.
diff --git a/index.html b/index.html
@@ -123,9 +123,9 @@
                     <b-nav-item href="#" @click="doShow('model')">{{$t("mainmenu.model")}}</b-nav-item>
                     <b-nav-item href="#" @click="doShow('service')">{{$t("mainmenu.service")}}</b-nav-item>
                 </b-nav>
-              </div>
-            <!-- Main content here -->
-            <component v-bind:is="mainComponent" ref="mainComponent"></component>
+                <!-- Main content here -->
+                <component v-bind:is="mainComponent" ref="mainComponent"></component>
+        </div>
         </main>
         <!--<footer class="footer">-->
             <!-- We want footer content here -->

diff --git a/src/js/codelists.js b/src/js/codelists.js
@@ -96,10 +96,7 @@ Vue.component("codelists", {
     },
 
     template: `
-    <template>
-    <div>
-
-    <b-card title="ESPD Code Lists" footer-tag="footer">
+    <b-card class="mt-2" title="ESPD Code Lists" footer-tag="footer">
     <b-card-text>
     Select the ESPD version and the code list to explore the contents. At the bottom of the page, you can view the translations for each entry in the code list.
     </b-card-text>
@@ -155,7 +152,5 @@ Vue.component("codelists", {
     </b-card>
     <b-overlay :show="loading" no-wrap>
     </b-overlay>
-    </div>
-    </template>
     `
 });
diff --git a/src/js/distribution.js b/src/js/distribution.js
@@ -464,7 +464,7 @@ Vue.component("distribution", {
     },
 
     template: `
-  <b-card title="ESPD Artifacts Export">
+  <b-card class="mt-2" title="ESPD Artifacts Export">
     <b-card-text>
     Select the ESPD version and click the corresponding buttons to generate the ESPD Artifacts ZIP files. The Excel files contain the Code Lists definition, and the ESPD EDM data structure. The archives contain Code Lists in genericode (GC) format.
     </b-card-text>

diff --git a/src/js/header.js b/src/js/header.js
@@ -37,13 +37,6 @@ Vue.component("publicHeader", {
 
 	<!-- Right aligned nav items -->
 	<b-navbar-nav class="ml-auto">
-	<!--
-	<b-nav-item href="#" @click="doShow('distribution')">{{$t("mainmenu.distribution")}}</b-nav-item>
-	<b-nav-item href="#" @click="doShow('codelists')">{{$t("mainmenu.codelists")}}</b-nav-item>
-	<b-nav-item href="#" @click="doShow('uuid')">{{$t("mainmenu.uuid")}}</b-nav-item>
-	<b-nav-item href="#" @click="doShow('model')">{{$t("mainmenu.model")}}</b-nav-item>
-    <b-nav-item href="#" @click="doShow('service')">{{$t("mainmenu.service")}}</b-nav-item>
-	-->
     <!-- 
 	<b-dropdown right size="lg"  variant="link" toggle-class="text-decoration-none" no-caret>
 			<template #button-content>

diff --git a/src/js/home.js b/src/js/home.js
@@ -6,8 +6,8 @@ Vue.component("home",{
     },
 
     template: `
-    <b-container fluid class="m-auto">
-        <b-jumbotron class="mt-2">
+    
+        <b-jumbotron class="mt-2" >
             <template #header>ESPD Demo Site</template>
 
             <template #lead>
@@ -24,6 +24,5 @@ Vue.component("home",{
             </p>
 
         </b-jumbotron>
-    </b-container>
     `
 });
diff --git a/src/js/model.js b/src/js/model.js
@@ -52,7 +52,7 @@ Vue.component("model", {
   },
 
   template: `
-  <b-card title="ESPD Model viewer">
+  <b-card class="mt-2" title="ESPD Model viewer">
     <b-card-text>
     Select the desired ESPD version and Criterion to show the HTML representation of the ESPD Model.    
     </b-card-text>

diff --git a/src/js/service.js b/src/js/service.js
@@ -32,7 +32,7 @@ Vue.component("service", {
     },
 
     template: `
-    <b-card title="ESPD Examples Generator">
+    <b-card class="mt-2" title="ESPD Examples Generator">
         <b-card-text>
         Select the desired ESPD version and generate either ESPD Request examples as a Contracting Authority, or ESPD Response examples as an Economic Operator. Fill in the corresponding fields and click Next to complete the forms. You can download the generated XML document at the end.
         </b-card-text>

diff --git a/src/js/uuid.js b/src/js/uuid.js
@@ -110,7 +110,7 @@ Vue.component("uuid", {
     },
 
     template: `
-    <b-card title="ESPD Model eCertis integration">
+    <b-card class="mt-2"  title="ESPD Model eCertis integration">
     <b-card-text>
     Use the Filter field to search by UUID, version number, or any other text. The data set only includes Selection Criteria and Exclusion Grounds. You can check the actual content in eCertis by clicking on the button to the right. 
     </b-card-text>