Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

.w-overlay improvments #29

Open
arturmamedov opened this issue Feb 24, 2020 · 1 comment
Open

.w-overlay improvments #29

arturmamedov opened this issue Feb 24, 2020 · 1 comment
Assignees
Labels
enhancement improvment

Comments

@arturmamedov
Copy link
Owner

I think i can avoid use of additional div with .overlay class by use of pseudo elements, shure work with image, need to try with div and other's thing

.w-overlay {
   posiiton: relative;
   overlay: hidden;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.w-overlay:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #252525;
    opacity: 0;
}

.w-overlay:hover:after {
    opacity: 0.7;
}
@arturmamedov
Copy link
Owner Author

For image is also nice to scale, maybe i can make a class a part

.blog:hover .blog-img img {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

@arturmamedov arturmamedov pinned this issue Feb 24, 2020
@arturmamedov arturmamedov added the enhancement improvment label Feb 24, 2020
@arturmamedov arturmamedov self-assigned this Feb 24, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement improvment
Projects
None yet
Development

No branches or pull requests

1 participant