server/apps/files_sharing/css/sharetabview.scss
Jan-Christoph Borchardt ce7775acd0 Replace information icon with confirmation button in share input
The confirmation button right now is just an icon; its behaviour will be
added in the following commits.

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
2018-03-20 19:09:03 +01:00

144 lines
2.6 KiB
SCSS

.app-files .shareTabView {
min-height: 100px;
}
.shareTabView .oneline {
white-space: nowrap;
position: relative;
}
.shareTabView .shareWithLoading {
padding-left: 10px;
right: 35px;
top: 0px;
}
.shareTabView .shareWithConfirm,
.shareTabView .clipboardButton,
.shareTabView .linkPass .icon-loading-small {
position: absolute;
right: -7px;
top: -2px;
padding: 14px;
}
.shareTabView .shareWithConfirm {
opacity: .5;
}
.shareTabView .shareWithField:focus ~ .shareWithConfirm {
opacity: 1;
}
.shareTabView .linkMore {
position: absolute;
right: -7px;
top: -4px;
padding: 14px;
}
/* fix the popup menu because the button is shifted and then the menu is not aligned */
.shareTabView .popovermenu.socialSharingMenu {
right: -7px;
}
.shareTabView .popovermenu .clipboardButton {
position: relative;
top: initial;
right: initial;
padding: 0;
}
.shareTabView label {
white-space: nowrap;
}
.shareTabView input[type="checkbox"] {
margin: 0 3px 0 8px;
vertical-align: middle;
}
.shareTabView input[type="text"].shareWithField,
.shareTabView input[type="text"].emailField,
.shareTabView input[type="text"].linkText,
.shareTabView input[type="password"] {
width: 100%;
box-sizing: border-box;
padding-right: 32px;
text-overflow: ellipsis;
}
.shareTabView form {
font-size: 100%;
margin-left: 0;
margin-right: 0;
}
#shareWithList {
list-style-type: none;
padding: 0 0 16px;
}
#shareWithList > li {
padding-top: 5px;
padding-bottom: 5px;
white-space: normal;
display: inline-flex;
align-items: center;
}
#shareWithList .unshare img {
vertical-align: text-bottom; /* properly align icons */
}
#shareWithList .sharingOptionsGroup > a .icon {
padding: 7px;
vertical-align: middle;
opacity: .5;
}
#shareWithList .sharingOptionsGroup .popovermenu:after {
right: 3px;
}
#shareWithList label input[type=checkbox] {
margin-left: 0;
position: relative;
}
#shareWithList .username {
padding-right: 8px;
white-space: nowrap;
text-overflow: ellipsis;
display: inline-block;
overflow: hidden;
vertical-align: middle;
}
#shareWithList li .sharingOptionsGroup > .shareOption > label {
padding: 6px;
margin-right: 8px;
vertical-align: text-top;
}
.shareTabView .icon-loading-small {
display: inline-block;
z-index: 1;
vertical-align: text-top;
}
.shareTabView .shareWithList .icon-loading-small:not(.hidden) + span,
.shareTabView .linkShareView .icon-loading-small:not(.hidden) + input + label:before {
/* Hide if loader is visible */
display: none !important;
}
.linkShareView {
margin-top: 16px;
}
.shareTabView .linkPass .icon-loading-small {
margin-right: 0px;
}
.shareTabView .icon {
background-size: 16px 16px;
}