Make more action icons themable + style fixes
Action icons now appear properly in public link page. More actions are now CSS icons.
This commit is contained in:
parent
c767030f07
commit
b634f1e2c7
|
@ -785,10 +785,12 @@ html.ie8 #controls .button.new {
|
|||
padding: 0;
|
||||
}
|
||||
|
||||
.app-files .fileactions .action .icon,
|
||||
.app-files .actions .button .icon {
|
||||
#filestable .filename .action .icon,
|
||||
#filestable .selectedActions a .icon,
|
||||
#controls .actions .button .icon {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
background-size: 16px 16px;
|
||||
}
|
||||
|
||||
.app-files .actions .button.new .icon {
|
||||
|
|
|
@ -15,17 +15,18 @@
|
|||
var TEMPLATE_FAVORITE_ACTION =
|
||||
'<a href="#" ' +
|
||||
'class="action action-favorite {{#isFavorite}}permanent{{/isFavorite}}">' +
|
||||
'<img class="svg" alt="{{altText}}" src="{{imgFile}}" />' +
|
||||
'<span class="icon {{iconClass}}" />' +
|
||||
'<span class="hidden-visually">{{altText}}</span>' +
|
||||
'</a>';
|
||||
|
||||
/**
|
||||
* Returns the path to the star image
|
||||
* Returns the icon class for the matching state
|
||||
*
|
||||
* @param {boolean} state true if starred, false otherwise
|
||||
* @return {string} path to star image
|
||||
* @return {string} icon class for star image
|
||||
*/
|
||||
function getStarImage(state) {
|
||||
return OC.imagePath('core', state ? 'actions/starred' : 'actions/star');
|
||||
function getStarIconClass(state) {
|
||||
return state ? 'icon-starred' : 'icon-star';
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -41,7 +42,7 @@
|
|||
return this._template({
|
||||
isFavorite: state,
|
||||
altText: state ? t('files', 'Favorited') : t('files', 'Favorite'),
|
||||
imgFile: getStarImage(state)
|
||||
iconClass: getStarIconClass(state)
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -52,8 +53,7 @@
|
|||
* @param {boolean} state true if starred, false otherwise
|
||||
*/
|
||||
function toggleStar($actionEl, state) {
|
||||
$actionEl.find('img').attr('src', getStarImage(state));
|
||||
$actionEl.hide().show(0); //force Safari to redraw element on src change
|
||||
$actionEl.removeClass('icon-star icon-starred').addClass(getStarIconClass(state));
|
||||
$actionEl.toggleClass('permanent', state);
|
||||
}
|
||||
|
||||
|
|
|
@ -52,9 +52,8 @@
|
|||
<a class="name sort columntitle" data-sort="name"><span><?php p($l->t( 'Name' )); ?></span><span class="sort-indicator"></span></a>
|
||||
<span id="selectedActionsList" class="selectedActions">
|
||||
<a href="" class="download">
|
||||
<img class="svg" alt=""
|
||||
src="<?php print_unescaped(image_path("core", "actions/download.svg")); ?>" />
|
||||
<?php p($l->t('Download'))?>
|
||||
<span class="icon icon-download"></span>
|
||||
<span><?php p($l->t('Download'))?></span>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
@ -65,9 +64,8 @@
|
|||
<th id="headerDate" class="hidden column-mtime">
|
||||
<a id="modified" class="columntitle" data-sort="mtime"><span><?php p($l->t( 'Modified' )); ?></span><span class="sort-indicator"></span></a>
|
||||
<span class="selectedActions"><a href="" class="delete-selected">
|
||||
<?php p($l->t('Delete'))?>
|
||||
<img class="svg" alt=""
|
||||
src="<?php print_unescaped(image_path("core", "actions/delete.svg")); ?>" />
|
||||
<span><?php p($l->t('Delete'))?></span>
|
||||
<span class="icon icon-delete"></span>
|
||||
</a></span>
|
||||
</th>
|
||||
</tr>
|
||||
|
|
|
@ -87,3 +87,7 @@
|
|||
margin-top: 9px;
|
||||
}
|
||||
|
||||
.shareTabView .icon {
|
||||
display: inline-block;
|
||||
background-size: 16px 16px;
|
||||
}
|
||||
|
|
|
@ -30,9 +30,8 @@
|
|||
<a class="name sort columntitle" data-sort="name"><span><?php p($l->t( 'Name' )); ?></span><span class="sort-indicator"></span></a>
|
||||
<span id="selectedActionsList" class='selectedActions'>
|
||||
<a href="" class="undelete">
|
||||
<img class="svg" alt=""
|
||||
src="<?php print_unescaped(image_path("core", "actions/history.svg")); ?>" />
|
||||
<?php p($l->t('Restore'))?>
|
||||
<span class="icon icon-history"></span>
|
||||
<span><?php p($l->t('Restore'))?></span>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
@ -41,9 +40,8 @@
|
|||
<a id="modified" class="columntitle" data-sort="mtime"><span><?php p($l->t( 'Deleted' )); ?></span><span class="sort-indicator"></span></a>
|
||||
<span class="selectedActions">
|
||||
<a href="" class="delete-selected">
|
||||
<?php p($l->t('Delete'))?>
|
||||
<img class="svg" alt=""
|
||||
src="<?php print_unescaped(image_path("core", "actions/delete.svg")); ?>" />
|
||||
<span><?php p($l->t('Delete'))?></span>
|
||||
<span class="icon icon-delete"></span>
|
||||
</a>
|
||||
</span>
|
||||
</th>
|
||||
|
|
|
@ -17,7 +17,7 @@
|
|||
'<ul id="shareWithList" class="shareWithList">' +
|
||||
'{{#each sharees}}' +
|
||||
' <li data-share-id="{{shareId}}" data-share-type="{{shareType}}" data-share-with="{{shareWith}}">' +
|
||||
' <a href="#" class="unshare"><span class="icon-loading-small hidden"></span><img class="svg" alt="{{unshareLabel}}" title="{{unshareLabel}}" src="{{unshareImage}}" /></a>' +
|
||||
' <a href="#" class="unshare"><span class="icon-loading-small hidden"></span><span class="icon icon-delete"></span><span class="hidden-visually">{{unshareLabel}}</span></a>' +
|
||||
' {{#if avatarEnabled}}' +
|
||||
' <div class="avatar {{#if modSeed}}imageplaceholderseed{{/if}}" data-username="{{shareWith}}" {{#if modSeed}}data-seed="{{shareWith}} {{shareType}}"{{/if}}></div>' +
|
||||
' {{/if}}' +
|
||||
|
@ -140,7 +140,6 @@
|
|||
mailNotificationEnabled: this.configModel.isMailNotificationEnabled(),
|
||||
notifyByMailLabel: t('core', 'notify by email'),
|
||||
unshareLabel: t('core', 'Unshare'),
|
||||
unshareImage: OC.imagePath('core', 'actions/delete'),
|
||||
canShareLabel: t('core', 'can share'),
|
||||
canEditLabel: t('core', 'can edit'),
|
||||
createPermissionLabel: t('core', 'create'),
|
||||
|
|
Loading…
Reference in New Issue