Updated screenshots. Implemented color-scheme script to force browser color-scheme. Implemented print functionality. Updated README.md. Implemented print route.

This commit is contained in:
Glenn de Haan
2024-04-06 21:25:30 +02:00
parent ddc512b77a
commit db0bd72cc2
11 changed files with 1460 additions and 41 deletions

View File

@@ -43,5 +43,21 @@
</p>
</div>
</div>
<script type="application/javascript">
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.querySelector('html').setAttribute('style', 'color-scheme: dark;');
}
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', event => {
const newColorScheme = event.matches ? "dark" : "light";
if(newColorScheme === 'light') {
document.querySelector('html').removeAttribute('style');
} else {
document.querySelector('html').setAttribute('style', 'color-scheme: dark;');
}
});
</script>
</body>
</html>

View File

@@ -70,5 +70,21 @@
</p>
</div>
</div>
<script type="application/javascript">
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.querySelector('html').setAttribute('style', 'color-scheme: dark;');
}
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', event => {
const newColorScheme = event.matches ? "dark" : "light";
if(newColorScheme === 'light') {
document.querySelector('html').removeAttribute('style');
} else {
document.querySelector('html').setAttribute('style', 'color-scheme: dark;');
}
});
</script>
</body>
</html>

View File

@@ -183,6 +183,13 @@
<path fill-rule="evenodd" d="M15.75 4.5a3 3 0 1 1 .825 2.066l-8.421 4.679a3.002 3.002 0 0 1 0 1.51l8.421 4.679a3 3 0 1 1-.729 1.31l-8.421-4.678a3 3 0 1 1 0-4.132l8.421-4.679a3 3 0 0 1-.096-.755Z" clip-rule="evenodd" />
</svg>
</button>
<a href="<%= baseUrl %>/voucher/<%= voucher._id %>/print" type="button" class="relative rounded-full p-1 text-gray-500 dark:text-gray-400 hover:text-black dark:hover:text-white">
<span class="absolute -inset-1.5"></span>
<span class="sr-only">Print Voucher Code</span>
<svg class="h-5 w-5" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M7.875 1.5C6.839 1.5 6 2.34 6 3.375v2.99c-.426.053-.851.11-1.274.174-1.454.218-2.476 1.483-2.476 2.917v6.294a3 3 0 0 0 3 3h.27l-.155 1.705A1.875 1.875 0 0 0 7.232 22.5h9.536a1.875 1.875 0 0 0 1.867-2.045l-.155-1.705h.27a3 3 0 0 0 3-3V9.456c0-1.434-1.022-2.7-2.476-2.917A48.716 48.716 0 0 0 18 6.366V3.375c0-1.036-.84-1.875-1.875-1.875h-8.25ZM16.5 6.205v-2.83A.375.375 0 0 0 16.125 3h-8.25a.375.375 0 0 0-.375.375v2.83a49.353 49.353 0 0 1 9 0Zm-.217 8.265c.178.018.317.16.333.337l.526 5.784a.375.375 0 0 1-.374.409H7.232a.375.375 0 0 1-.374-.409l.526-5.784a.373.373 0 0 1 .333-.337 41.741 41.741 0 0 1 8.566 0Zm.967-3.97a.75.75 0 0 1 .75-.75h.008a.75.75 0 0 1 .75.75v.008a.75.75 0 0 1-.75.75H18a.75.75 0 0 1-.75-.75V10.5ZM15 9.75a.75.75 0 0 0-.75.75v.008c0 .414.336.75.75.75h.008a.75.75 0 0 0 .75-.75V10.5a.75.75 0 0 0-.75-.75H15Z" clip-rule="evenodd" />
</svg>
</a>
<a href="<%= baseUrl %>/voucher/<%= voucher._id %>/remove" type="button" class="remove-button relative rounded-full p-1 text-red-500 dark:text-red-400 hover:text-black dark:hover:text-white">
<span class="absolute -inset-1.5"></span>
<span class="sr-only">Remove Voucher Code</span>
@@ -300,6 +307,21 @@
</div>
</div>
<script type="application/javascript">
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.querySelector('html').setAttribute('style', 'color-scheme: dark;');
}
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', event => {
const newColorScheme = event.matches ? "dark" : "light";
if(newColorScheme === 'light') {
document.querySelector('html').removeAttribute('style');
} else {
document.querySelector('html').setAttribute('style', 'color-scheme: dark;');
}
});
</script>
<script type="application/javascript">
const createDialog = document.querySelector('#create-dialog');
const createForum = document.querySelector("#voucher-forum");