style: update hover for elements
This commit is contained in:
@@ -24,9 +24,6 @@ body {
|
||||
padding: 1.5rem;
|
||||
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
||||
}
|
||||
.card:hover {
|
||||
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
.tag {
|
||||
background-color: #4a5568;
|
||||
color: #e2e8f0;
|
||||
@@ -78,14 +75,6 @@ body {
|
||||
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition-duration: 150ms;
|
||||
}
|
||||
.btn:hover {
|
||||
background-color: #1D4ED8;
|
||||
transform: scale(1.05);
|
||||
}
|
||||
.btngray:hover {
|
||||
background-color: #4B5563;
|
||||
transform: scale(1.05);
|
||||
}
|
||||
.icon {
|
||||
font-size: 1.5rem;
|
||||
margin-right: 1rem;
|
||||
@@ -119,9 +108,6 @@ article a {
|
||||
color: #60a5fa;
|
||||
text-decoration: none;
|
||||
}
|
||||
article a:hover {
|
||||
color: #93c5fd;
|
||||
}
|
||||
article code {
|
||||
background-color: #374151;
|
||||
font-family: "Red Hat Mono", monospace;
|
||||
@@ -184,20 +170,12 @@ article li {
|
||||
}
|
||||
.like-icon {
|
||||
cursor: pointer;
|
||||
transition: color 0.2s ease-in-out;
|
||||
transition: color 0.2s ease-in-out, transform 0.2s ease-in-out;
|
||||
}
|
||||
.like-icon:hover {
|
||||
color: #fff;
|
||||
transform: scale(1.15);
|
||||
}
|
||||
.like-icon.liked {
|
||||
cursor: pointer;
|
||||
color: #e2264d;
|
||||
}
|
||||
.like-icon.liked:hover {
|
||||
transform: scale(1.15);
|
||||
}
|
||||
.hint-animation {
|
||||
animation: wobble 1s ease-in-out 2;
|
||||
}
|
||||
@@ -209,3 +187,26 @@ article li {
|
||||
60% { transform: translateX(1px) rotate(3deg) scale(1.1); }
|
||||
75% { transform: translateX(0) rotate(-1deg) scale(1); }
|
||||
}
|
||||
@media (hover: hover) {
|
||||
.like-icon:hover {
|
||||
color: #fff;
|
||||
transform: scale(1.15);
|
||||
}
|
||||
.like-icon.liked:hover {
|
||||
transform: scale(1.15);
|
||||
}
|
||||
.card:hover {
|
||||
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
.btn:hover {
|
||||
background-color: #1D4ED8;
|
||||
transform: scale(1.05);
|
||||
}
|
||||
.btngray:hover {
|
||||
background-color: #4B5563;
|
||||
transform: scale(1.05);
|
||||
}
|
||||
article a:hover {
|
||||
color: #93c5fd;
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user