Clean up SVG files and update logos

- Removed unnecessary XML and DOCTYPE declarations from SVG files.
- Eliminated comments within SVG files for cleaner output.
- Trimmed leading and trailing whitespace from SVG content.
- Ensured all SVG files end with a newline character.
- Updated multiple logo SVG files including WireGuard, Wise, WOG, Yahoo, and others to conform to the new standards.
- Enhanced the update-data.js script to automate the cleanup process for SVG files.

public/images/flags/ua-Zhytomyr.svg

@@ -10,7 +10,7 @@
 		<rect x="0px" y="369px" width="331px" height="331px" style="fill:#ffdc00;" />
 		<rect x="369px" y="0px" width="881px" height="331px" style="fill:#ffdc00;" />
 
-		<!--inner shield-->
+		
 		<path style="fill:none; stroke:white; stroke-width:50px; stroke-linejoin:mitter;" d="m 350,170 C 336,158 322,163 306,171 288,181 264,181 235,175 232,205 221,232 201,256 238,283 249,317 206,361 L 213,371
 	C 217,445 236,475 274,486 279,503 299,517 336,526 L350,537
 	L 364,526 C 401,517 421,503 426,486 464,475 483,435, 487,371
@@ -22,11 +22,11 @@
 	L 494,361 C 451,317 462,283 498,256 479,232 468,205 465,175 436,181 412,181 394,171 378,163 364,158 350,170 z" />
 
 
-		<!--castle-->
+		
-		<!--castle wall-->
+		
 		<rect x="260px" y="276px" width="180px" height="165px" style="fill:white ;stroke:black; stroke-width:1px;" />
 
-		<!--bricks - horizontal lines-->
+		
 		<line x1="260px" y1="291px" x2="440px" y2="291px" stroke="black" stroke-width="1" stroke-linecap="butt" />
 		<line x1="260px" y1="306px" x2="440px" y2="306px" stroke="black" stroke-width="1" stroke-linecap="butt" />
 		<line x1="260px" y1="321px" x2="440px" y2="321px" stroke="black" stroke-width="1" stroke-linecap="butt" />
@@ -38,8 +38,8 @@
 		<line x1="260px" y1="411px" x2="440px" y2="411px" stroke="black" stroke-width="1" stroke-linecap="butt" />
 		<line x1="260px" y1="426px" x2="440px" y2="426px" stroke="black" stroke-width="1" stroke-linecap="butt" />
 
-		<!--bricks - vertical lines-->
+		
-		<!--whole bricks-->
+		
 		<line x1="290px" y1="276px" x2="290px" y2="291px" stroke="black" stroke-width="1" stroke-linecap="butt" />
 		<line x1="320px" y1="276px" x2="320px" y2="291px" stroke="black" stroke-width="1" stroke-linecap="butt" />
 		<line x1="350px" y1="276px" x2="350px" y2="291px" stroke="black" stroke-width="1" stroke-linecap="butt" />
@@ -66,7 +66,7 @@
 		<line x1="290px" y1="426px" x2="290px" y2="441px" stroke="black" stroke-width="1" stroke-linecap="butt" />
 		<line x1="410px" y1="426px" x2="410px" y2="441px" stroke="black" stroke-width="1" stroke-linecap="butt" />
 
-		<!--parted bricks-->
+		
 		<line x1="275px" y1="291px" x2="275px" y2="306px" stroke="black" stroke-width="1" stroke-linecap="butt" />
 		<line x1="305px" y1="291px" x2="305px" y2="306px" stroke="black" stroke-width="1" stroke-linecap="butt" />
 		<line x1="335px" y1="291px" x2="335px" y2="306px" stroke="black" stroke-width="1" stroke-linecap="butt" />
@@ -96,30 +96,30 @@
 		<line x1="395px" y1="411px" x2="395px" y2="426px" stroke="black" stroke-width="1" stroke-linecap="butt" />
 		<line x1="425px" y1="411px" x2="425px" y2="426px" stroke="black" stroke-width="1" stroke-linecap="butt" />
 
