XenForo Logoya Shine Effect Ekleme

[root]

extra.less şablonuna ekleyin.

.p-header-logo {
overflow: hidden;
position: relative;
}
.p-header-logo img {
position: relative;
}
.p-header-logo:before {
position: absolute;
top: 0;
left: -75%;
z-index: 2;
display: block;
content: '';
width: 50%;
height: 100%;
background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
-webkit-transform: skewX(-25deg);
transform: skewX(-25deg);
}
.p-header-logo:hover::before {
-webkit-animation: shine .75s;
animation: shine .75s;
}
@-webkit-keyframes shine {
100% {
left: 125%;
}
}
@keyframes shine {
100% {
left: 125%;
}
}