delete composition ajax link is working !

This commit is contained in:
Bachir Soussi Chiadmi
2018-03-24 11:40:51 +01:00
parent 6cc38d3300
commit eed0b50970
7 changed files with 268 additions and 37 deletions
@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 2.6458333 2.6458334"><g fill="none"><g stroke="#000" stroke-width=".726"><path d="M.182.182l2.282 2.282M.182 2.464L2.464.182" stroke-width=".41561322"/></g><path style="isolation:auto;mix-blend-mode:normal" d="M1.883 0H.763A.76.76 0 0 0 0 .762v1.121c0 .423.34.763.762.763h1.121a.76.76 0 0 0 .763-.763V.763A.76.76 0 0 0 1.883 0z" color="#000" overflow="visible"/></g></svg>

After

Width:  |  Height:  |  Size: 448 B

@@ -1659,8 +1659,33 @@ main[role="main"] span.close-col-btn {
width: 30%;
height: 100%;
overflow-y: auto; }
#studio-ui .composition_ui > .wrapper .compositions-list li {
opacity: 1;
-webkit-transition: opacity 0.3s ease-in-out;
transition: opacity 0.3s ease-in-out; }
#studio-ui .composition_ui > .wrapper .compositions-list li:hover a.delete-composition-link {
opacity: 1; }
#studio-ui .composition_ui > .wrapper .compositions-list li.ajax-loading {
opacity: 0.4; }
#studio-ui .composition_ui > .wrapper .compositions-list a {
font-size: 0.756em; }
#studio-ui .composition_ui > .wrapper .compositions-list a.composition-link {
display: inline-block;
width: calc(100% - 14px); }
#studio-ui .composition_ui > .wrapper .compositions-list a.delete-composition-link {
display: inline-block;
vertical-align: middle;
width: 7px;
height: 7px;
margin-left: 5px;
text-indent: 300px;
overflow: hidden;
background-image: url("../img/delete.svg");
background-repeat: no-repeat;
background-size: contain;
opacity: 0;
-webkit-transition: opacity 0.3s ease-in-out;
transition: opacity 0.3s ease-in-out; }
#studio-ui .composition_ui > .wrapper .compositions-list a.new-composition-link {
display: inline-block;
vertical-align: top;
@@ -0,0 +1,78 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<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="10"
height="10"
viewBox="0 0 2.6458333 2.6458334"
version="1.1"
id="svg18014"
inkscape:version="0.92.2 2405546, 2018-03-11"
sodipodi:docname="delete.svg">
<defs
id="defs18008" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="63.356767"
inkscape:cx="0.51510874"
inkscape:cy="5.3735394"
inkscape:document-units="mm"
inkscape:current-layer="g5677-6"
showgrid="false"
units="px"
inkscape:window-width="1920"
inkscape:window-height="1025"
inkscape:window-x="0"
inkscape:window-y="28"
inkscape:window-maximized="1" />
<metadata
id="metadata18011">
<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>
<g
inkscape:label="Calque 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-294.35415)">
<g
style="display:inline"
transform="matrix(0.57246602,0,0,0.57246602,-27.152497,260.5372)"
id="g5677-6">
<path
style="fill:none;stroke:#000000;stroke-width:0.72608751;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 47.749012,59.390676 3.985308,3.985307"
id="path5673-2"
inkscape:connector-curvature="0" />
<path
inkscape:connector-curvature="0"
id="path5675-7"
d="M 47.749012,63.375983 51.73432,59.390676"
style="fill:none;stroke:#000000;stroke-width:0.72608751;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
</g>
<path
style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;vector-effect:none;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.05833328;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
d="M 1.8834657,294.35415 H 0.7623677 C 0.340016,294.35415 0,294.69418 0,295.11654 v 1.1211 c 0,0.42234 0.340016,0.76235 0.7623677,0.76235 h 1.121098 c 0.4223516,0 0.7623677,-0.34001 0.7623677,-0.76235 v -1.1211 c 0,-0.42236 -0.3400161,-0.76239 -0.7623677,-0.76239 z"
id="rect18590"
inkscape:connector-curvature="0" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.3 KiB

@@ -549,8 +549,37 @@ main[role="main"]{
.compositions-list{
width:30%; height:100%;
overflow-y: auto;
li{
opacity: 1;
transition: opacity 0.3s ease-in-out;
&:hover{
a.delete-composition-link{
opacity: 1;
}
}
&.ajax-loading{
opacity: 0.4;
}
}
a{
font-size: 0.756em;
$s:7px; $m:5px;
&.composition-link{
display: inline-block;
width: calc(100% - #{$s +$m +2});
}
&.delete-composition-link{
display: inline-block;
vertical-align: middle;
$s:7px; width:$s; height:$s;
margin-left: $m;
text-indent: 300px; overflow: hidden;
background-image: url('../img/delete.svg');
background-repeat: no-repeat;
background-size: contain;
opacity: 0;
transition: opacity 0.3s ease-in-out;
}
&.new-composition-link{
// padding-left: 1em;
&:before{