UPD: Use dithered font overlay

This commit is contained in:
Robert Kossessa
2024-05-19 19:27:36 +02:00
parent 497f303b21
commit 08081260d6
4 changed files with 19 additions and 3 deletions

Binary file not shown.

Binary file not shown.

View File

@@ -95,6 +95,11 @@
src: url(fonts/SG12.ttf), local('monospace');
}
@font-face {
font-family: 'PixelLgOverlay';
src: url(fonts/SG12-12-7.otf), local('monospace');
}
@font-face {
font-family: 'PixelSm';
src: url(fonts/andina.ttf), local('monospace');
@@ -108,6 +113,10 @@
font-family: 'PixelLg', monospace, sans-serif;
}
.font-pixellg-overlay {
font-family: 'PixelLgOverlay', monospace, sans-serif;
}
.font-pixelsm {
font-family: 'PixelSm', monospace, sans-serif;
}

View File

@@ -53,9 +53,16 @@
v-if="deviceStore.connected"
class="absolute flex scale-[80%] flex-col items-center pb-2 text-center opacity-90 mix-blend-screen"
>
<h2 class="font-pixellg text-[34pt] leading-none">
{{ deviceStore.position }}
</h2>
<div class="relative">
<h2 class="font-pixellg text-[34pt] leading-none">
{{ deviceStore.position }}
</h2>
<h2
class="font-pixellg-overlay absolute top-0 text-[34pt] leading-none text-[#888888]"
>
{{ deviceStore.position }}
</h2>
</div>
<div class="font-pixelsm text-[8pt] text-[#c66936]">
{{ deviceStore.currentProfileName?.toUpperCase() }}
</div>