Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Consolidate user/group share actions into single dropdown #36587

152 changes: 99 additions & 53 deletions apps/files_sharing/css/sharetabview.css
Original file line number Diff line number Diff line change
Expand Up @@ -39,59 +39,6 @@
margin-right: 0;
}

#shareWithList {
list-style-type: none;
padding : 0 0 16px;
}

#shareWithList li {
padding-top : 5px;
padding-bottom: 5px;
font-weight : bold;
white-space : normal;
}

#shareWithList .showCruds img,
#shareWithList .unshare img {
vertical-align: text-bottom;
/* properly align icons */
}

#shareWithList label input[type=checkbox] {
margin-left: 0;
position : relative;
}

#shareWithList .username {
padding-right : 8px;
white-space : nowrap;
text-overflow : ellipsis;
max-width : 254px;
display : inline-block;
overflow : hidden;
vertical-align: middle;
}

#shareWithList li label {
margin-right: 8px;
}

#shareWithList li .expiration {
max-width: 100px;
text-align: left;
margin: 0 0 0 5px;
}

#shareWithList li .removeExpiration {
text-indent: -9999px;
border: 0 none;
transform: translate(calc(-100% - 2px), -1px);
background-color: #F8F8F8;
background-position: center;
background-repeat: no-repeat;
background-image: url('../../../core/img/actions/close.svg');
}

.shareTabView .icon-loading-small {
display : inline-block;
z-index : 1;
Expand All @@ -113,6 +60,15 @@
background-size: 16px 16px;
}

.shareTabView .action-item {
display: inherit;
opacity: .5;
}

.shareTabView .action-item + .action-item {
margin-left: 5px;
}

.shareTabView .privacyWarningMessage {
margin-top: 20px;
}
Expand Down Expand Up @@ -321,4 +277,94 @@
color: red;
padding: 4px;
display: block;
}

/* ---------------------------------------------------- ShareWithList --- */

.shareWithList {
list-style-type : none;
padding : 0 0 16px;
}

[class^='shareWithList__item'] {
display : flex;
justify-content : space-between;
flex-wrap : wrap;
padding-top : 10px;
padding-bottom : 10px;
font-weight : bold;
}

.shareWithList__item--detailed {
background-color: #f8f8f8;
margin-left: -15px;
margin-right: -15px;
padding: 10px 15px;
}

.shareWithList__item--detailed + .shareWithList__item--detailed {
border-top: 1px solid #eee
}

[class^='shareWithList__container'] {
display : flex;
align-items : center;
}

.shareWithList__container--left {
justify-content: flex-start;
}

.shareWithList__container--right {
justify-content: flex-end;
}

.shareWithList__item label input[type=checkbox] {
margin-left: 0;
position : relative;
}

.shareWithList__item .username {
padding-right : 8px;
white-space : nowrap;
text-overflow : ellipsis;
max-width : 254px;
display : inline-block;
overflow : hidden;
vertical-align: middle;
}

.shareWithList__item label {
margin-right: 8px;
}

.shareWithList__item .expiration {
max-width: 190px;
text-align: left;
margin: 0 0 0 5px;
}

.shareWithList__item .removeExpiration {
text-indent: -9999px;
border: 0 none;
transform: translate(calc(-100% - 5px), -1px);
background-color: #F8F8F8;
background-position: center;
background-repeat: no-repeat;
background-image: url('../../../core/img/actions/close.svg');
}

.shareWithList__item .toggleShareDetails {
display: inherit;
opacity: 0.5;
}

.shareWithList__details {
width: 100%;
background-color: #f8f8f8;
}

.shareWithList__details-group:first-of-type,
.shareWithList__details-group + .shareWithList__details-group {
margin-top: 10px;
}
4 changes: 4 additions & 0 deletions core/css/icons.css
Original file line number Diff line number Diff line change
Expand Up @@ -321,6 +321,10 @@ img.icon-loading-small-dark, object.icon-loading-small-dark, video.icon-loading-
background-image: url('../img/actions/starred.svg');
}

.icon-time {
background-image: url('../img/actions/time.svg');
}

.icon-toggle {
background-image: url('../img/actions/toggle.svg');
}
Expand Down
22 changes: 0 additions & 22 deletions core/css/share.css
Original file line number Diff line number Diff line change
Expand Up @@ -95,14 +95,6 @@
padding: 8px;
}

#shareWithList li {
padding-top: 10px;
padding-bottom: 10px;
font-weight: bold;
line-height: 21px;
white-space: normal;
}

#shareWithList .shareOption {
white-space: nowrap;
display: inline-block;
Expand Down Expand Up @@ -143,20 +135,6 @@
vertical-align: middle;
}

a.showCruds {
display: inline;
opacity: 0.5;
}

a.unshare {
display: inline;
float: right;
opacity: 0.5;
padding: 10px;
margin-top: -5px;
margin-right: -10px;
}

#link {
border-top: 1px solid #ddd;
padding-top: 8px;
Expand Down
1 change: 1 addition & 0 deletions core/img/actions/time.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 4 additions & 0 deletions core/img/actions/time.svg:Zone.Identifier
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
[ZoneTransfer]
ZoneId=3
ReferrerUrl=https://material.io/resources/icons/?search=time&icon=access_time&style=baseline
HostUrl=https://fonts.gstatic.com/s/i/materialicons/access_time/v1/24px.svg?download=true
Loading