fix dash style and wording in icon files

2026-04-26 17:34:06 +03:00
commit 021f0bcb23
3 changed files with 537 additions and 0 deletions
@@ -0,0 +1,81 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Cinch Icon - Final</title>
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
+<style>
+  * { margin: 0; padding: 0; box-sizing: border-box; }
+  body {
+    background:
+      repeating-conic-gradient(#1a1a1a 0% 25%, #222 0% 50%) 50% / 20px 20px;
+    min-height: 100vh;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 32px;
+    padding: 40px;
+  }
+  .icon-wrapper {
+    filter: drop-shadow(0 6px 16px rgba(20, 184, 166, 0.3));
+    padding: 80px;
+  }
+  .icon-container {
+    width: 512px;
+    height: 512px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    position: relative;
+    clip-path: url(#squircle);
+    background: linear-gradient(135deg, #0a1628 0%, #14b8a6 100%);
+  }
+  .icon-container::after {
+    content: '';
+    position: absolute;
+    top: 0; left: 0;
+    width: 100%; height: 50%;
+    background: linear-gradient(
+      to bottom,
+      rgba(255,255,255,0.15) 0%,
+      rgba(255,255,255,0.03) 100%
+    );
+    pointer-events: none;
+  }
+  .icon {
+    color: #fff;
+    font-size: 240px;
+    filter: drop-shadow(3px 6px 12px rgba(0,0,0,0.3));
+    position: relative;
+    z-index: 1;
+  }
+  .label {
+    color: #888;
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+    font-size: 16px;
+    font-weight: 500;
+  }
+</style>
+</head>
+<body>
+
+<svg width="0" height="0" style="position:absolute">
+  <defs>
+    <clipPath id="squircle" clipPathUnits="objectBoundingBox">
+      <path d="M 0,0.5 C 0,0.112 0.112,0 0.5,0 0.888,0 1,0.112 1,0.5 1,0.888 0.888,1 0.5,1 0.112,1 0,0.888 0,0.5" />
+    </clipPath>
+  </defs>
+</svg>
+
+<div class="icon-wrapper">
+  <div class="icon-container" id="icon-target">
+    <i class="fa-solid fa-film icon"></i>
+  </div>
+</div>
+
+<div class="label">Cinch - 512x512px</div>
+
+</body>
+</html>