style: change radius and thickness in logos to em based

This commit is contained in:
Youwen Wu 2024-04-06 00:20:41 -07:00
parent ad7adeb287
commit 8fb267ec0f
Signed by: youwen5
GPG key ID: 865658ED1FE61EC3
2 changed files with 100 additions and 100 deletions

View file

@ -20,58 +20,58 @@
{width} {width}
in:fly={transition === 'horizontal' in:fly={transition === 'horizontal'
? { x: -100, duration: 300, delay: 320 } ? { x: -100, duration: 300, delay: 320 }
: { y: -100, duration: 300 }} : { y: -200, duration: 300 }}
out:fly={{ x: 100, duration: 300 }} out:fly={{ x: 100, duration: 300 }}
> >
<a {href}> <a {href}>
<circle cx="936" cy="192" r="3" class="opendot" /> <circle cx="936" cy="192" r="0.22em" class="opendot" />
<circle cx="936" cy="208" r="3" class="opendot" /> <circle cx="936" cy="208" r="0.22em" class="opendot" />
<circle cx="944" cy="128" r="3" class="opendot" /> <circle cx="944" cy="128" r="0.22em" class="opendot" />
<circle cx="944" cy="272" r="3" class="opendot" /> <circle cx="944" cy="272" r="0.22em" class="opendot" />
<circle cx="952" cy="128" r="3" class="opendot" /> <circle cx="952" cy="128" r="0.22em" class="opendot" />
<circle cx="952" cy="272" r="3" class="opendot" /> <circle cx="952" cy="272" r="0.22em" class="opendot" />
<circle cx="960" cy="112" r="3" class="opendot" /> <circle cx="960" cy="112" r="0.22em" class="opendot" />
<circle cx="960" cy="288" r="3" class="opendot" /> <circle cx="960" cy="288" r="0.22em" class="opendot" />
<circle cx="968" cy="112" r="3" class="opendot" /> <circle cx="968" cy="112" r="0.22em" class="opendot" />
<circle cx="968" cy="288" r="3" class="opendot" /> <circle cx="968" cy="288" r="0.22em" class="opendot" />
<circle cx="976" cy="112" r="3" class="opendot" /> <circle cx="976" cy="112" r="0.22em" class="opendot" />
<circle cx="976" cy="176" r="3" class="opendot" /> <circle cx="976" cy="176" r="0.22em" class="opendot" />
<circle cx="976" cy="192" r="3" class="opendot" /> <circle cx="976" cy="192" r="0.22em" class="opendot" />
<circle cx="976" cy="208" r="3" class="opendot" /> <circle cx="976" cy="208" r="0.22em" class="opendot" />
<circle cx="976" cy="224" r="3" class="opendot" /> <circle cx="976" cy="224" r="0.22em" class="opendot" />
<circle cx="976" cy="288" r="3" class="opendot" /> <circle cx="976" cy="288" r="0.22em" class="opendot" />
<circle cx="984" cy="112" r="3" class="opendot" /> <circle cx="984" cy="112" r="0.22em" class="opendot" />
<circle cx="984" cy="288" r="3" class="opendot" /> <circle cx="984" cy="288" r="0.22em" class="opendot" />
<circle cx="992" cy="112" r="3" class="opendot" /> <circle cx="992" cy="112" r="0.22em" class="opendot" />
<circle cx="992" cy="288" r="3" class="opendot" /> <circle cx="992" cy="288" r="0.22em" class="opendot" />
<circle cx="1000" cy="112" r="3" class="opendot" /> <circle cx="1000" cy="112" r="0.22em" class="opendot" />
<circle cx="1000" cy="288" r="3" class="opendot" /> <circle cx="1000" cy="288" r="0.22em" class="opendot" />
<circle cx="1008" cy="112" r="3" class="opendot" /> <circle cx="1008" cy="112" r="0.22em" class="opendot" />
<circle cx="1008" cy="160" r="3" class="opendot" /> <circle cx="1008" cy="160" r="0.22em" class="opendot" />
<circle cx="1008" cy="240" r="3" class="opendot" /> <circle cx="1008" cy="240" r="0.22em" class="opendot" />
<circle cx="1008" cy="288" r="3" class="opendot" /> <circle cx="1008" cy="288" r="0.22em" class="opendot" />
<circle cx="1016" cy="112" r="3" class="opendot" /> <circle cx="1016" cy="112" r="0.22em" class="opendot" />
<circle cx="1016" cy="160" r="3" class="opendot" /> <circle cx="1016" cy="160" r="0.22em" class="opendot" />
<circle cx="1016" cy="240" r="3" class="opendot" /> <circle cx="1016" cy="240" r="0.22em" class="opendot" />
<circle cx="1016" cy="288" r="3" class="opendot" /> <circle cx="1016" cy="288" r="0.22em" class="opendot" />
<circle cx="1024" cy="176" r="3" class="opendot" /> <circle cx="1024" cy="176" r="0.22em" class="opendot" />
<circle cx="1024" cy="192" r="3" class="opendot" /> <circle cx="1024" cy="192" r="0.22em" class="opendot" />
<circle cx="1024" cy="208" r="3" class="opendot" /> <circle cx="1024" cy="208" r="0.22em" class="opendot" />
<circle cx="1024" cy="224" r="3" class="opendot" /> <circle cx="1024" cy="224" r="0.22em" class="opendot" />
<circle cx="1032" cy="112" r="3" class="opendot" /> <circle cx="1032" cy="112" r="0.22em" class="opendot" />
<circle cx="1032" cy="288" r="3" class="opendot" /> <circle cx="1032" cy="288" r="0.22em" class="opendot" />
<circle cx="1040" cy="112" r="3" class="opendot" /> <circle cx="1040" cy="112" r="0.22em" class="opendot" />
<circle cx="1040" cy="288" r="3" class="opendot" /> <circle cx="1040" cy="288" r="0.22em" class="opendot" />
<circle cx="1048" cy="128" r="3" class="opendot" /> <circle cx="1048" cy="128" r="0.22em" class="opendot" />
<circle cx="1048" cy="272" r="3" class="opendot" /> <circle cx="1048" cy="272" r="0.22em" class="opendot" />
<circle cx="1056" cy="128" r="3" class="opendot" /> <circle cx="1056" cy="128" r="0.22em" class="opendot" />
<circle cx="1056" cy="272" r="3" class="opendot" /> <circle cx="1056" cy="272" r="0.22em" class="opendot" />
<circle cx="1064" cy="176" r="3" class="opendot" /> <circle cx="1064" cy="176" r="0.22em" class="opendot" />
<circle cx="1064" cy="192" r="3" class="opendot" /> <circle cx="1064" cy="192" r="0.22em" class="opendot" />
<circle cx="1064" cy="208" r="3" class="opendot" /> <circle cx="1064" cy="208" r="0.22em" class="opendot" />
<circle cx="1064" cy="224" r="3" class="opendot" /> <circle cx="1064" cy="224" r="0.22em" class="opendot" />
<circle cx="1064" cy="240" r="3" class="opendot" /> <circle cx="1064" cy="240" r="0.22em" class="opendot" />
<circle cx="1064" cy="256" r="3" class="opendot" /> <circle cx="1064" cy="256" r="0.22em" class="opendot" />
<g class="text"> <g class="text">
<text x="80" y="20">$$$$$</text> <text x="80" y="20">$$$$$</text>
<text x="80" y="36">$:::$</text> <text x="80" y="36">$:::$</text>
@ -256,7 +256,7 @@
<style lang="postcss"> <style lang="postcss">
.opendot { .opendot {
@apply stroke-primary fill-none stroke-2; @apply stroke-primary fill-none stroke-[0.1em];
} }
.logo { .logo {
& .text { & .text {

View file

@ -23,55 +23,55 @@
<a {href}> <a {href}>
<path d="M 112,352 L 232,112" fill="none" stroke="black" /> <path d="M 112,352 L 232,112" fill="none" stroke="black" />
<path d="M 160,352 L 280,112" fill="none" stroke="black" /> <path d="M 160,352 L 280,112" fill="none" stroke="black" />
<circle cx="680" cy="144" r="3" class="opendot" /> <circle cx="680" cy="144" r="0.22em" class="opendot" />
<circle cx="680" cy="160" r="3" class="opendot" /> <circle cx="680" cy="160" r="0.22em" class="opendot" />
<circle cx="680" cy="176" r="3" class="opendot" /> <circle cx="680" cy="176" r="0.22em" class="opendot" />
<circle cx="680" cy="192" r="3" class="opendot" /> <circle cx="680" cy="192" r="0.22em" class="opendot" />
<circle cx="680" cy="208" r="3" class="opendot" /> <circle cx="680" cy="208" r="0.22em" class="opendot" />
<circle cx="680" cy="224" r="3" class="opendot" /> <circle cx="680" cy="224" r="0.22em" class="opendot" />
<circle cx="680" cy="240" r="3" class="opendot" /> <circle cx="680" cy="240" r="0.22em" class="opendot" />
<circle cx="680" cy="256" r="3" class="opendot" /> <circle cx="680" cy="256" r="0.22em" class="opendot" />
<circle cx="688" cy="128" r="3" class="opendot" /> <circle cx="688" cy="128" r="0.22em" class="opendot" />
<circle cx="688" cy="272" r="3" class="opendot" /> <circle cx="688" cy="272" r="0.22em" class="opendot" />
<circle cx="696" cy="128" r="3" class="opendot" /> <circle cx="696" cy="128" r="0.22em" class="opendot" />
<circle cx="696" cy="272" r="3" class="opendot" /> <circle cx="696" cy="272" r="0.22em" class="opendot" />
<circle cx="704" cy="112" r="3" class="opendot" /> <circle cx="704" cy="112" r="0.22em" class="opendot" />
<circle cx="704" cy="288" r="3" class="opendot" /> <circle cx="704" cy="288" r="0.22em" class="opendot" />
<circle cx="712" cy="112" r="3" class="opendot" /> <circle cx="712" cy="112" r="0.22em" class="opendot" />
<circle cx="712" cy="288" r="3" class="opendot" /> <circle cx="712" cy="288" r="0.22em" class="opendot" />
<circle cx="720" cy="112" r="3" class="opendot" /> <circle cx="720" cy="112" r="0.22em" class="opendot" />
<circle cx="720" cy="176" r="3" class="opendot" /> <circle cx="720" cy="176" r="0.22em" class="opendot" />
<circle cx="720" cy="192" r="3" class="opendot" /> <circle cx="720" cy="192" r="0.22em" class="opendot" />
<circle cx="720" cy="208" r="3" class="opendot" /> <circle cx="720" cy="208" r="0.22em" class="opendot" />
<circle cx="720" cy="224" r="3" class="opendot" /> <circle cx="720" cy="224" r="0.22em" class="opendot" />
<circle cx="720" cy="288" r="3" class="opendot" /> <circle cx="720" cy="288" r="0.22em" class="opendot" />
<circle cx="728" cy="112" r="3" class="opendot" /> <circle cx="728" cy="112" r="0.22em" class="opendot" />
<circle cx="728" cy="288" r="3" class="opendot" /> <circle cx="728" cy="288" r="0.22em" class="opendot" />
<circle cx="736" cy="112" r="3" class="opendot" /> <circle cx="736" cy="112" r="0.22em" class="opendot" />
<circle cx="736" cy="288" r="3" class="opendot" /> <circle cx="736" cy="288" r="0.22em" class="opendot" />
<circle cx="744" cy="112" r="3" class="opendot" /> <circle cx="744" cy="112" r="0.22em" class="opendot" />
<circle cx="744" cy="288" r="3" class="opendot" /> <circle cx="744" cy="288" r="0.22em" class="opendot" />
<circle cx="752" cy="112" r="3" class="opendot" /> <circle cx="752" cy="112" r="0.22em" class="opendot" />
<circle cx="752" cy="160" r="3" class="opendot" /> <circle cx="752" cy="160" r="0.22em" class="opendot" />
<circle cx="752" cy="240" r="3" class="opendot" /> <circle cx="752" cy="240" r="0.22em" class="opendot" />
<circle cx="752" cy="288" r="3" class="opendot" /> <circle cx="752" cy="288" r="0.22em" class="opendot" />
<circle cx="760" cy="112" r="3" class="opendot" /> <circle cx="760" cy="112" r="0.22em" class="opendot" />
<circle cx="760" cy="160" r="3" class="opendot" /> <circle cx="760" cy="160" r="0.22em" class="opendot" />
<circle cx="760" cy="240" r="3" class="opendot" /> <circle cx="760" cy="240" r="0.22em" class="opendot" />
<circle cx="760" cy="288" r="3" class="opendot" /> <circle cx="760" cy="288" r="0.22em" class="opendot" />
<circle cx="768" cy="176" r="3" class="opendot" /> <circle cx="768" cy="176" r="0.22em" class="opendot" />
<circle cx="768" cy="192" r="3" class="opendot" /> <circle cx="768" cy="192" r="0.22em" class="opendot" />
<circle cx="768" cy="208" r="3" class="opendot" /> <circle cx="768" cy="208" r="0.22em" class="opendot" />
<circle cx="768" cy="224" r="3" class="opendot" /> <circle cx="768" cy="224" r="0.22em" class="opendot" />
<circle cx="776" cy="112" r="3" class="opendot" /> <circle cx="776" cy="112" r="0.22em" class="opendot" />
<circle cx="776" cy="288" r="3" class="opendot" /> <circle cx="776" cy="288" r="0.22em" class="opendot" />
<circle cx="784" cy="112" r="3" class="opendot" /> <circle cx="784" cy="112" r="0.22em" class="opendot" />
<circle cx="784" cy="288" r="3" class="opendot" /> <circle cx="784" cy="288" r="0.22em" class="opendot" />
<circle cx="792" cy="128" r="3" class="opendot" /> <circle cx="792" cy="128" r="0.22em" class="opendot" />
<circle cx="792" cy="272" r="3" class="opendot" /> <circle cx="792" cy="272" r="0.22em" class="opendot" />
<circle cx="800" cy="128" r="3" class="opendot" /> <circle cx="800" cy="128" r="0.22em" class="opendot" />
<circle cx="800" cy="272" r="3" class="opendot" /> <circle cx="800" cy="272" r="0.22em" class="opendot" />
<circle cx="808" cy="256" r="3" class="opendot" /> <circle cx="808" cy="256" r="0.22em" class="opendot" />
<g class="text"> <g class="text">
<text x="256" y="116">/////</text> <text x="256" y="116">/////</text>
<text x="504" y="116">yyyyyyy</text> <text x="504" y="116">yyyyyyy</text>
@ -279,7 +279,7 @@
<style lang="postcss"> <style lang="postcss">
.opendot { .opendot {
@apply stroke-primary fill-none stroke-2; @apply stroke-primary fill-none stroke-[0.1em];
} }
.logo { .logo {
& .text { & .text {