Update illustrations and enhance SVG handling in HTML (#2051)

.build/import-illustrations.js

@@ -12,7 +12,6 @@ const illustrations = glob
 		return path.basename(file, '.png')
 	})
 
-
 fs.writeFileSync(
 	path.join(__dirname, `../src/pages/_data/illustrations.json`),
 	JSON.stringify(illustrations)

.changeset/hot-vans-peel.md

@@ -0,0 +1,5 @@
+---
+"@tabler/core": patch
+---
+
+Update illustrations and enhance SVG handling in HTML

src/pages/_data/illustrations.json

@@ -1 +1 @@
-["weightlifting","wait","video","to-do","telescope","snowman","shield","search","project","not-found","neutral-info","music","mobile-computer","message","map-destination","loading","kite","icons","icons-workshop","icons-production","icons-ladder","icons-drawing","icons-drawing-run","ice-skates","guitar","good-news","girl-refresh","girl-phone","gift","folders","flowers","fingerprint","exit","error","email","electric-scooter","dart","dance","conversation","computer-fix","clock-and-cat","chart","chart-circle","calendar","building","boy","boy-with-key","boy-gives-flowers","boy-girl","boy-and-laptop","boy-and-cat","bicycle","bad-news","archive","ai"]
+["weightlifting","wait","video","to-do","tiredness","telescope","snowman","shield","search","project","printer","not-found","new-year","new-year-2","neutral-info","music","mobile-computer","message","map-destination","loading","kite","icons","icons-workshop","icons-production","icons-ladder","icons-drawing","icons-drawing-run","ice-skates","halloween-pumpkin","guitar","good-news","girl-refresh","girl-phone","gift","ghost","folders","flowers","fingerprint","exit","error","email","electric-scooter","dart","dance","conversation","computer-fix","clock-and-cat","christmas-tree","christmas-gifts","christmas-fireplace","chart","chart-circle","calendar","building","boy","boy-with-key","boy-refresh","boy-gives-flowers","boy-girl","boy-and-laptop","boy-and-cat","bicycle","bad-news","archive","ai"]

src/pages/illustrations.html

@@ -14,7 +14,7 @@ illustrations = illustrations | push: illustration %} {% endif %} {% endfor %} {
 				<div class="col-md-7">
 					<div class="card">
 						<div class="card-body d-flex align-items-center">
-							<div id="current-illustration">{{ first_illustration }}</div>
+							<div id="current-illustration">{{ first_illustration | replace: '<svg ', '<svg class="w-100 h-auto" ' }}</div>
 						</div>
 					</div>
 				</div>
@@ -55,7 +55,7 @@ illustrations = illustrations | push: illustration %} {% endif %} {% endfor %} {
 												<label class="form-imagecheck mb-2">
 													<input name="form-imagecheck" type="radio" value="{{ illustration.slug }}" class="form-imagecheck-input js-select-illustration" {% if forloop.first %} checked{% endif %}>
 													<span class="form-imagecheck-figure">
-														{{ illustration }}
+														{{ illustration | replace: '<svg ', '<svg class="w-100 h-auto" ' }}
 													</span>
 												</label>
 											</div>
@@ -73,7 +73,7 @@ illustrations = illustrations | push: illustration %} {% endif %} {% endfor %} {
 </div>
 
 <h2 class="page-title my-5">
-	{{ site.illustrations.count | minus: 4 }} more SVG Illustrations
+	{{ site.data.illustrations | size | minus: 4 }} more SVG Illustrations
 </h2>
 
 <div class="row row-cards">
@@ -129,7 +129,7 @@ illustrations = illustrations | push: illustration %} {% endif %} {% endfor %} {
 	const illustrations = {
 	{% for illustration in illustrations %}
 		"{{ illustration.slug }}": {
-	      svg: '{{ illustration.content | quote | replace_regex: "\n", "\n" }}',
+	      svg: '{{ illustration.content | replace: '<svg ', '<svg class="w-100 h-auto" ' | quote | replace_regex: "\n", "\n" }}',
 		},
 	{% endfor %}
 	}