mirror of
https://github.com/nextcloud/server.git
synced 2026-04-26 00:27:49 -04:00
434d68129d
Users page lazy multiselect group dropdowns Instead of pre-rendering all multiselects with lots of group entries, the current groups are now displayed as simple labels. Behind the labels there is a pencil icon like for other fields. When clicking the pencil icon, the dropdown will be spawned and will open itself. Upon closing of the dropdown, the label comes back with the updated selection and the dropdown is destroyed. Extra non-available groups also in list Fix group sorting in user list group selection
574 lines
9.8 KiB
CSS
574 lines
9.8 KiB
CSS
/* Copyright (c) 2011, Jan-Christoph Borchardt, http://jancborchardt.net
|
|
This file is licensed under the Affero General Public License version 3 or later.
|
|
See the COPYING-README file. */
|
|
|
|
select#languageinput, select#timezone { width:15em; }
|
|
input#openid, input#webdav { width:20em; }
|
|
|
|
/* PERSONAL */
|
|
|
|
#avatar {
|
|
display: inline-block;
|
|
float: left;
|
|
width: 160px;
|
|
padding-right: 0;
|
|
}
|
|
#avatar .avatardiv {
|
|
margin-bottom: 10px;
|
|
}
|
|
#avatar .warning {
|
|
width: 100%;
|
|
}
|
|
#uploadavatarbutton,
|
|
#selectavatar,
|
|
#removeavatar {
|
|
width: 33px;
|
|
height: 33px;
|
|
}
|
|
.jcrop-holder {
|
|
z-index: 500;
|
|
}
|
|
#avatar #cropper {
|
|
float: left;
|
|
background-color: #fff;
|
|
z-index: 500;
|
|
position: relative;
|
|
}
|
|
|
|
#displaynameform,
|
|
#lostpassword,
|
|
#groups,
|
|
#passwordform,
|
|
#language {
|
|
display: inline-block;
|
|
margin-bottom: 0;
|
|
padding-bottom: 0;
|
|
padding-right: 0;
|
|
min-width: 60%;
|
|
}
|
|
#avatar,
|
|
#passwordform {
|
|
margin-bottom: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
#groups {
|
|
overflow-wrap: break-word;
|
|
max-width: 75%;
|
|
}
|
|
|
|
.clientsbox img {
|
|
height: 60px;
|
|
}
|
|
|
|
#sslCertificate tr.expired {
|
|
background-color: rgba(255, 0, 0, 0.5);
|
|
}
|
|
#sslCertificate td {
|
|
padding: 5px;
|
|
}
|
|
|
|
|
|
#displaynameerror {
|
|
display: none;
|
|
}
|
|
#displaynamechanged {
|
|
display: none;
|
|
}
|
|
input#identity {
|
|
width: 20em;
|
|
}
|
|
#displayName,
|
|
#email {
|
|
width: 17em;
|
|
}
|
|
|
|
#showWizard {
|
|
display: inline-block;
|
|
}
|
|
|
|
.msg.success {
|
|
color: #fff;
|
|
background-color: #47a447;
|
|
padding: 3px;
|
|
}
|
|
.msg.error {
|
|
color: #fff;
|
|
background-color: #d2322d;
|
|
padding: 3px;
|
|
}
|
|
|
|
table.nostyle label { margin-right: 2em; }
|
|
table.nostyle td { padding: 0.2em 0; }
|
|
|
|
/* USERS */
|
|
#newgroup-init a span { margin-left: 20px; }
|
|
#newgroup-init a span:before {
|
|
position: absolute; left: 12px; top:-2px;
|
|
content: '+'; font-weight: bold; font-size: 150%;
|
|
}
|
|
|
|
#newgroup-form {
|
|
height: 44px;
|
|
}
|
|
#newgroupname {
|
|
margin: 6px;
|
|
width: 95%;
|
|
padding-right: 32px;
|
|
box-sizing: border-box
|
|
}
|
|
#newgroup-form .button {
|
|
position: absolute;
|
|
right: 0;
|
|
top: 3px;
|
|
height: 32px;
|
|
width: 32px;
|
|
}
|
|
|
|
.ie8 #newgroup-form .icon-add {
|
|
height: 30px;
|
|
}
|
|
|
|
.isgroup .groupname {
|
|
width: 85%;
|
|
display: block;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
.isgroup.active .groupname {
|
|
width: 65%;
|
|
}
|
|
|
|
.usercount { float: left; margin: 5px; }
|
|
li.active span.utils .delete {
|
|
float: left; position: relative; opacity: 0.5;
|
|
top: -7px; left: 7px; width: 44px; height: 44px;
|
|
}
|
|
li.active .rename {
|
|
padding: 8px 14px 20px 14px;
|
|
top: 0px; position: absolute; width: 16px; height: 16px;
|
|
opacity: 0.5;
|
|
display: inline-block !important;
|
|
}
|
|
li.active span.utils .delete img { margin: 14px; }
|
|
li.active .rename { opacity: 0.5; }
|
|
li.active span.utils .delete:hover, li.active .rename:hover { opacity: 1; }
|
|
span.utils .delete, .rename { display: none; }
|
|
#app-navigation ul li.active > span.utils .delete,
|
|
#app-navigation ul li.active > span.utils .rename { display: block; }
|
|
#usersearchform {
|
|
position: absolute;
|
|
top: 2px;
|
|
right: 0;
|
|
}
|
|
#usersearchform input {
|
|
width: 150px;
|
|
}
|
|
#usersearchform label { font-weight: 700; }
|
|
|
|
/* display table at full width */
|
|
table.grid {
|
|
width: 100%;
|
|
}
|
|
|
|
table.grid th { height:2em; color:#999; }
|
|
table.grid th, table.grid td { border-bottom:1px solid #ddd; padding:0 .5em; padding-left:.8em; text-align:left; font-weight:normal; }
|
|
td.name, td.password { padding-left:.8em; }
|
|
td.password>img,td.displayName>img, td.remove>a, td.quota>img { visibility:hidden; }
|
|
td.password, td.quota, td.displayName { width:12em; cursor:pointer; }
|
|
td.password>span, td.quota>span, rd.displayName>span { margin-right: 1.2em; color: #C7C7C7; }
|
|
span.usersLastLoginTooltip { white-space: nowrap; }
|
|
|
|
/* dropdowns will be relative to this element */
|
|
#userlist {
|
|
position: relative;
|
|
}
|
|
#userlist .mailAddress,
|
|
#userlist .storageLocation,
|
|
#userlist .userBackend,
|
|
#userlist .lastLogin {
|
|
display : none;
|
|
}
|
|
|
|
/* because of accessibility the name cell is <th> - therefore we enforce the black color */
|
|
#userlist th.name {
|
|
color: #000000;
|
|
}
|
|
|
|
#newuser .groups {
|
|
display: inline;
|
|
}
|
|
|
|
#newuser .groupsListContainer.hidden,
|
|
#userlist .groupsListContainer.hidden {
|
|
display: none;
|
|
}
|
|
|
|
tr:hover>td.password>span, tr:hover>td.displayName>span { margin:0; cursor:pointer; }
|
|
tr:hover>td.remove>a, tr:hover>td.password>img,tr:hover>td.displayName>img, tr:hover>td.quota>img { visibility:visible; cursor:pointer; }
|
|
td.remove {
|
|
width: 25px;
|
|
}
|
|
tr:hover>td.remove>a {
|
|
float: left;
|
|
}
|
|
|
|
div.recoveryPassword { left:50em; display:block; position:absolute; top:-1px; }
|
|
input#recoveryPassword {width:15em;}
|
|
#controls select.quota {
|
|
margin: 3px;
|
|
margin-right: 10px;
|
|
height: 37px;
|
|
}
|
|
select.quota-user { position:relative; left:0; top:0; width:10em; }
|
|
select.quota.active { background: #fff; }
|
|
|
|
input.userFilter {width: 200px;}
|
|
|
|
/* positioning fixes */
|
|
#newuser {
|
|
padding-left: 3px;
|
|
}
|
|
#newuser .multiselect {
|
|
min-width: 150px !important;
|
|
}
|
|
#newuser .multiselect,
|
|
#newusergroups + input[type='submit'] {
|
|
position: relative;
|
|
top: -1px;
|
|
}
|
|
#headerGroups,
|
|
#headerSubAdmins,
|
|
#headerQuota {
|
|
padding-left: 18px;
|
|
}
|
|
#headerAvatar {
|
|
width: 32px;
|
|
}
|
|
|
|
|
|
.ie8 table.hascontrols{border-collapse:collapse;width: 100%;}
|
|
.ie8 table.hascontrols tbody tr{border-collapse:collapse;border: 1px solid #ddd !important;}
|
|
|
|
/* used to highlight a user row in red */
|
|
#userlist tr.row-warning {
|
|
background-color: #FDD;
|
|
}
|
|
|
|
|
|
/* APPS */
|
|
|
|
.appinfo { margin: 1em 40px; }
|
|
#app-navigation .appwarning {
|
|
background: #fcc;
|
|
}
|
|
#app-navigation.appwarning:hover {
|
|
background: #fbb;
|
|
}
|
|
|
|
span.version {
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
color: #555;
|
|
}
|
|
|
|
#app-navigation .app-external,
|
|
.app-version {
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
|
|
filter: alpha(opacity=50);
|
|
opacity: .5;
|
|
}
|
|
|
|
.app-level {
|
|
margin-top: 8px;
|
|
}
|
|
.app-level span {
|
|
color: #555;
|
|
background-color: transparent;
|
|
border: 1px solid #555;
|
|
border-radius: 3px;
|
|
padding: 3px 6px;
|
|
}
|
|
.app-level .official {
|
|
border-color: #37ce02;
|
|
background-position: left center;
|
|
background-position: 5px center;
|
|
padding-left: 25px;
|
|
}
|
|
.app-level .approved {
|
|
border-color: #e8c805;
|
|
}
|
|
.app-level .experimental {
|
|
background-color: #ce3702;
|
|
border-color: #ce3702;
|
|
color: #fff;
|
|
}
|
|
.apps-experimental {
|
|
color: #ce3702;
|
|
}
|
|
|
|
.app-score {
|
|
position: relative;
|
|
top: 4px;
|
|
}
|
|
|
|
#apps-list {
|
|
position: relative;
|
|
height: 100%;
|
|
}
|
|
.section {
|
|
position: relative;
|
|
}
|
|
.section h2.app-name {
|
|
margin-bottom: 8px;
|
|
}
|
|
.app-image {
|
|
float: left;
|
|
padding-right: 10px;
|
|
width: 80px;
|
|
height: 80px;
|
|
}
|
|
.app-image img {
|
|
max-width: 80px;
|
|
max-height: 80px;
|
|
}
|
|
.app-image-icon img {
|
|
background-color: #ccc;
|
|
width: 60px;
|
|
padding: 10px;
|
|
border-radius: 3px;
|
|
}
|
|
.app-name,
|
|
.app-version,
|
|
.app-score,
|
|
.app-level {
|
|
display: inline-block;
|
|
}
|
|
|
|
.app-description-toggle-show,
|
|
.app-description-toggle-hide {
|
|
clear: both;
|
|
padding: 7px 0;
|
|
cursor: pointer;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
|
|
opacity: .5;
|
|
}
|
|
.app-description-container {
|
|
clear: both;
|
|
position: relative;
|
|
top: 7px;
|
|
}
|
|
|
|
.app-description {
|
|
clear: both;
|
|
}
|
|
.app-description pre {
|
|
white-space: pre-line;
|
|
}
|
|
|
|
#app-category-1 {
|
|
margin-bottom: 18px;
|
|
}
|
|
/* capitalize "Other" category */
|
|
#app-category-925 {
|
|
text-transform: capitalize;
|
|
}
|
|
|
|
.app-dependencies {
|
|
color: #ce3702;
|
|
}
|
|
|
|
.missing-dependencies {
|
|
list-style: initial;
|
|
list-style-type: initial;
|
|
list-style-position: inside;
|
|
}
|
|
|
|
/* Transition to complete width! */
|
|
.app:hover, .app:active { max-width: inherit; }
|
|
|
|
.appslink { text-decoration: underline; }
|
|
.score { color:#666; font-weight:bold; font-size:0.8em; }
|
|
|
|
.appinfo .documentation {
|
|
margin-top: 1em;
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
|
|
/* LOG */
|
|
#log {
|
|
white-space:normal;
|
|
margin-bottom: 14px;
|
|
}
|
|
#lessLog { display:none; }
|
|
table.grid td.date{
|
|
white-space: nowrap;
|
|
}
|
|
|
|
/* ADMIN */
|
|
#security-warning li {
|
|
list-style: initial;
|
|
margin: 10px 0;
|
|
}
|
|
#security-warning-state span {
|
|
padding-left: 25px;
|
|
background-position: 5px center;
|
|
margin-left: -5px;
|
|
}
|
|
|
|
#shareAPI p { padding-bottom: 0.8em; }
|
|
#shareAPI input#shareapiExpireAfterNDays {width: 25px;}
|
|
#shareAPI .indent {
|
|
padding-left: 28px;
|
|
}
|
|
#shareAPI .double-indent {
|
|
padding-left: 56px;
|
|
}
|
|
#fileSharingSettings h3 {
|
|
display: inline-block;
|
|
}
|
|
|
|
/* correctly display help icons next to headings */
|
|
.icon-info {
|
|
padding: 11px 20px;
|
|
vertical-align: text-bottom;
|
|
}
|
|
#shareAPI h2,
|
|
#encryptionAPI h2,
|
|
#mail_general_settings h2 {
|
|
display: inline-block;
|
|
}
|
|
|
|
#encryptionAPI li {
|
|
list-style-type: initial;
|
|
margin-left: 20px;
|
|
padding: 5px 0;
|
|
}
|
|
|
|
.mail_settings p label:first-child {
|
|
display: inline-block;
|
|
width: 300px;
|
|
text-align: right;
|
|
}
|
|
.mail_settings p select:nth-child(2) {
|
|
width: 143px;
|
|
}
|
|
#mail_smtpport {
|
|
width: 40px;
|
|
}
|
|
|
|
.cronlog {
|
|
margin-left: 10px;
|
|
}
|
|
.status {
|
|
display: inline-block;
|
|
height: 16px;
|
|
width: 16px;
|
|
vertical-align: text-bottom;
|
|
}
|
|
.status.success {
|
|
border-radius: 50%;
|
|
}
|
|
|
|
#selectGroups select {
|
|
-moz-box-sizing: border-box;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
display: inline-block;
|
|
height: 36px;
|
|
padding: 7px 10px
|
|
}
|
|
|
|
#log .log-message {
|
|
word-break: break-all;
|
|
min-width: 180px;
|
|
}
|
|
|
|
span.success {
|
|
background: #37ce02;
|
|
border-radius: 3px;
|
|
}
|
|
span.error {
|
|
background: #ce3702;
|
|
}
|
|
span.indeterminate {
|
|
background: #e6db00;
|
|
border-radius: 40% 0;
|
|
}
|
|
|
|
/* PASSWORD */
|
|
#passwordform .strengthify-wrapper {
|
|
position: absolute;
|
|
left: 186px;
|
|
width: 131px;
|
|
margin-top: -7px;
|
|
}
|
|
|
|
.ie8 .strengthify-wrapper {
|
|
left: 389px;
|
|
}
|
|
|
|
.onlyInIE8 {
|
|
display: none;
|
|
}
|
|
|
|
.ie8 .onlyInIE8 {
|
|
display: inline;
|
|
}
|
|
|
|
/* OPERA hack for strengthify*/
|
|
doesnotexist:-o-prefocus, .strengthify-wrapper {
|
|
left: 185px;
|
|
width: 129px;
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/* HELP */
|
|
|
|
.help-includes {
|
|
overflow: hidden !important;
|
|
}
|
|
|
|
.help-iframe {
|
|
width: 100%;
|
|
height: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
border: 0;
|
|
overflow: auto;
|
|
}
|
|
|
|
#postsetupchecks .loading {
|
|
height: 50px;
|
|
background-position: left center;
|
|
}
|
|
|
|
#postsetupchecks .errors,
|
|
#postsetupchecks .warnings,
|
|
#security-warning > ul {
|
|
color: #ce3702;
|
|
}
|
|
|
|
#admin-tips li {
|
|
list-style: initial;
|
|
}
|
|
#admin-tips li a {
|
|
display: inline-block;
|
|
padding: 3px 0;
|
|
}
|
|
|
|
#selectEncryptionModules {
|
|
margin-left: 30px;
|
|
padding: 10px;
|
|
}
|
|
|
|
#encryptionModules {
|
|
padding: 10px;
|
|
}
|
|
|
|
#warning {
|
|
color: red;
|
|
}
|