diff --git a/src/css/style.css b/src/css/style.css index 84994e9..de27961 100644 --- a/src/css/style.css +++ b/src/css/style.css @@ -52,10 +52,10 @@ body { background-color: #2563EB; color: white; border: 1px solid transparent; - padding: 0.75rem 2rem; + padding: 0.75rem 1.5rem; font-size: 1rem; line-height: 1.5; - border-radius: 9999px; + border-radius: 1rem; transition-property: transform, background-color; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; @@ -73,7 +73,7 @@ body { padding: 0.75rem 2rem; font-size: 1rem; line-height: 1.5; - border-radius: 9999px; + border-radius: 1rem; transition-property: transform, background-color; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; @@ -187,7 +187,7 @@ article li { transition: color 0.2s ease-in-out; transition: color 0.2s ease-in-out, transform 0.2s ease-in-out; } -.like-icon:hover { +.like-icon:hover, .like-icon:active { color: #fff; transform: scale(1.15); } @@ -195,7 +195,7 @@ article li { cursor: pointer; color: #e2264d; } -.like-icon.liked:hover { +.like-icon.liked:hover, .like-icon.liked:active { transform: scale(1.15); } .hint-animation { @@ -209,3 +209,12 @@ article li { 60% { transform: translateX(1px) rotate(3deg) scale(1.2); } 75% { transform: translateX(0) rotate(-1deg) scale(1.1); } } +@media (hover: hover) { + .like-icon:hover { + color: #fff; + transform: scale(1.15); + } + .like-icon.liked:hover { + transform: scale(1.15); + } +} \ No newline at end of file