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

created svg filter cluster for better usage

This commit is contained in:
xdrm-brackets 2018-03-08 14:14:22 +01:00
parent da5f51367e
commit 45a7f126bb
3 changed files with 11 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
public_html/asset/svg/filter.svg Normal file
View File

@ -0,0 +1,9 @@
<svg xmlns='http://www.w3.org/2000/svg' version='1.1'>
<defs>
<filter id='goo-menu'>
<feGaussianBlur in='SourceGraphic' stdDeviation='3' result='blur' />
<feColorMatrix in='blur' mode='matrix' values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 15 -5' result='goo' />
<feComposite in='SourceGraphic' in2='goo' operator='atop'/>
</filter>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 359 B

11
webpack/component/teacher/view.vue
View File

@ -3,17 +3,6 @@
<div id='CONTAINER'> <div id='CONTAINER'>
<svg xmlns='http://www.w3.org/2000/svg' version='1.1'>
<defs>
<filter id='goo-effect'>
<feGaussianBlur in='SourceGraphic' stdDeviation='3' result='blur' />
<feColorMatrix in='blur' mode='matrix' values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 15 -5' result='goo' />
<feComposite in='SourceGraphic' in2='goo' operator='atop'/>
</filter>
</defs>
</svg>
<div class='card container'> <div class='card container'>
<input class='card instant-search neutral' type='text' @keyup='gstore.is_handler($event)' placeholder='Recherche instantannée' id='teacher_view_instant_search'> <input class='card instant-search neutral' type='text' @keyup='gstore.is_handler($event)' placeholder='Recherche instantannée' id='teacher_view_instant_search'>

4
webpack/scss/container.scss
View File

@ -192,8 +192,8 @@
width: $btn-size; width: $btn-size;
height: $btn-size; height: $btn-size;
-webkit-filter: url('#goo-effect') drop-shadow(-5px 0 0 #fff); -webkit-filter: url('/asset/svg/filter.svg#goo-menu') drop-shadow(-5px 0 0 #fff);
filter: url('#goo-effect') drop-shadow(-5px 0 0 #fff); filter: url('/asset/svg/filter.svg#goo-menu') drop-shadow(-5px 0 0 #fff);
cursor: pointer; cursor: pointer;