-		<!--stairs-->
+		
 		<rect x="257px" y="441px" width="186px" height="9px" style="fill:white ;stroke:black; stroke-width:1px;" />
 		<rect x="249px" y="450px" width="202px" height="9px" style="fill:white ;stroke:black; stroke-width:1px;" />
 
-		<!--door-->
+		
-		<!--door hole-->
+		
 		<path style="fill:white; stroke:black; stroke-width:1px;"
 			d="m 320,378 C 340,334 360,334 380,378 V441 H320 V378 Z" />
 		<path style="fill:#09e;" d="m 325,378 C 340,339 360,339 375,378 V441 H325 V378 Z" />
 
-		<!--doors-->
+		
 		<path style="fill:#ffdc00; stroke:black; stroke-width:1px;"
 			d="m 326,372 C 324,363 318,357 310,353 V441 H326 V372 z" />
 		<path style="fill:#ffdc00; stroke:black; stroke-width:1px;"
 			d="m 374,372 C 376,363 382,357 390,353 V441 H374 V372 z" />
 
-		<!--door top-->
+		
 		<polygon points="345,352 342,336 350,331 358,336 355,352" style="fill:white; stroke:black; stroke-width:1" />
 
-		<!--roof-->
+		
 		<polygon points="260,276 254,270 446,270 443,276" style="fill:white; stroke:black; stroke-width:1" />
 
-		<!--towers-->
+		
-		<!--central tower-->
+		
 		<path style="fill:white; stroke:black; stroke-width:1px;"
 			d="m 370,270 H330 V230 L323,223 V205 H335 V212 H344 V205 H356 V212 H366 V205 H377 V223 L370,230 V270 z" />
 		<line x1="330px" y1="233px" x2="370px" y2="233px" stroke="black" stroke-width="1" stroke-linecap="butt" />
@@ -130,7 +130,7 @@
 		<rect x="356px" y="238px" width="8px" height="13px" style="fill:black;" />
 		<rect x="346px" y="257px" width="8px" height="13px" style="fill:black;" />
 
-		<!--left tower-->
+		
 		<path style="fill:white; stroke:black; stroke-width:1px;"
 			d="m 303,270 H263 V235 L256,228 V212 H268 V221 H277 V212 H289 V221 H298 V212 H310 V228 L303,235 V270 z" />
 		<line x1="263px" y1="238px" x2="303px" y2="238px" stroke="black" stroke-width="1" stroke-linecap="butt" />
@@ -141,7 +141,7 @@
 		<rect x="289px" y="243px" width="8px" height="11px" style="fill:black;" />
 		<rect x="279px" y="259px" width="8px" height="11px" style="fill:black;" />
 
-		<!--right tower-->
+		
 		<path style="fill:white; stroke:black; stroke-width:1px;"
 			d="m 437,270 H397 V235 L390,228 V212 H402 V221 H411 V212 H423 V221 H432 V212 H444 V228 L437,235 V270 z" />
 		<line x1="397px" y1="238px" x2="437px" y2="238px" stroke="black" stroke-width="1" stroke-linecap="butt" />

public/images/flags/us-tn.svg

@@ -1,4 +1,3 @@
-<?xml version="1.0" encoding="UTF-8"?>
 <svg version="1.0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%" viewBox="0,0 240,144">
 	<desc>Flag of Tenessee, United States</desc>
 	<rect width="222" height="144" fill="#c00"/>

public/images/flags/us-tx.svg

@@ -1,4 +1,3 @@
-<?xml version="1.0" encoding="UTF-8"?>
 <svg version="1.0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%" viewBox="0 0 1080 720">
 	<rect width="1080" height="720" fill="#fff"/>
 	<rect y="360" width="1080" height="360" fill="#bf0a30"/>

public/images/flags/us-wy.svg

@@ -1,6 +1,3 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<!-- Creator: CorelDRAW -->
 <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" style="shape-rendering: geometricprecision; text-rendering: geometricprecision; fill-rule: evenodd; clip-rule: evenodd;" viewBox="0 0 3000 2100">
  <defs>
   <style type="text/css">

