mti
/
ptut-vhost
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

[webpack.teacher.view] gooey effect now invisible when not :hover

This commit is contained in:
xdrm-brackets 2018-03-08 13:07:15 +01:00
parent 7a3ac8ff64
commit c9563ab36d
1 changed files with 13 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
webpack/scss/container.scss
View File

@ -191,8 +191,8 @@
width: $btn-size;
height: $btn-size;
-webkit-filter: url('#goo-effect');
filter: url('#goo-effect');
-webkit-filter: url('#goo-effect') drop-shadow(-5px 0 0 #fff);
filter: url('#goo-effect') drop-shadow(-5px 0 0 #fff);
cursor: pointer;
@ -207,7 +207,7 @@
& > div.remove[data-remove],
& > div.edit[data-edit],
& > div.admin[data-admin]{
background-color: darken(#fff, 5%);
background-color: darken(#fff, 12%);
/* (2.1.2) displace all but 1st element */
&.edit[data-edit]{ left: calc( 100% - #{$btn-size * 2 + $btn-space} ); }
@ -231,38 +231,36 @@
border-radius: 50%;
transition: .4s ease-in-out;
transition: background-color .1s ease-in-out,
left .2s ease-in-out;
background: url('/asset/svg/cross.svg@bbbbbb') center center no-repeat;
background-size: auto 50%;
background-color: darken(#fff, 10%);
background: #fff url('/asset/svg/cross.svg@aaaaaa') center center no-repeat;
background-size: auto 50%;
cursor: pointer;
z-index: 103;
/* (2.1) Feedback */
&:hover{ background-image: url('/asset/svg/cross.svg@555555'); }
&:active{ background-image: url('/asset/svg/cross.svg@#{$rd-form-invalid-color}'); }
&:hover{ background-image: url('/asset/svg/cross.svg@#{$rd-form-invalid-color}'); }
/* (2.2) EDIT button */
&.edit[data-edit]{
background-image: url('/asset/svg/a.svg@bbbbbb');
background-image: url('/asset/svg/a.svg@aaaaaa');
background-size: auto 60%;
z-index: 104;
&:hover{ background-image: url('/asset/svg/a.svg@555555'); }
&:active{ background-image: url('/asset/svg/a.svg@#{$rd-form-search-color}'); }
&:hover{ background-image: url('/asset/svg/a.svg@#{$rd-form-search-color}'); }
}
/* (2.3) ADMIN switch */
&.admin[data-admin]{
background-image: url('/asset/svg/admin.svg@bbbbbb');
background-image: url('/asset/svg/admin.svg@aaaaaa');
z-index: 105;
&:hover{ background-image: url('/asset/svg/admin.svg@555555'); }
&[data-active='1']{ background-image: url('/asset/svg/admin.svg@f4bd18'); }
&[data-active='1']:hover{ background-image: url('/asset/svg/admin.svg@f4d118'); }
&[data-active='1']:hover{ background-image: url('/asset/svg/admin.svg@f4a118'); }
}
@ -279,7 +277,7 @@
display: block;
position: relative;
width: 100%;
width: calc( 100% - 1em );
margin-bottom: .5em;