rayelliott
/
marc-leopold
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

hover state opacity

This commit is contained in:
ManjaroOne666 2019-01-10 17:17:15 +00:00
parent d96fc36ded
commit 3d60970e28
2 changed files with 17 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
components/GalleryFeatured.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<ul> <ul class="gallery-featured">
<li v-for="(gallery, index) in galleries" <li v-for="(gallery, index) in galleries"
class="featured-image" class="featured-image"
:style="{ 'height': featuredHeight, :style="{ 'height': featuredHeight,
@ -47,6 +47,15 @@ export default {
} }
@media (min-width: $bp__layout) { @media (min-width: $bp__layout) {
.gallery-featured {
transition: opacity .3s; // TEMP
opacity: .3;
&:hover {
opacity: 1;
}
}
.featured-image { .featured-image {
width: 100%; width: 100%;
background-size: cover; background-size: cover;

7
components/GalleryThumbs.vue
View File

@ -257,6 +257,13 @@ export default {
flex: 0 0 $thumbs-height; flex: 0 0 $thumbs-height;
overflow: hidden; overflow: hidden;
transition: opacity .3s; // TEMP
opacity: .3;
&:hover {
opacity: 1;
}
} }
.gallery-thumbs__row-container { .gallery-thumbs__row-container {