diff --git a/core/css/share.scss b/core/css/share.scss new file mode 100644 index 0000000000..a72437c4ae --- /dev/null +++ b/core/css/share.scss @@ -0,0 +1,199 @@ +/* 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. */ + +#dropdown { + background: #eee; + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; + box-shadow: 0 2px 3px rgba(50, 50, 50, 0.4); + display: block; + margin-right: 0; + position: absolute; + right: 0; + width: 420px; + z-index: 500; + padding: 16px; +} + +@media only screen and (min-width: 768px) and (max-width: 990px) { + #dropdown { + /* this limits the dropdown to float below the sidebar for mid narrow screens */ + left: 20px; + } +} + +.shareTabView { + .unshare.icon-loading-small { + margin-top: 1px; + } + .shareWithLoading, .linkShare .icon-loading-small { + display: inline-block !important; + padding-left: 10px; + } + .shareWithLoading { + position: relative; + right: 70px; + top: 2px; + } + .icon-loading-small.hidden { + display: none !important; + } + .avatar { + margin-right: 8px; + display: inline-block; + overflow: hidden; + vertical-align: middle; + width: 32px; + height: 32px; + } +} + +.share-autocomplete-item { + display: flex; + .autocomplete-item-text { + margin-left: 10px; + margin-right: 10px; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + line-height: 32px; + vertical-align: middle; + } +} + +#shareWithList { + list-style-type: none; + padding: 8px; + li { + padding-top: 10px; + padding-bottom: 10px; + font-weight: bold; + line-height: 21px; + white-space: normal; + width: 100%; + } + .sharingOptionsGroup { + flex-shrink: 0; + position: relative; + .popovermenu { + right: -6px; + top: 40px; + padding: 3px 6px; + } + } + .shareOption { + white-space: nowrap; + display: inline-block; + } + .unshare img, .showCruds img { + vertical-align: text-bottom; + /* properly align icons */ + } + label input[type=checkbox] { + margin-left: 0; + position: relative; + } + .username { + padding-right: 8px; + white-space: nowrap; + text-overflow: ellipsis; + display: inline-block; + overflow: hidden; + vertical-align: middle; + flex-grow: 5; + } + li label { + margin-right: 8px; + } +} + +.shareTabView { + label { + font-weight: 400; + white-space: nowrap; + } + input[type='checkbox'] { + margin: 0 3px 0 8px; + vertical-align: middle; + } +} + +a { + &.showCruds { + display: inline; + opacity: .5; + } + &.unshare { + display: inline-block; + opacity: .5; + padding: 10px; + } +} + +#link { + border-top: 1px solid #ddd; + padding-top: 8px; +} + +.shareTabView { + input[type='submit'] { + margin-left: 7px; + } + form { + font-size: 100%; + margin-left: 0; + margin-right: 0; + } + .error { + color: #e9322d; + border-color: #e9322d; + box-shadow: 0 0 6px #f8b9b7; + } +} + +#link #showPassword img { + padding-left: 5px; + width: 12px; +} + +.reshare, #link label, #expiration label { + display: inline-block; + padding: 6px 4px; +} + +a { + &.showCruds:hover, &.unshare:hover { + opacity: 1; + } +} + +#defaultExpireMessage, .reshare { + /* fix shared by text going out of box */ + white-space: normal; +} + +#defaultExpireMessage { + /* show message on new line */ + display: block; + padding-left: 4px; + /* TODO: style the dropdown in a proper way - border-box, etc. */ + width: 90%; +} + +.ui-autocomplete { + /* limit dropdown height to 4 1/2 entries */ + max-height: 200px; + overflow-y: auto; + overflow-x: hidden; +} + +.notCreatable { + padding-left: 12px; + padding-top: 12px; + color: #999; +} + +.shareTabView .mailView .icon-mail { + opacity: 0.5; +}