fix delete icon (attachments)
This commit is contained in:
parent
407231f5d7
commit
31760fac91
5 changed files with 51 additions and 31 deletions
|
@ -1,25 +1,25 @@
|
|||
<div class="attachments"></div>
|
||||
<div class="article-attachment u-unclickable">
|
||||
<div class="article-attachment">
|
||||
<div class="attachmentPlaceholder">
|
||||
<span class="attachmentPlaceholder-inputHolder u-highlight u-clickable fileUpload">
|
||||
<span class="attachmentPlaceholder-inputHolder fileUpload">
|
||||
<%- @T('select attachment..') %>
|
||||
<input multiple="multiple" type="file" name="file" style="">
|
||||
</span>
|
||||
</div>
|
||||
<div class="attachmentUpload hide u-clickable">
|
||||
<div class="attachmentUpload hide">
|
||||
<div class="horizontal">
|
||||
<div class="u-highlight">
|
||||
<%- @T('Uploading') %> (<span class="js-percentage">0</span>%) ...
|
||||
</div>
|
||||
<div class="attachmentUpload-cancel align-right js-cancel u-clickable">
|
||||
<div class="delete icon"></div><%- @T('Cancel Upload') %>
|
||||
<div class="attachmentUpload-cancel js-cancel">
|
||||
<svg class="icon icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg></div><%- @T('Cancel Upload') %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="attachmentUpload-progressBar" style="width: 0%"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fit dropArea">
|
||||
<div class="dropArea-inner fit centered">
|
||||
<div class="dropArea-inner">
|
||||
<%- @T('Drop Files here') %>
|
||||
</div>
|
||||
</div>
|
|
@ -1,7 +1,7 @@
|
|||
<div class="attachment horizontal">
|
||||
<div class="attachment-name u-highlight"><%= @fileName %></div>
|
||||
<div class="attachment">
|
||||
<div class="attachment-name"><%= @fileName %></div>
|
||||
<div class="attachment-size"><%= @fileSize %></div>
|
||||
<div class="attachment-delete js-delete align-right u-clickable" data-id="<%= @store_id %>">
|
||||
<div class="delete icon"></div><%- @T('Delete File') %>
|
||||
<div class="attachment-delete js-delete" data-id="<%= @store_id %>">
|
||||
<svg class="icon icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg><%- @T('Delete File') %>
|
||||
</div>
|
||||
</div>
|
|
@ -14,45 +14,45 @@
|
|||
<div class="js-textarea articleNewEdit-body" contenteditable="true"><%- @content %></div>
|
||||
<!-- .textBubble grows with textarea (and expanding clone) -->
|
||||
<div class="attachments"></div>
|
||||
<!--
|
||||
</div>
|
||||
|
||||
<!-- <div>
|
||||
<div class="attachment horizontal">
|
||||
<div class="attachment-name u-highlight">sega-genesis-box.gif</div>
|
||||
<div class="attachment-size">2.4mb</div>
|
||||
<div class="attachment-delete js-delete align-right u-clickable">
|
||||
<div class="delete icon"></div><%- @T('Delete File') %>
|
||||
<svg class="icon icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg><%- @T('Delete File') %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="attachment horizontal">
|
||||
<div class="attachment-name u-highlight">license-key.txt</div>
|
||||
<div class="attachment-size">7kb</div>
|
||||
<div class="attachment-delete js-delete align-right u-clickable">
|
||||
<div class="delete icon"></div><%- @T('Delete File') %>
|
||||
<svg class="icon icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg><%- @T('Delete File') %>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="article-attachment u-unclickable">
|
||||
<div class="article-attachment">
|
||||
<div class="attachmentPlaceholder">
|
||||
<span class="attachmentPlaceholder-hint">Antwort eingeben oder</span>
|
||||
<span class="attachmentPlaceholder-inputHolder u-highlight u-clickable">
|
||||
<span class="attachmentPlaceholder-inputHolder">
|
||||
Dateien wählen..
|
||||
<input multiple="multiple" type="file" name="file" style="position: absolute; right: 0px; top: 0px; font-family: Arial; font-size: 118px; margin: 0px; padding: 0px; cursor: pointer; opacity: 0;">
|
||||
</span>
|
||||
</div>
|
||||
<div class="attachmentUpload hide u-clickable">
|
||||
<div class="attachmentUpload hide">
|
||||
<div class="horizontal">
|
||||
<div class="u-highlight">
|
||||
<%- @T('Uploading') %> (<span class="js-percentage">0</span>%) ...
|
||||
</div>
|
||||
<div class="attachmentUpload-cancel align-right js-cancel u-clickable">
|
||||
<div class="delete icon"></div><%- @T('Cancel Upload') %>
|
||||
<div class="attachmentUpload-cancel js-cancel">
|
||||
<svg class="icon icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg><%- @T('Cancel Upload') %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="attachmentUpload-progressBar" style="width: 0%"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fit dropArea">
|
||||
<div class="dropArea-inner fit centered">
|
||||
<div class="dropArea-inner">
|
||||
<%- @T('Drop Files here') %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -54,28 +54,28 @@
|
|||
<div class="js-textarea articleNewEdit-body" contenteditable="true" data-name="body"><%- @article.body %></div>
|
||||
<!-- .textBubble grows with textarea (and expanding clone) -->
|
||||
<div class="attachments"></div>
|
||||
<div class="article-attachment u-unclickable u-textTruncate">
|
||||
<div class="article-attachment">
|
||||
<div class="attachmentPlaceholder">
|
||||
<span class="attachmentPlaceholder-hint"><%- @T('Enter Answer or') %></span>
|
||||
<span class="attachmentPlaceholder-inputHolder u-highlight u-clickable">
|
||||
<span class="attachmentPlaceholder-inputHolder">
|
||||
<%- @T('select attachment..') %>
|
||||
<input multiple="multiple" type="file" name="file" style="position: absolute; right: 0px; top: 0px; font-family: Arial; font-size: 118px; margin: 0px; padding: 0px; cursor: pointer; opacity: 0;">
|
||||
</span>
|
||||
</div>
|
||||
<div class="attachmentUpload hide u-clickable">
|
||||
<div class="attachmentUpload hide">
|
||||
<div class="horizontal">
|
||||
<div class="u-highlight">
|
||||
<%- @T('Uploading') %> (<span class="js-percentage">0</span>%) ...
|
||||
</div>
|
||||
<div class="attachmentUpload-cancel align-right js-cancel u-clickable">
|
||||
<div class="delete icon"></div><%- @T('Cancel Upload') %>
|
||||
<div class="attachmentUpload-cancel js-cancel">
|
||||
<svg class="icon icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg><%- @T('Cancel Upload') %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="attachmentUpload-progressBar" style="width: 0%"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fit dropArea">
|
||||
<div class="dropArea-inner fit centered">
|
||||
<div class="dropArea">
|
||||
<div class="dropArea-inner">
|
||||
<%- @T('Drop Files here') %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -3047,12 +3047,20 @@ footer {
|
|||
font-size: 20px;
|
||||
margin: 5px;
|
||||
display: none;
|
||||
@extend .fit;
|
||||
}
|
||||
|
||||
.is-dropTarget .dropArea {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.dropArea-inner {
|
||||
@extend .fit;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.shortcut .dropdown-menu > .active > a {
|
||||
background: none;
|
||||
}
|
||||
|
@ -3312,6 +3320,7 @@ footer {
|
|||
padding: 10px 0;
|
||||
color: #b3b3b3;
|
||||
overflow: hidden;
|
||||
@extend .u-unclickable, .u-textTruncate;
|
||||
}
|
||||
|
||||
.attachments:not(:empty) {
|
||||
|
@ -3325,6 +3334,7 @@ footer {
|
|||
padding: 1px 10px 1px 7px;
|
||||
cursor: default;
|
||||
position: relative;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.attachment:hover {
|
||||
|
@ -3334,6 +3344,7 @@ footer {
|
|||
.attachment-name {
|
||||
margin-right: 5px;
|
||||
word-break: break-all;
|
||||
@extend .u-highlight;
|
||||
}
|
||||
|
||||
.attachment-size {
|
||||
|
@ -3347,6 +3358,8 @@ footer {
|
|||
text-decoration: underline;
|
||||
display: none;
|
||||
white-space: nowrap;
|
||||
margin-left: auto;
|
||||
@extend .u-clickable;
|
||||
}
|
||||
|
||||
.attachment:hover .attachment-delete {
|
||||
|
@ -3359,7 +3372,9 @@ footer {
|
|||
}
|
||||
|
||||
.attachment-delete .icon {
|
||||
opacity: 0.2;
|
||||
fill: hsl(198,18%,72%);
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
|
@ -3368,6 +3383,7 @@ footer {
|
|||
display: inline-block;
|
||||
overflow: hidden;
|
||||
vertical-align: bottom;
|
||||
@extend .u-highlight, .u-clickable;
|
||||
}
|
||||
|
||||
.attachmentUpload {
|
||||
|
@ -3375,11 +3391,15 @@ footer {
|
|||
}
|
||||
|
||||
.attachmentUpload-cancel {
|
||||
@extend .u-clickable;
|
||||
margin-left: auto;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.attachmentUpload .delete.icon {
|
||||
opacity: 0.33;
|
||||
.attachmentUpload .icon {
|
||||
fill: hsl(198,18%,72%);
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue