This commit is contained in:
syuilo 2017-12-08 14:35:50 +09:00
parent 8f51ec3919
commit 08a15102b2
3 changed files with 19 additions and 4 deletions

View file

@ -168,3 +168,6 @@ mk-locker
width 100% width 100%
height 100% height 100%
cursor wait cursor wait
[data-fa]
display inline-block

View file

@ -124,7 +124,8 @@
<mk-ui-header-search> <mk-ui-header-search>
<form class="search" onsubmit={ onsubmit }> <form class="search" onsubmit={ onsubmit }>
<input ref="q" type="search" placeholder="&#xf002; %i18n:desktop.tags.mk-ui-header-search.placeholder%"/> %fa:search%
<input ref="q" type="search" placeholder="%i18n:desktop.tags.mk-ui-header-search.placeholder%"/>
<div class="result"></div> <div class="result"></div>
</form> </form>
<style> <style>
@ -134,11 +135,22 @@
display block display block
float left float left
> [data-fa]
display block
position absolute
top 0
left 0
width 48px
text-align center
line-height 48px
color #9eaba8
pointer-events none
> input > input
user-select text user-select text
cursor auto cursor auto
margin 8px 0 0 0 margin 8px 0 0 0
padding 6px 18px padding 6px 18px 6px 36px
width 14em width 14em
height 32px height 32px
font-size 1em font-size 1em
@ -150,7 +162,7 @@
transition color 0.5s ease, border 0.5s ease transition color 0.5s ease, border 0.5s ease
font-family FontAwesome, sans-serif font-family FontAwesome, sans-serif
&::-webkit-input-placeholder &:placeholder-shown
color #9eaba8 color #9eaba8
&:hover &:hover

View file

@ -49,7 +49,7 @@ export default () => ({
if (icon) { if (icon) {
icon.transform = fontawesome.parse.transform(transform); icon.transform = fontawesome.parse.transform(transform);
return `<i data-fa style="display:inline-block" class="${name}">${icon.html[0]}</i>`; return `<i data-fa class="${name}">${icon.html[0]}</i>`;
} else { } else {
console.warn(`'${name}' not found in fa`); console.warn(`'${name}' not found in fa`);
return ''; return '';