<div id="sidebar-wrapper" class="inline-block">
	<div id="sidebar" class="inline-block">
		<aside>
			<div class="section container" style="font-size: 14px;">
				<h2>Theme</h2>
                <?php foreach (["auto", "light", "dark"] as $theme): ?>
					<div class="icon-wrapper">
						<picture class="light">
							<source type="image/svg+xml" srcset="/assets/icons/light-mode/theme-<?= $theme ?>.svg">
							<img class="icon" src="/assets/icons/light-mode/theme-<?= $theme ?>.png" alt="">
						</picture>
						<picture class="dark">
							<source type="image/svg+xml" srcset="/assets/icons/dark-mode/theme-<?= $theme ?>.svg">
							<img class="icon" src="/assets/icons/dark-mode/theme-<?= $theme ?>.png" alt="">
						</picture>
					</div>
					<span id="<?= $theme ?>-theme">
						<a class="theme-btn" data-theme="<?= $theme ?>" href="/api/set_theme/<?= $name ?>.php">
							<?= ucwords($theme) ?>
						</a>
						<span class="theme-check">&#10003;</span>
					</span>
                    <br>
                <?php endforeach; ?>
			</div>
		</aside>
	</div>
</div>
