From 245b7b035e2624ace209f5a56ba67f1b274c346f Mon Sep 17 00:00:00 2001
From: Julien Oculi <xdrz.jot.sr@gmail.com>
Date: Tue, 22 Apr 2025 17:23:52 +0200
Subject: [PATCH] refactor(components/Header): use css variables instead of
 hard coded values

---
 components/Header.css | 11 ++++++-----
 src/webpush/mod.ts    |  6 +++++-
 2 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/components/Header.css b/components/Header.css
index 523e56b..7a1a7a6 100644
--- a/components/Header.css
+++ b/components/Header.css
@@ -5,6 +5,7 @@ header {
 	background-color: var(--_translucent);
 	color: var(--_font-color);
 	user-select: none;
+	--_header-width-small-screen: 960px;
 }
 
 header div {
@@ -26,7 +27,7 @@ header div {
 		color: currentColor;
 	}
 
-	@media (width < 800px) {
+	@media (width < var(--_header-width-small-screen)) {
 		.components__header__brand__text {
 			display: none;
 		}
@@ -58,7 +59,7 @@ header menu {
 		border: var(--_border-size) solid currentColor;
 	}
 
-	@media (width < 800px) {
+	@media (width < var(--_header-width-small-screen)) {
 		& {
 			justify-content: space-around;
 		}
@@ -85,7 +86,7 @@ header details {
 			transition: all var(--_transition-delay) ease;
 		}
 
-		@media (width < 800px) {
+		@media (width < var(--_header-width-small-screen)) {
 			& {
 				display: grid;
 				gap: 0;
@@ -125,7 +126,7 @@ header details {
 			calc(var(--_gap-half) + 2px)
 		);
 
-		@media (width < 800px) {
+		@media (width < var(--_header-width-small-screen)) {
 			& {
 				border: var(--_border-size) solid currentColor;
 				transform: translate(-33%, var(--_gap));
@@ -162,7 +163,7 @@ header details {
 		display: none;
 	}
 
-	@media (width < 800px) {
+	@media (width < var(--_header-width-small-screen)) {
 		& {
 			display: grid;
 			font-size: x-small;
diff --git a/src/webpush/mod.ts b/src/webpush/mod.ts
index 51e101f..b18049c 100644
--- a/src/webpush/mod.ts
+++ b/src/webpush/mod.ts
@@ -1,5 +1,5 @@
 //@deno-types="npm:@types/web-push@^3.6.3"
-import webpush from 'web-push'
+import webpush, { WebPushError } from 'web-push'
 
 // DEV mode
 // localStorage.clear()
@@ -7,6 +7,10 @@ import webpush from 'web-push'
 const vapidKeys = getVapidKeys()
 export const { publicKey } = vapidKeys
 
+export const subscriptions = await Deno.openKv(
+	'./cache/webpush_subscription.sqlite',
+)
+
 webpush.setVapidDetails(
 	'mailto:contact@example.com',
 	vapidKeys.publicKey,