provide svg icons for terms

Author: Hofstetter Benjamin

opendata.swiss/ui/app/components/content/OdsTerms.vue

@@ -42,7 +42,8 @@ const termsName = computed(() => {
 
 });
 
-const imageSrc = computed(() => `/img/terms-of-use/terms_${termsName.value}.png`);
+const imageSrc = computed(() => `/img/terms-of-use/terms_${termsName.value}.svg`);
+
 </script>
 
 <style lang="scss" scoped>

opendata.swiss/ui/app/components/dataset-detail/OdsDetailTermsOfUse.vue

@@ -4,7 +4,8 @@
       <img
         :src="imageSrc"
         :alt="t(`message.terms_of_use.ods_${termsName}.title`)"
-        :title="t(`message.terms_of_use.ods_${termsName}.title`)">
+        :title="t(`message.terms_of_use.ods_${termsName}.title`)"
+        class="ods-terms-of-use_image">
     </div>
 
   <ul>
@@ -44,7 +45,8 @@ const termsName = computed(() => {
 
 });
 
-const imageSrc = computed(() => `/img/terms-of-use/terms_${termsName.value}.png`);
+const imageSrc = computed(() => `/img/terms-of-use/terms_${termsName.value}.svg`);
+
 </script>
 
 <style lang="scss" scoped>
@@ -72,4 +74,8 @@ li {
   margin-bottom: 0;
   margin-top: 44px !important;
 }
+
+.ods-terms-of-use_image {
+  height: 156px;
+}
 </style>