refactor(main): replace regular css with tailwind

This commit is contained in:
Kim, Jimin 2023-07-04 10:10:40 +09:00
parent f16a4e1858
commit 0cfe1e29c3

View file

@ -7,7 +7,7 @@
body { body {
/* SvelteKit has 8px margin by default for some reason */ /* SvelteKit has 8px margin by default for some reason */
margin: 0; @apply m-0;
} }
#root { #root {
@ -17,23 +17,13 @@ body {
main { main {
/* style */ /* style */
@apply flex; @apply flex flex-col items-center;
width: 100%; /* spacing */
padding: 0 2rem; @apply mx-auto my-0 min-h-screen w-full max-w-5xl px-8 py-0 pb-20;
max-width: 64rem;
flex-direction: column;
padding-bottom: 5rem;
align-items: center;
text-align: center;
min-height: 100vh;
/* center main horizontally */ /* text */
margin: 0 auto; @apply text-center font-normal;
}
* {
font-weight: 400;
} }
h1 { h1 {
@ -60,24 +50,23 @@ a {
} }
p { p {
line-height: 1.5; @apply leading-6;
} }
b { b {
font-weight: 700; @apply font-bold;
} }
.social-profile { .social-profile {
* { * {
color: #888888; @apply text-[#888888] duration-150 ease-out;
transition: color 0.15s ease-out;
} }
svg { svg {
width: 2.5rem; @apply w-10;
} }
:hover { :hover {
color: #ffffff; @apply text-white;
} }
} }