Keep share checkboxes together
- removed leading spaces before markup which can affect rendering in some cases - added shareOption CSS class to group and keep share option checkbox + label - moved ".showCruds" arrow into the matching shareOption to keep the arrow together with the checkbox
This commit is contained in:
Vincent Petry
parent
a6c921267e
commit
9ef24b9a0f
|
|
@ -63,6 +63,11 @@
|
|||
white-space: normal;
|
||||
}
|
||||
|
||||
#shareWithList .shareOption {
|
||||
white-space: nowrap;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#shareWithList .unshare img, #shareWithList .showCruds img {
|
||||
vertical-align:text-bottom; /* properly align icons */
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,42 +16,56 @@
|
|||
var TEMPLATE =
|
||||
'<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><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}}' +
|
||||
' <span class="has-tooltip username" title="{{shareWith}}">{{shareWithDisplayName}}</span>' +
|
||||
' {{#if mailNotificationEnabled}} {{#unless isRemoteShare}}' +
|
||||
' <input id="mail-{{cid}}-{{shareWith}}" type="checkbox" name="mailNotification" class="mailNotification checkbox" {{#if wasMailSent}}checked="checked"{{/if}} />' +
|
||||
' <label for="mail-{{cid}}-{{shareWith}}">{{notifyByMailLabel}}</label>' +
|
||||
' {{/unless}} {{/if}}' +
|
||||
' {{#if isResharingAllowed}} {{#if sharePermissionPossible}} {{#unless isRemoteShare}}' +
|
||||
' <input id="canShare-{{cid}}-{{shareWith}}" type="checkbox" name="share" class="permissions checkbox" {{#if hasSharePermission}}checked="checked"{{/if}} data-permissions="{{sharePermission}}" />' +
|
||||
' <label for="canShare-{{cid}}-{{shareWith}}">{{canShareLabel}}</label>' +
|
||||
' {{/unless}} {{/if}} {{/if}}' +
|
||||
' {{#if editPermissionPossible}}' +
|
||||
' <input id="canEdit-{{cid}}-{{shareWith}}" type="checkbox" name="edit" class="permissions checkbox" {{#if hasEditPermission}}checked="checked"{{/if}} />' +
|
||||
' <label for="canEdit-{{cid}}-{{shareWith}}">{{canEditLabel}}</label>' +
|
||||
' {{/if}}' +
|
||||
' {{#unless isRemoteShare}}' +
|
||||
' <a href="#" class="showCruds"><img class="svg" alt="{{crudsLabel}}" src="{{triangleSImage}}"/></a>' +
|
||||
' <div class="cruds hidden">' +
|
||||
' {{#if createPermissionPossible}}' +
|
||||
' <input id="canCreate-{{cid}}-{{shareWith}}" type="checkbox" name="create" class="permissions checkbox" {{#if hasCreatePermission}}checked="checked"{{/if}} data-permissions="{{createPermission}}"/>' +
|
||||
' <label for="canCreate-{{cid}}-{{shareWith}}">{{createPermissionLabel}}</label>' +
|
||||
' {{/if}}' +
|
||||
' {{#if updatePermissionPossible}}' +
|
||||
' <input id="canUpdate-{{cid}}-{{shareWith}}" type="checkbox" name="update" class="permissions checkbox" {{#if hasUpdatePermission}}checked="checked"{{/if}} data-permissions="{{updatePermission}}"/>' +
|
||||
' <label for="canUpdate-{{cid}}-{{shareWith}}">{{updatePermissionLabel}}</label>' +
|
||||
' {{/if}}' +
|
||||
' {{#if deletePermissionPossible}} {{#unless isRemoteShare}}' +
|
||||
' <input id="canDelete-{{cid}}-{{shareWith}}" type="checkbox" name="delete" class="permissions checkbox" {{#if hasDeletePermission}}checked="checked"{{/if}} data-permissions="{{deletePermission}}"/>' +
|
||||
' <label for="canDelete-{{cid}}-{{shareWith}}">{{deletePermissionLabel}}</label>' +
|
||||
' {{/unless}} {{/if}}' +
|
||||
' </div>' +
|
||||
' {{/unless}}' +
|
||||
' </li>' +
|
||||
'<li data-share-id="{{shareId}}" data-share-type="{{shareType}}" data-share-with="{{shareWith}}">' +
|
||||
'<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}}' +
|
||||
'<span class="has-tooltip username" title="{{shareWith}}">{{shareWithDisplayName}}</span>' +
|
||||
'{{#if mailNotificationEnabled}} {{#unless isRemoteShare}}' +
|
||||
'<span class="shareOption">' +
|
||||
'<input id="mail-{{cid}}-{{shareWith}}" type="checkbox" name="mailNotification" class="mailNotification checkbox" {{#if wasMailSent}}checked="checked"{{/if}} />' +
|
||||
'<label for="mail-{{cid}}-{{shareWith}}">{{notifyByMailLabel}}</label>' +
|
||||
'</span>' +
|
||||
'{{/unless}} {{/if}}' +
|
||||
'{{#if isResharingAllowed}} {{#if sharePermissionPossible}} {{#unless isRemoteShare}}' +
|
||||
'<span class="shareOption">' +
|
||||
'<input id="canShare-{{cid}}-{{shareWith}}" type="checkbox" name="share" class="permissions checkbox" {{#if hasSharePermission}}checked="checked"{{/if}} data-permissions="{{sharePermission}}" />' +
|
||||
'<label for="canShare-{{cid}}-{{shareWith}}">{{canShareLabel}}</label>' +
|
||||
'</span>' +
|
||||
'{{/unless}} {{/if}} {{/if}}' +
|
||||
'{{#if editPermissionPossible}}' +
|
||||
'<span class="shareOption">' +
|
||||
'<input id="canEdit-{{cid}}-{{shareWith}}" type="checkbox" name="edit" class="permissions checkbox" {{#if hasEditPermission}}checked="checked"{{/if}} />' +
|
||||
'<label for="canEdit-{{cid}}-{{shareWith}}">{{canEditLabel}}</label>' +
|
||||
'{{#unless isRemoteShare}}' +
|
||||
'<a href="#" class="showCruds"><img class="svg" alt="{{crudsLabel}}" src="{{triangleSImage}}"/></a>' +
|
||||
'{{/unless}}' +
|
||||
'</span>' +
|
||||
'{{/if}}' +
|
||||
'{{#unless isRemoteShare}}' +
|
||||
'<div class="cruds hidden">' +
|
||||
'{{#if createPermissionPossible}}' +
|
||||
'<span class="shareOption">' +
|
||||
'<input id="canCreate-{{cid}}-{{shareWith}}" type="checkbox" name="create" class="permissions checkbox" {{#if hasCreatePermission}}checked="checked"{{/if}} data-permissions="{{createPermission}}"/>' +
|
||||
'<label for="canCreate-{{cid}}-{{shareWith}}">{{createPermissionLabel}}</label>' +
|
||||
'</span>' +
|
||||
'{{/if}}' +
|
||||
'{{#if updatePermissionPossible}}' +
|
||||
'<span class="shareOption">' +
|
||||
'<input id="canUpdate-{{cid}}-{{shareWith}}" type="checkbox" name="update" class="permissions checkbox" {{#if hasUpdatePermission}}checked="checked"{{/if}} data-permissions="{{updatePermission}}"/>' +
|
||||
'<label for="canUpdate-{{cid}}-{{shareWith}}">{{updatePermissionLabel}}</label>' +
|
||||
'</span>' +
|
||||
'{{/if}}' +
|
||||
'{{#if deletePermissionPossible}} {{#unless isRemoteShare}}' +
|
||||
'<span class="shareOption">' +
|
||||
'<input id="canDelete-{{cid}}-{{shareWith}}" type="checkbox" name="delete" class="permissions checkbox" {{#if hasDeletePermission}}checked="checked"{{/if}} data-permissions="{{deletePermission}}"/>' +
|
||||
'<label for="canDelete-{{cid}}-{{shareWith}}">{{deletePermissionLabel}}</label>' +
|
||||
'</span>' +
|
||||
'{{/unless}} {{/if}}' +
|
||||
'</div>' +
|
||||
'{{/unless}}' +
|
||||
'</li>' +
|
||||
'{{/each}}' +
|
||||
'</ul>'
|
||||
;
|
||||
|
|
|
|||
Loading…
Reference in New Issue