mti
/
discord-client
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

[vue.auth.dialog][scss.dialog] added icon to remove rooms

This commit is contained in:
xdrm-brackets 2018-03-29 11:57:25 +02:00
parent 9400f8bff5
commit dbe360f695
3 changed files with 87 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
public_html/asset/svg/minipopup.remove@hover.svg Normal file
View File

@ -0,0 +1,63 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="18"
height="18"
version="1.1"
id="svg1230"
sodipodi:docname="minipopup.remove@hover.svg"
inkscape:version="0.92.2 5c3e80d, 2017-08-06">
<metadata
id="metadata1236">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs1234" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1920"
inkscape:window-height="1015"
id="namedview1232"
showgrid="false"
inkscape:zoom="27.333333"
inkscape:cx="9.1829268"
inkscape:cy="9"
inkscape:window-x="0"
inkscape:window-y="29"
inkscape:window-maximized="1"
inkscape:current-layer="g1228" />
<g
fill="none"
fill-rule="evenodd"
id="g1228">
<path
d="M 12.535534,13.949747 9,10.414214 5.4644661,13.949747 4.0502525,12.535534 7.5857864,9 4.0502525,5.4644661 5.4644661,4.0502525 9,7.5857864 12.535534,4.0502525 13.949747,5.4644661 10.414214,9 l 3.535533,3.535534"
id="path1224"
inkscape:connector-curvature="0"
style="fill:#f04747;fill-rule:nonzero;fill-opacity:1" />
<path
d="M0 0h18v18H0"
id="path1226" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

23
webpack/scss/dialog.scss
View File

@ -125,6 +125,7 @@
/* (5) List items */
li{
display: block;
position: relative;
margin: .1em .5em;
padding: .3em .5em;
@ -173,6 +174,28 @@
&:before{ background-image: url('../asset/svg/dialog.voice.svg'); }
&.active{ color: #ddd; }
}
// background-color: #f00;
& > span.rem{
display: none;
position: absolute;
top: calc( 50% - 1em/2 );
left: calc( 100% - .5em - 1em );
width: 1em;
height: 1em;
background: url('../asset/svg/minipopup.remove.svg') center center no-repeat;
background-size: contain;
&:hover{ background-image: url('../asset/svg/minipopup.remove@hover.svg'); }
}
// only show 'remove' icon on hover
&:hover > span.rem{ display: block; }
}
}

2
webpack/vue/auth/dialog.vue
View File

@ -121,7 +121,7 @@
<li v-for='r in rooms.list'
:class='rooms.current==r.id?`active`:``'
:data-type='r.type'
@click='gs.room.nav(r.type, r.id)'>{{ r.name }}</li>
@click='gs.room.nav(r.type, r.id)'>{{ r.name }}<span class='rem' @click='gs.popup.show(`room.remove`)'></span></li>
</ul>
</div>