(landing) svg icons animations
This commit is contained in:
@@ -15,8 +15,12 @@
|
||||
<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.3">
|
||||
<rect x="8" y="10" width="32" height="22" rx="1"/>
|
||||
<path d="M8 16h32"/>
|
||||
<path d="M14 24h20M14 28h12"/>
|
||||
<g class="mech-bars">
|
||||
<path d="M14 24h20"/>
|
||||
<path d="M14 28h12"/>
|
||||
</g>
|
||||
<path d="M16 38h16M20 32v6M28 32v6"/>
|
||||
<circle class="mech-led" cx="36" cy="13.5" r="1.1" fill="currentColor"/>
|
||||
</svg>
|
||||
</div>
|
||||
<span class="eyebrow no-rule"><span class="n">— 01</span></span>
|
||||
@@ -28,9 +32,9 @@
|
||||
<article class="mech">
|
||||
<div class="icon" aria-hidden="true">
|
||||
<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.3">
|
||||
<circle cx="24" cy="24" r="14"/>
|
||||
<path d="M16 24h16M24 16v16"/>
|
||||
<path d="M10 10l28 28" stroke-width="1.5"/>
|
||||
<circle class="mech-ring" cx="24" cy="24" r="14"/>
|
||||
<path class="mech-plus" d="M16 24h16M24 16v16"/>
|
||||
<path class="mech-slash" d="M10 10l28 28" stroke-width="1.5"/>
|
||||
</svg>
|
||||
</div>
|
||||
<span class="eyebrow no-rule"><span class="n">— 02</span></span>
|
||||
@@ -44,8 +48,10 @@
|
||||
<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.3">
|
||||
<path d="M8 36V18l8-8h16l8 8v18"/>
|
||||
<path d="M8 36h32"/>
|
||||
<circle cx="24" cy="26" r="4"/>
|
||||
<path d="M24 22v-4M24 30v4M20 26h-4M28 26h4"/>
|
||||
<g class="mech-gear">
|
||||
<circle cx="24" cy="26" r="4"/>
|
||||
<path d="M24 22v-4M24 30v4M20 26h-4M28 26h4"/>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
<span class="eyebrow no-rule"><span class="n">— 03</span></span>
|
||||
@@ -57,12 +63,14 @@
|
||||
<article class="mech">
|
||||
<div class="icon" aria-hidden="true">
|
||||
<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.3">
|
||||
<circle cx="10" cy="12" r="3"/>
|
||||
<circle cx="38" cy="10" r="3"/>
|
||||
<circle cx="24" cy="26" r="3"/>
|
||||
<circle cx="12" cy="38" r="3"/>
|
||||
<circle cx="38" cy="36" r="3"/>
|
||||
<path d="M12 14l10 10M36 12L26 24M14 36l8-8M36 34l-10-6" opacity="0.6"/>
|
||||
<path class="mech-edges" d="M12 14l10 10M36 12L26 24M14 36l8-8M36 34l-10-6" opacity="0.6"/>
|
||||
<g class="mech-nodes">
|
||||
<circle cx="10" cy="12" r="3"/>
|
||||
<circle cx="38" cy="10" r="3"/>
|
||||
<circle cx="24" cy="26" r="3"/>
|
||||
<circle cx="12" cy="38" r="3"/>
|
||||
<circle cx="38" cy="36" r="3"/>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
<span class="eyebrow no-rule"><span class="n">— 04</span></span>
|
||||
|
||||
Reference in New Issue
Block a user