nextcloud/apps/files_sharing/css/sharetabview.scss

283 lines
4.7 KiB
SCSS
Raw Normal View History

.app-files .shareTabView {
min-height: 100px;
}
.share-autocomplete-item {
display: flex;
&.merged {
margin-left: 32px;
}
.autocomplete-item-text {
margin-left: 10px;
margin-right: 10px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
line-height: 32px;
vertical-align: middle;
flex-grow: 1;
.ui-state-highlight {
border: none;
margin: 0;
}
}
&.with-description {
.autocomplete-item-text {
line-height: 100%;
}
}
.autocomplete-item-details {
display: block;
line-height: 130%;
font-size: 90%;
opacity: 0.7;
}
.icon {
opacity: .7;
margin-right: 7px;
}
}
.shareTabView {
.oneline {
white-space: nowrap;
position: relative;
}
.shareWithLoading {
padding-left: 10px;
right: 35px;
top: 3px;
}
.shareWithConfirm {
position: absolute;
right: 2px;
top: 6px;
padding: 14px;
opacity: 0.5;
}
.shareWithField:focus ~ .shareWithConfirm {
opacity: 1;
}
.linkMore {
position: absolute;
right: -7px;
top: -4px;
padding: 14px;
}
.popovermenu {
.linkPassMenu {
.share-pass-submit {
width: auto !important;
}
.icon-loading-small {
background-color: var(--color-main-background);
position: absolute;
right: 8px;
margin: 3px;
padding: 10px;
width: 32px;
height: 32px;
z-index: 10;
}
}
.datepicker {
margin-left: 35px;
}
.share-add {
input.share-note-delete {
border: none;
background-color: transparent;
width: 44px !important;
padding: 0;
flex: 0 0 44px;
margin-left: auto;
&.hidden {
display: none;
}
}
}
// note
.share-note-form {
span.icon-note {
position: relative;
}
textarea.share-note {
margin: 0;
width: 200px;
min-height: 70px;
resize: none;
+ input.share-note-submit {
position: absolute;
width: 44px !important;
height: 44px;
bottom: 0px;
right: 10px;
margin: 0;
background-color: transparent;
border: none;
opacity: .7;
&:hover,
&:focus,
&:active {
opacity: 1;
}
}
}
// fix for popover link share
&.share-note-link {
margin-bottom: 10px;
}
}
/* Border above last entry '+ Add another share' to separate it from current link settings */
.new-share {
border-top: 1px solid var(--color-border);
}
}
.linkPass .icon-loading-small {
margin-right: 0px;
}
.icon {
background-size: 16px 16px;
}
.shareWithList .icon-loading-small:not(.hidden) + span,
.linkShareView .icon-loading-small:not(.hidden) + input + label:before {
/* Hide if loader is visible */
display: none !important;
}
input {
&[type='checkbox'] {
margin: 0 3px 0 8px;
vertical-align: middle;
}
&[type='text'] {
&.shareWithField,
&.emailField {
width: 100%;
box-sizing: border-box;
padding-right: 32px;
text-overflow: ellipsis;
}
}
&[type='text'].linkText
&[type='password'].linkPassText,
&[type='password'].passwordField {
width: 180px !important;
}
}
form {
font-size: 100%;
margin-left: 0;
margin-right: 0;
}
// share note on the sidebar
.share-note {
border-radius: var(--border-radius);
margin-bottom: 10px;
margin-left: 37px;
}
}
// Sharing tab users list
.shareWithList {
2015-09-17 14:17:56 +03:00
list-style-type: none;
display: flex;
flex-direction: column;
> li {
height: 44px;
white-space: normal;
display: inline-flex;
align-items: center;
position: relative;
.avatar {
width: 32px;
height: 32px;
background-color: var(--color-primary);
}
}
.unshare img {
vertical-align: text-bottom;
/* properly align icons */
}
.sharingOptionsGroup {
margin-left: auto;
display: flex;
align-items: center;
white-space: nowrap;
// icons
> .icon:not(.hidden),
.share-menu > .icon:not(.hidden) {
padding: 14px;
height: 44px;
width: 44px;
opacity: .5;
display: block;
cursor: pointer;
&:hover,
&:focus,
&:active {
opacity: .7;;
}
}
// more menu
> .share-menu {
position: relative;
display: block;
}
}
.username {
padding: 0 8px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
.ui-autocomplete {
/* limit dropdown height to 6 1/2 entries */
max-height: calc(36px * 6.5);
overflow-y: auto;
overflow-x: hidden;
z-index: 1550 !important;
}
.notCreatable {
padding-left: 12px;
padding-top: 12px;
color: var(--color-text-lighter);
}
.contactsmenu-popover {
left: -6px;
right: auto;
padding: 3px 6px;
top: 100%;
margin-top: 0;
li.hidden {
display: none !important;
}
&:after {
left: 8px;
right: auto;
}
}
.reshare,
#link label,
#expiration label {
display: inline-flex;
align-items: center;
.avatar {
margin-right: 5px;
}
}
.resharerInfoView.subView {
position: relative;
}