diff --git a/core/css/apps.scss b/core/css/apps.scss index becbf63cd6d03..bcb0878b3c8ec 100644 --- a/core/css/apps.scss +++ b/core/css/apps.scss @@ -92,6 +92,22 @@ kbd { border-right: 1px solid $color-border; display: flex; flex-direction: column; + + /* 'New' button */ + .app-navigation-new { + display: block; + padding: 10px; + button { + display: inline-block; + width: 100%; + padding: 10px; + padding-left: 34px; + background-position: 10px center; + text-align: left; + margin: 0; + } + } + li { position: relative; } @@ -794,14 +810,14 @@ kbd { flex: 0 0 auto; > button, > a, - > .menuitem { + > .menuitem, + > label { cursor: pointer; line-height: 36px; border: 0; background-color: transparent; display: flex; align-items: center; - width: auto; height: auto; margin: 0; font-weight: 300; @@ -865,6 +881,9 @@ kbd { margin: -2px 11px 0; } } + > input:not([type=radio]):not([type=checkbox]):not([type=image]) { + width: 150px; + } } > button { padding: 0; @@ -876,7 +895,7 @@ kbd { } } - +/* CONTENT WRAPPER --------------------------------------------------------- */ #app-content-wrapper { display: flex; position: relative; @@ -891,6 +910,8 @@ kbd { overflow-y: auto; } } + +/* CONTENT LIST ------------------------------------------------------------- */ .app-content-list { width: 300px; border-right: 1px solid nc-darken($color-main-background, 8%); @@ -1036,7 +1057,8 @@ kbd { } } } -/* App content */ + +/* CONTENT ------------------------------------------------------------------ */ .app-content-detail { /* grow full width */ flex-grow: 1; @@ -1046,6 +1068,7 @@ kbd { } } +/* MOBILE ------------------------------------------------------------------- */ /* Mobile width < 768px */ @media only screen and (max-width: 768px) { diff --git a/core/css/inputs.scss b/core/css/inputs.scss index c0576f01b09d4..7b74d645481c3 100644 --- a/core/css/inputs.scss +++ b/core/css/inputs.scss @@ -149,6 +149,11 @@ input[type='reset'] { cursor: pointer; box-sizing: border-box; background-color: nc-darken($color-main-background, 3%); + &.icon-confirm:not(:empty), + &.icon-confirm[value]:not([value=""]) { + background-position: calc(100% - 6px) center; + padding-right: 30px; + } } /* Buttons */ diff --git a/core/css/multiselect.scss b/core/css/multiselect.scss index 3aa9eb639ddf5..da6cbde372206 100644 --- a/core/css/multiselect.scss +++ b/core/css/multiselect.scss @@ -25,7 +25,7 @@ ul.multiselectoptions { position: absolute; max-height: 20em; overflow-y: auto; - z-index: 49; + z-index: 149; &.down { border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; @@ -96,7 +96,7 @@ div.multiselect { &.active { background-color: $color-main-background; position: relative; - z-index: 50; + z-index: 150; } &.up { border-top: 0 none; @@ -116,11 +116,16 @@ div.multiselect { text-overflow: ellipsis; width: 90%; white-space: nowrap; + line-height: 20px; } &:last-child { position: absolute; right: 8px; top: 8px; + padding: 0 !important; + min-width: 16px; + min-height: 16px; + background-position: center; } } } diff --git a/settings/css/settings.scss b/settings/css/settings.scss index 05d62423d175a..ec7dbd8478043 100644 --- a/settings/css/settings.scss +++ b/settings/css/settings.scss @@ -137,7 +137,7 @@ input { } .personal-settings-setting-box input { - &[type="text"], &[type="email"], &[type="tel"], &[type="url"] { + &[type='text'], &[type='email'], &[type='tel'], &[type='url'] { width: 100%; } } @@ -183,7 +183,7 @@ input { } } > form span { - &[class^="icon-checkmark"], &[class^="icon-error"] { + &[class^='icon-checkmark'], &[class^='icon-error'] { position: relative; right: 8px; top: -28px; @@ -491,9 +491,12 @@ table.grid { } } -td { +td, th { &.name { padding-left: .8em; + width: 10em; + min-width: 10em; + max-width: 10em; } &.password { padding-left: .8em; @@ -504,8 +507,12 @@ td { &.displayName > img { visibility: hidden; } - &.password, &.displayName { + &.password, + &.displayName, + &.mailAddress { width: 12em; + min-width: 12em; + max-width: 12em; cursor: pointer; } &.mailAddress { @@ -524,14 +531,14 @@ span.usersLastLoginTooltip { /* dropdowns will be relative to this element */ #userlist { position: relative; - .mailAddress, .storageLocation, .userBackend, .lastLogin { + .storageLocation, .userBackend, .lastLogin { display: none; } th.name { color: #000; } tr { - height: 51px; + height: 50px; } .mailAddress .loading-small { width: 16px; @@ -543,16 +550,17 @@ span.usersLastLoginTooltip { .groupsListContainer.hidden { display: none; } + thead th, + thead tr { + z-index: 100; + background-color: $color-main-background; + position: sticky; + // positional attribute is required for position to take affect. + top: 0; + } } -/* because of accessibility the name cell is - therefore we enforce the black color */ -/* use same height as in files app */ #newuser { - /* positioning fixes */ - padding-left: 3px; - .groups { - display: inline; - } .groupsListContainer.hidden { display: none; } @@ -561,6 +569,24 @@ span.usersLastLoginTooltip { position: relative; top: -1px; } + input { + &:not([type='submit']), + &:not([type='reset']) { + width: 100%; + } + } + .userActions input { + width: 44px; + height: 44px; + &.icon-close { + border: none; + background-color: initial; + opacity: .5; + } + &:hover { + opacity: 1; + } + } } tr:hover > td { @@ -575,7 +601,6 @@ tr:hover > td { } td.userActions { - width: 44px; .toggleUserActions { width: 44px; height: 44px; @@ -834,7 +859,7 @@ span.version { margin-bottom: 18px; } -/* capitalize "Other" category */ +/* capitalize 'Other' category */ #app-category-925 { text-transform: capitalize; diff --git a/settings/js/users/users.js b/settings/js/users/users.js index 0b94401941b38..d00423a99f30c 100644 --- a/settings/js/users/users.js +++ b/settings/js/users/users.js @@ -2,6 +2,7 @@ * Copyright (c) 2014, Arthur Schiwon * Copyright (c) 2014, Raghu Nayyar * Copyright (c) 2011, Robin Appelman + * Copyright (c) 2017, John Molakvoæ * This file is licensed under the Affero General Public License version 3 or later. * See the COPYING-README file. */ @@ -31,6 +32,17 @@ var UserList = { // initially the list might already contain user entries (not fully ajaxified yet) // initialize these entries this.$el.find('.quota-user').singleSelect().on('change', this.onQuotaSelect); + $('#new-user-button').on('click', function(event) { + event.preventDefault(); + $('#newuserHeader').slideToggle(OC.menuSpeed); + $('#newusername').focus(); + }); + $('#newreset').on('click', function(event) { + $('#newuserHeader').slideToggle(OC.menuSpeed); + }); + $('.has-tooltip').tooltip({ + placement: 'bottom' + }); }, /** @@ -508,7 +520,7 @@ var UserList = { checked: checked, oncheck: addUserToGroup, onuncheck: removeUserFromGroup, - minWidth: 100 + minWidth: 150 }); }, @@ -542,7 +554,7 @@ var UserList = { checked: checked, oncheck: checkHandler, onuncheck: checkHandler, - minWidth: 100 + minWidth: 150 }); }, @@ -1134,24 +1146,6 @@ $(document).ready(function () { } }); - if ($('#CheckboxEmailAddress').is(':checked')) { - $("#userlist .mailAddress").show(); - } - // Option to display/hide the "Mail Address" column - $('#CheckboxEmailAddress').click(function () { - if ($('#CheckboxEmailAddress').is(':checked')) { - $("#userlist .mailAddress").show(); - if (OC.isUserAdmin()) { - OCP.AppConfig.setValue('core', 'umgmt_show_email', 'true'); - } - } else { - $("#userlist .mailAddress").hide(); - if (OC.isUserAdmin()) { - OCP.AppConfig.setValue('core', 'umgmt_show_email', 'false'); - } - } - }); - if ($('#CheckboxUserBackend').is(':checked')) { $("#userlist .userBackend").show(); } @@ -1170,24 +1164,6 @@ $(document).ready(function () { } }); - if ($('#CheckboxMailOnUserCreate').is(':checked')) { - $("#newemail").show(); - } - // Option to display/hide the "E-Mail" input field - $('#CheckboxMailOnUserCreate').click(function () { - if ($('#CheckboxMailOnUserCreate').is(':checked')) { - $("#newemail").show(); - if (OC.isUserAdmin()) { - OCP.AppConfig.setValue('core', 'umgmt_send_email', 'true'); - } - } else { - $("#newemail").hide(); - if (OC.isUserAdmin()) { - OCP.AppConfig.setValue('core', 'umgmt_send_email', 'false'); - } - } - }); - // calculate initial limit of users to load var initialUserCountLimit = UserList.initialUsersToLoad, containerHeight = $('#app-content').height(); diff --git a/settings/templates/users/main.php b/settings/templates/users/main.php index 3688f2296cdc3..3fc80fca0b900 100644 --- a/settings/templates/users/main.php +++ b/settings/templates/users/main.php @@ -1,6 +1,7 @@ + * Copyright (c) 2017, John Molakvoæ * This file is licensed under the Affero General Public License version 3 or later. * See the COPYING-README file. */ @@ -35,6 +36,7 @@ ?>
+ inc('users/part.createuser')); ?> inc('users/part.grouplist')); ?>
@@ -65,20 +67,6 @@ class="checkbox" t('Show last login')) ?>

