00c3343b1d
- Hugo site for openbureau.ch (Deutsch, i18n-ready for EN/IT) - Theme themes/openbureau/ = local copy of shibui, customized via site-level layouts and assets to keep the theme reference clean - Editorial typography stack: Newsreader serif body, Space Grotesk display, Inter for listings, IBM Plex Mono for technical meta - Content structure: library/ (Theorie, Büroführung, Software) with manifest and colophon at root; software is a library category, not a separate top-level - Three views over one source: Journal (chronological home), Library (atlas grouped by section + tag cloud), single articles Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
78 lines
1.8 KiB
HTML
Executable File
78 lines
1.8 KiB
HTML
Executable File
|
|
<style>
|
|
* { cursor: none !important; }
|
|
body { min-height: 400px; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 2rem; font-family: monospace; }
|
|
#cursor {
|
|
position: fixed;
|
|
pointer-events: none;
|
|
z-index: 9999;
|
|
image-rendering: pixelated;
|
|
}
|
|
.demo-box {
|
|
padding: 1.5rem 2rem;
|
|
border: 0.5px solid var(--color-border-tertiary);
|
|
border-radius: 8px;
|
|
text-align: center;
|
|
font-size: 14px;
|
|
color: var(--color-text-secondary);
|
|
}
|
|
</style>
|
|
|
|
<h2 class="sr-only">8-bit cursor preview</h2>
|
|
<div class="demo-box">bewege die maus hier</div>
|
|
<canvas id="cursor"></canvas>
|
|
|
|
<script>
|
|
const canvas = document.getElementById('cursor');
|
|
const ctx = canvas.getContext('2d');
|
|
const P = 3;
|
|
|
|
// B=black, W=white, _=transparent
|
|
// Pixel-genaue Nachzeichnung des klassischen Windows-Cursors
|
|
const grid = [
|
|
'B_____________',
|
|
'BB____________',
|
|
'BWB___________',
|
|
'BWWB__________',
|
|
'BWWWB_________',
|
|
'BWWWWB________',
|
|
'BWWWWWB_______',
|
|
'BWWWWWWB______',
|
|
'BWWWWWWWB_____',
|
|
'BWWWWWWWWB____',
|
|
'BWWWWWWWWWB___',
|
|
'BWWWWWWBBB____',
|
|
'BWWWBWWB______',
|
|
'BWWB_BWWB_____',
|
|
'BWB___BWWB____',
|
|
'BB_____BWWB___',
|
|
'B_______BWB___',
|
|
'________BB____',
|
|
];
|
|
|
|
const rows = grid.length;
|
|
const cols = grid[0].length;
|
|
canvas.width = cols * P;
|
|
canvas.height = rows * P;
|
|
canvas.style.width = cols * P + 'px';
|
|
canvas.style.height = rows * P + 'px';
|
|
|
|
grid.forEach((row, y) => {
|
|
for (let x = 0; x < row.length; x++) {
|
|
const c = row[x];
|
|
if (c === 'B') {
|
|
ctx.fillStyle = '#000000';
|
|
ctx.fillRect(x * P, y * P, P, P);
|
|
} else if (c === 'W') {
|
|
ctx.fillStyle = '#ffffff';
|
|
ctx.fillRect(x * P, y * P, P, P);
|
|
}
|
|
}
|
|
});
|
|
|
|
document.addEventListener('mousemove', e => {
|
|
canvas.style.left = e.clientX + 'px';
|
|
canvas.style.top = e.clientY + 'px';
|
|
});
|
|
</script>
|