public/images/logos/mattermost.svg

@@ -1,4 +1,3 @@
-<?xml version="1.0" encoding="UTF-8"?>
 <svg id="Artwork" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 408 225">
     <g fill="currentColor">
         <path

public/images/logos/privat24bussiness.svg

@@ -1,5 +1,3 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!-- Generated by Pixelmator Pro 3.6.17 -->
 <svg width="100%" height="100%" viewBox="0 0 492 492" xmlns="http://www.w3.org/2000/svg">
     <g id="Group">
         <path id="Path" fill="#2c6dff" stroke="none" d="M 88 215 L 166 215 L 166 166 L 326 166 L 326 326 L 287 326 L 287 404 L 404 404 L 404 88 L 88 88 Z"/>

public/images/logos/samsung.svg

@@ -1,6 +1,3 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-
 <svg
    xmlns:dc="http://purl.org/dc/elements/1.1/"
    xmlns:cc="http://creativecommons.org/ns#"

public/images/logos/siemens.svg

@@ -1,6 +1,3 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<!-- Creator: CorelDRAW -->
 <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="100%" height="100%" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
 viewBox="0 0 210 50">
  <defs>

scripts/svg-cleanup.js

@@ -0,0 +1,144 @@
+#!/usr/bin/env node
+
+const fs = require('fs');
+const path = require('path');
+
+// Use collections from src/collections.js
+const { collections } = require('../src/collections.js');
+
+// Accept collection as a CLI arg or env var
+const collectionArg = process.argv.find(arg => arg.startsWith('--collection='));
+const collectionName = collectionArg ? collectionArg.split('=')[1] : (process.env.COLLECTION || 'logos');
+
+// SVG validation and fixing function
+function validateAndFixSvg(svgPath) {
+  try {
+    let svgContent = fs.readFileSync(svgPath, 'utf8');
+    let modified = false;
+
+    // Clean up SVG content
+    const originalContent = svgContent;
+
+    // Remove XML declaration
+    svgContent = svgContent.replace(/<\?xml[^>]*\?>\s*/gi, '');
+
+    // Remove DOCTYPE declaration
+    svgContent = svgContent.replace(/<!DOCTYPE[^>]*>\s*/gi, '');
+
+    // Remove comments
+    svgContent = svgContent.replace(/<!--[\s\S]*?-->/g, '');
+
+    // Remove leading/trailing whitespace and ensure it starts with <svg
+    svgContent = svgContent.trim();
+
+    if (originalContent !== svgContent) {
+      modified = true;
+      console.log(`${path.basename(svgPath)}: Cleaned up SVG (removed XML/DOCTYPE/comments)`);
+    }
+
+    // Parse SVG tag attributes
+    const svgTagMatch = svgContent.match(/<svg[^>]*>/i);
+    if (!svgTagMatch) {
+      console.warn(`No SVG tag found in ${path.basename(svgPath)}`);
+      return;
+    }
+
+    const svgTag = svgTagMatch[0];
+    const viewBoxMatch = svgTag.match(/viewBox\s*=\s*["']([^"']+)["']/i);
+    const widthMatch = svgTag.match(/width\s*=\s*["']([^"']+)["']/i);
+    const heightMatch = svgTag.match(/height\s*=\s*["']([^"']+)["']/i);
+
+    const hasViewBox = !!viewBoxMatch;
+    const hasWidth = !!widthMatch;
+    const hasHeight = !!heightMatch;
+    const width = hasWidth ? widthMatch[1] : null;
+    const height = hasHeight ? heightMatch[1] : null;
+
+    if (!hasViewBox && !hasWidth && !hasHeight) {
+      console.warn(`${path.basename(svgPath)}: No viewBox, width, or height found - cannot determine dimensions`);
+      return;
+    }
+
+    let newSvgTag = svgTag;
+
+    if (!hasViewBox && hasWidth && hasHeight) {
+      // Add viewBox using width and height
+      const widthValue = parseFloat(width);
+      const heightValue = parseFloat(height);
+      if (!isNaN(widthValue) && !isNaN(heightValue)) {
+        const viewBoxValue = `0 0 ${widthValue} ${heightValue}`;
+        newSvgTag = newSvgTag.replace(/(<svg[^>]*?)>/i, `$1 viewBox="${viewBoxValue}">`);
+        modified = true;
+        console.log(`${path.basename(svgPath)}: Added viewBox="${viewBoxValue}"`);
+      }
+    }
+
+    // Update width and height to 100% if they exist
+    if (hasWidth && width !== '100%') {
+      newSvgTag = newSvgTag.replace(/width\s*=\s*["'][^"']+["']/i, 'width="100%"');
+      modified = true;
+      console.log(`${path.basename(svgPath)}: Updated width to 100%`);
+    }
+
+    if (hasHeight && height !== '100%') {
+      newSvgTag = newSvgTag.replace(/height\s*=\s*["'][^"']+["']/i, 'height="100%"');
+      modified = true;
+      console.log(`${path.basename(svgPath)}: Updated height to 100%`);
+    }
+
+    if (modified) {
+      svgContent = svgContent.replace(svgTag, newSvgTag);
+      fs.writeFileSync(svgPath, svgContent, 'utf8');
+      console.log(`${path.basename(svgPath)}: SVG file updated`);
+    }
+
+  } catch (error) {
+    console.error(`Error processing SVG ${path.basename(svgPath)}:`, error.message);
+  }
+}
+
+// Process SVG files for cleanup and validation
+function processSvgFiles(collectionName) {
+  const collection = collections.find(c => c.name === collectionName);
+  if (!collection) {
+    console.error(`Collection "${collectionName}" not found`);
+    return;
+  }
+
+  const imagesDir = path.join(__dirname, '..', 'public', collection.baseDir);
+  
+  if (!fs.existsSync(imagesDir)) {
+    console.error(`Directory does not exist: ${imagesDir}`);
+    return;
+  }
+
+  console.log(`Processing SVG files in collection: ${collection.label}`);
+  
+  const files = fs.readdirSync(imagesDir);
+  const svgFiles = files.filter(file => /\.svg$/i.test(file));
+  
+  console.log(`Found ${svgFiles.length} SVG files`);
+  
+  for (const file of svgFiles) {
+    const svgPath = path.join(imagesDir, file);
+    validateAndFixSvg(svgPath);
+  }
+  
+  console.log(`Completed processing SVG files for ${collection.label}`);
+}
+
+// Main function
+function main() {
+  if (collectionName === 'all') {
+    // Process all collections
+    for (const col of collections) {
+      processSvgFiles(col.name);
+    }
+  } else {
+    // Process single collection
+    processSvgFiles(collectionName);
+  }
+}
+
+// Run the script
+main();

scripts/update-data.js

@@ -190,6 +190,26 @@ function validateAndFixSvg(svgPath) {
     let svgContent = fs.readFileSync(svgPath, 'utf8');
     let modified = false;
 
+    // Clean up SVG content
+    const originalContent = svgContent;
+
+    // Remove XML declaration
+    svgContent = svgContent.replace(/<\?xml[^>]*\?>\s*/gi, '');
+
+    // Remove DOCTYPE declaration
+    svgContent = svgContent.replace(/<!DOCTYPE[^>]*>\s*/gi, '');
+
+    // Remove comments
+    svgContent = svgContent.replace(/<!--[\s\S]*?-->/g, '');
+
+    // Remove leading/trailing whitespace and ensure it starts with <svg
+    svgContent = svgContent.trim();
+
+    if (originalContent !== svgContent) {
+      modified = true;
+      console.log(`${path.basename(svgPath)}: Cleaned up SVG (removed XML/DOCTYPE/comments)`);
+    }
+
     // Parse SVG tag attributes
     const svgTagMatch = svgContent.match(/<svg[^>]*>/i);
     if (!svgTagMatch) {