-

- /> - -

-

- /> - -

t('When the password of a new user is left empty, an activation email with a link to set the password is sent.')) ?>

@@ -88,6 +76,5 @@ class="checkbox"
- inc('users/part.createuser')); ?> inc('users/part.userlist', $userlistParams)); ?>
diff --git a/settings/templates/users/part.createuser.php b/settings/templates/users/part.createuser.php index 6a388fc0d889d..57fe8e8b63f2e 100644 --- a/settings/templates/users/part.createuser.php +++ b/settings/templates/users/part.createuser.php @@ -1,25 +1,3 @@ -
-
- - - -
- -
- -
- -
- +
+
diff --git a/settings/templates/users/part.userlist.php b/settings/templates/users/part.userlist.php index 2506dba7fc341..9e6866b196d2e 100644 --- a/settings/templates/users/part.userlist.php +++ b/settings/templates/users/part.userlist.php @@ -1,90 +1,147 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + +
t('Username'))?>t( 'Full name' )); ?>t( 'Password' )); ?>t( 'Email' )); ?>t( 'Groups' )); ?>t('Group admin for')); ?>t('Quota')); ?>t('Storage location')); ?>t('User backend')); ?>t('Last login')); ?>
<?php p($l->t(" title="t("change full name"))?>"/> - ●●●●●●● <?php p($l->t(" title="t("set new password"))?>"/> - <?php p($l->t('change email address'))?> -
-
-
- + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - + + + + - - -
t('Username'))?>t( 'Full name' )); ?>t( 'Password' )); ?>t( 'Email' )); ?>t( 'Groups' )); ?>t('Group admin for')); ?>t('Recovery password')); ?>t('Quota')); ?>t('Storage location')); ?>t('User backend')); ?>t('Last login')); ?>
<?php p($l->t('change full name'))?> + ●●●●●●● <?php p($l->t('set new password'))?> + <?php p($l->t('change email address'))?> +
+
+
+ - - -
- -
- + + +
+
+ +
+ +
- -
+
+