paulmataruso/patchmon.net
1
0
Fork 0
mirror of https://github.com/9technologygroup/patchmon.net.git synced 2025-11-15 11:21:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: make triangular accents more visible across background

Browse Source 
- Increased triangle opacity from 2-5% to 5-13%
- Increased coverage from 30% to 60% of grid positions
- Slightly larger triangles (50-150px vs 40-120px)
- Smaller cell size (180px vs 200px) for better distribution
- Now clearly visible across entire background
This commit is contained in:
Muhammad Ibrahim
2025-10-28 18:55:30 +00:00
parent aba0f5cb6b
commit f6d23e45b2
2 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/src/components/Layout.jsx
View File

@@ -296,21 +296,21 @@ const Layout = ({ children }) => {
ctx.fillStyle = gradient;
ctx.fillRect(0, 0, canvas.width, canvas.height);
// Add subtle triangular shapes as accents
const cellSize = 200;
// Add subtle triangular shapes as accents across entire background
const cellSize = 180;
const cols = Math.ceil(canvas.width / cellSize) + 1;
const rows = Math.ceil(canvas.height / cellSize) + 1;
for (let y = 0; y < rows; y++) {
for (let x = 0; x < cols; x++) {
const idx = y * cols + x;
// Only draw some triangles (sparse pattern)
if (random(seed + idx + 5000) > 0.7) {
// Draw more triangles (less sparse)
if (random(seed + idx + 5000) > 0.4) {
const baseX =
x * cellSize + random(seed + idx * 3) * cellSize * 0.8;
const baseY =
y * cellSize + random(seed + idx * 3 + 100) * cellSize * 0.8;
const size = 40 + random(seed + idx * 4) * 80;
const size = 50 + random(seed + idx * 4) * 100;
ctx.beginPath();
ctx.moveTo(baseX, baseY);
@@ -318,8 +318,8 @@ const Layout = ({ children }) => {
ctx.lineTo(baseX + size / 2, baseY - size * 0.866);
ctx.closePath();
// Very faint white with low opacity
ctx.fillStyle = `rgba(255, 255, 255, ${0.02 + random(seed + idx * 5) * 0.03})`;
// More visible white with slightly higher opacity
ctx.fillStyle = `rgba(255, 255, 255, ${0.05 + random(seed + idx * 5) * 0.08})`;
ctx.fill();
}
}

14
frontend/src/pages/Login.jsx
View File

@@ -110,21 +110,21 @@ const Login = () => {
ctx.fillStyle = gradient;
ctx.fillRect(0, 0, canvas.width, canvas.height);
// Add subtle triangular shapes as accents
const cellSize = 200;
// Add subtle triangular shapes as accents across entire background
const cellSize = 180;
const cols = Math.ceil(canvas.width / cellSize) + 1;
const rows = Math.ceil(canvas.height / cellSize) + 1;
for (let y = 0; y < rows; y++) {
for (let x = 0; x < cols; x++) {
const idx = y * cols + x;
// Only draw some triangles (sparse pattern)
if (random(seed + idx + 5000) > 0.7) {
// Draw more triangles (less sparse)
if (random(seed + idx + 5000) > 0.4) {
const baseX =
x * cellSize + random(seed + idx * 3) * cellSize * 0.8;
const baseY =
y * cellSize + random(seed + idx * 3 + 100) * cellSize * 0.8;
const size = 40 + random(seed + idx * 4) * 80;
const size = 50 + random(seed + idx * 4) * 100;
ctx.beginPath();
ctx.moveTo(baseX, baseY);
@@ -132,8 +132,8 @@ const Login = () => {
ctx.lineTo(baseX + size / 2, baseY - size * 0.866);
ctx.closePath();
// Very faint white with low opacity
ctx.fillStyle = `rgba(255, 255, 255, ${0.02 + random(seed + idx * 5) * 0.03})`;
// More visible white with slightly higher opacity
ctx.fillStyle = `rgba(255, 255, 255, ${0.05 + random(seed + idx * 5) * 0.08})`;
ctx.fill();
}
}