|
|
|
@ -42,7 +42,7 @@ |
|
|
|
<!-- Circular crop mask --> |
|
|
|
<mask id="crop-mask"> |
|
|
|
<rect x="0%" y="0%" width="100%" height="100%" fill="white" /> |
|
|
|
<circle cx="50%" cy="50%" r="255" fill="black" /> |
|
|
|
<circle cx="50%" cy="50%" r="50%" fill="black" /> |
|
|
|
</mask> |
|
|
|
|
|
|
|
<!-- Grid definitions --> |
|
|
|
@ -51,7 +51,8 @@ |
|
|
|
<rect width="100%" height="100%" color="black" mask="url(#crop-mask)" /> |
|
|
|
</mask> |
|
|
|
<mask id="dark-grid-mask"> |
|
|
|
<circle cx="50%" cy="50%" r="46%" fill="none" stroke="white" stroke-width="8%" /> |
|
|
|
<rect x="0%" y="0%" width="100%" height="100%" fill="white" /> |
|
|
|
<circle cx="50%" cy="50%" r="42%" fill="black" /> |
|
|
|
<rect x="46%" y="70%" width="8%" height="25%" fill="white" transform="rotate(-45 256 256)" /> |
|
|
|
<rect x="0%" y="0%" width="100%" height="50%" fill="black" transform="rotate(45 256 256) translate(0 -20)" /> |
|
|
|
<rect x="50%" y="46%" width="50%" height="8%" fill="white" /> |
|
|
|
@ -59,11 +60,10 @@ |
|
|
|
<rect x="-4%" y="40%" width="25%" height="25%" fill="black" transform="rotate(-45 256 256)" /> |
|
|
|
<circle cx="50%" cy="50%" r="5.656854249%" fill="black" /> |
|
|
|
<polygon fill="black" points="-1,-1 -1,513 513,-1" /> |
|
|
|
<rect x="96%" y="46%" width="4%" height="4%" fill="black" /> |
|
|
|
<rect width="100%" height="100%" color="black" mask="url(#crop-mask)" /> |
|
|
|
</mask> |
|
|
|
<mask id="light-grid-mask"> |
|
|
|
<circle cx="50%" cy="50%" r="46%" fill="none" stroke="white" stroke-width="8%" /> |
|
|
|
<rect x="0%" y="0%" width="100%" height="100%" fill="white" /> |
|
|
|
<circle cx="50%" cy="50%" r="42%" fill="black" /> |
|
|
|
<rect x="46%" y="6%" width="8%" height="25%" fill="white" transform="rotate(-45 256 256)" /> |
|
|
|
<rect x="0%" y="0%" width="100%" height="50%" fill="black" transform="rotate(45 256 256) translate(0 -20)" /> |
|
|
|
<rect x="46%" y="0%" width="8%" height="54%" fill="white" /> |
|
|
|
@ -71,41 +71,39 @@ |
|
|
|
<rect x="-4%" y="30%" width="25%" height="25%" fill="black" transform="rotate(-45 256 256)" /> |
|
|
|
<circle cx="50%" cy="50%" r="5.656854249%" fill="black" /> |
|
|
|
<polygon fill="black" points="-1,513 513,513 513,-1" /> |
|
|
|
<rect x="50%" y="0%" width="4%" height="4%" fill="black" /> |
|
|
|
<rect width="100%" height="100%" color="black" mask="url(#crop-mask)" /> |
|
|
|
</mask> |
|
|
|
|
|
|
|
<!-- Arrow definitions --> |
|
|
|
<mask id="dark-arrow-mask"> |
|
|
|
<rect x="0%" y="0%" width="100%" height="100%" fill="url(#dark-arrow-gradient-1)" /> |
|
|
|
<circle cx="50%" cy="50%" r="42%" fill="black" /> |
|
|
|
<rect x="46%" y="0%" width="8%" height="44%" fill="url(#dark-arrow-gradient-2)" /> |
|
|
|
<rect x="50%" y="0%" width="4%" height="4%" fill="black" /> |
|
|
|
<circle cx="50%" cy="50%" r="46%" fill="none" stroke="url(#dark-arrow-gradient-1)" stroke-width="8%" /> |
|
|
|
<rect x="0%" y="0%" width="46%" height="100%" fill="black" /> |
|
|
|
<rect x="0%" y="54%" width="100%" height="46%" fill="black" /> |
|
|
|
<rect x="46%" y="-50%" width="8%" height="110%" fill="white" transform="rotate(45 256 256) translate(-82 282)" /> |
|
|
|
<rect x="0%" y="46%" width="50%" height="8%" fill="black" /> |
|
|
|
<rect width="100%" height="100%" color="black" mask="url(#crop-mask)" /> |
|
|
|
</mask> |
|
|
|
<mask id="light-arrow-mask"> |
|
|
|
<rect x="0%" y="0%" width="100%" height="100%" fill="url(#light-arrow-gradient-1)" /> |
|
|
|
<circle cx="50%" cy="50%" r="42%" fill="black" /> |
|
|
|
<rect x="56%" y="46%" width="44%" height="8%" fill="url(#light-arrow-gradient-2)" /> |
|
|
|
<rect x="96%" y="46%" width="4%" height="4%" fill="black" /> |
|
|
|
<circle cx="50%" cy="50%" r="46%" fill="none" stroke="url(#light-arrow-gradient-1)" stroke-width="8%" /> |
|
|
|
<rect x="0%" y="0%" width="46%" height="100%" fill="black" /> |
|
|
|
<rect x="0%" y="54%" width="100%" height="46%" fill="black" /> |
|
|
|
<rect x="46%" y="-50%" width="8%" height="110%" fill="white" transform="rotate(45 256 256) translate(82 282)" /> |
|
|
|
<rect x="46%" y="50%" width="8%" height="50%" fill="black" /> |
|
|
|
<rect width="100%" height="100%" color="black" mask="url(#crop-mask)" /> |
|
|
|
</mask> |
|
|
|
</defs> |
|
|
|
|
|
|
|
<!-- Background --> |
|
|
|
<rect width="100%" height="100%" fill="url(#middle-pattern)" mask="url(#middle-grid-mask)" /> |
|
|
|
<g mask="url(#middle-grid-mask)"> |
|
|
|
<!-- Background --> |
|
|
|
<rect width="100%" height="100%" fill="url(#middle-pattern)" /> |
|
|
|
|
|
|
|
<!-- Grids --> |
|
|
|
<rect width="100%" height="100%" fill="url(#dark-pattern)" mask="url(#dark-grid-mask)" /> |
|
|
|
<rect width="100%" height="100%" fill="url(#light-pattern)" mask="url(#light-grid-mask)" /> |
|
|
|
<!-- Grids --> |
|
|
|
<rect width="100%" height="100%" fill="url(#dark-pattern)" mask="url(#dark-grid-mask)" /> |
|
|
|
<rect width="100%" height="100%" fill="url(#light-pattern)" mask="url(#light-grid-mask)" /> |
|
|
|
|
|
|
|
<!-- Arrows --> |
|
|
|
<rect width="100%" height="100%" fill="url(#dark-pattern)" mask="url(#dark-arrow-mask)" /> |
|
|
|
<rect width="100%" height="100%" fill="url(#light-pattern)" mask="url(#light-arrow-mask)" /> |
|
|
|
<!-- Arrows --> |
|
|
|
<rect width="100%" height="100%" fill="url(#dark-pattern)" mask="url(#dark-arrow-mask)" /> |
|
|
|
<rect width="100%" height="100%" fill="url(#light-pattern)" mask="url(#light-arrow-mask)" /> |
|
|
|
</g> |
|
|
|
</svg> |
