You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

share.css 3.5KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198
  1. /* Copyright (c) 2011, Jan-Christoph Borchardt, http://jancborchardt.net
  2. This file is licensed under the Affero General Public License version 3 or later.
  3. See the COPYING-README file. */
  4. #dropdown {
  5. background: #eee;
  6. border-bottom-left-radius: 3px;
  7. border-bottom-right-radius: 3px;
  8. box-shadow: 0 2px 3px rgba(50, 50, 50, .4);
  9. display: block;
  10. margin-right: 0;
  11. position: absolute;
  12. right: 0;
  13. width: 420px;
  14. z-index: 500;
  15. padding: 16px;
  16. }
  17. @media only screen and (min-width: 768px) and (max-width: 990px) {
  18. #dropdown {
  19. /* this limits the dropdown to float below the sidebar for mid narrow screens */
  20. left: 20px;
  21. }
  22. }
  23. .shareTabView .unshare.icon-loading-small {
  24. margin-top: 1px;
  25. }
  26. .shareTabView .shareWithLoading,
  27. .shareTabView .linkShare .icon-loading-small {
  28. display: inline-block !important;
  29. padding-left: 10px;
  30. }
  31. .shareTabView .shareWithLoading {
  32. position: relative;
  33. right: 70px;
  34. top: 2px;
  35. }
  36. .shareTabView .icon-loading-small.hidden {
  37. display: none !important;
  38. }
  39. .shareTabView .avatar {
  40. margin-right: 8px;
  41. display: inline-block;
  42. overflow: hidden;
  43. vertical-align: middle;
  44. width: 32px;
  45. height: 32px;
  46. }
  47. .share-autocomplete-item {
  48. display: flex;
  49. }
  50. .share-autocomplete-item .autocomplete-item-text {
  51. margin-left: 10px;
  52. margin-right: 10px;
  53. white-space: nowrap;
  54. text-overflow: ellipsis;
  55. overflow: hidden;
  56. line-height: 32px;
  57. vertical-align: middle;
  58. }
  59. #shareWithList {
  60. list-style-type:none;
  61. padding:8px;
  62. }
  63. #shareWithList li {
  64. padding-top: 10px;
  65. padding-bottom: 10px;
  66. font-weight: bold;
  67. line-height: 21px;
  68. white-space: normal;
  69. }
  70. #shareWithList .sharingOptionsGroup {
  71. position: absolute;
  72. right: 15px;
  73. }
  74. #shareWithList .sharingOptionsGroup .popovermenu {
  75. right: -22px;
  76. top: 30px;
  77. }
  78. #shareWithList .shareOption {
  79. white-space: nowrap;
  80. display: inline-block;
  81. }
  82. #shareWithList .unshare img, #shareWithList .showCruds img {
  83. vertical-align:text-bottom; /* properly align icons */
  84. }
  85. #shareWithList label input[type=checkbox]{
  86. margin-left: 0;
  87. position: relative;
  88. }
  89. #shareWithList .username{
  90. padding-right: 8px;
  91. white-space: nowrap;
  92. text-overflow: ellipsis;
  93. max-width: 254px;
  94. display: inline-block;
  95. overflow: hidden;
  96. vertical-align: middle;
  97. }
  98. #shareWithList li label{
  99. margin-right: 8px;
  100. }
  101. .shareTabView label {
  102. font-weight:400;
  103. white-space: nowrap;
  104. }
  105. .shareTabView input[type="checkbox"] {
  106. margin:0 3px 0 8px;
  107. vertical-align: middle;
  108. }
  109. a.showCruds {
  110. display:inline;
  111. opacity:.5;
  112. }
  113. a.unshare {
  114. display:inline-block;
  115. opacity:.5;
  116. padding: 10px;
  117. margin-top: -5px;
  118. }
  119. #link {
  120. border-top:1px solid #ddd;
  121. padding-top:8px;
  122. }
  123. .shareTabView input[type="submit"] {
  124. margin-left: 7px;
  125. }
  126. .shareTabView form {
  127. font-size: 100%;
  128. margin-left: 0;
  129. margin-right: 0;
  130. }
  131. .shareTabView .error {
  132. color: #e9322d;
  133. border-color: #e9322d;
  134. box-shadow: 0 0 6px #f8b9b7;
  135. }
  136. #link #showPassword img {
  137. padding-left:5px;
  138. width:12px;
  139. }
  140. .reshare,#link label,
  141. #expiration label {
  142. display: inline-block;
  143. padding: 6px 4px;
  144. }
  145. a.showCruds:hover,a.unshare:hover {
  146. opacity:1;
  147. }
  148. #defaultExpireMessage, /* fix expire message going out of box */
  149. .reshare { /* fix shared by text going out of box */
  150. white-space:normal;
  151. }
  152. #defaultExpireMessage { /* show message on new line */
  153. display: block;
  154. padding-left: 4px;
  155. /* TODO: style the dropdown in a proper way - border-box, etc. */
  156. width: 90%;
  157. }
  158. .ui-autocomplete { /* limit dropdown height to 4 1/2 entries */
  159. max-height:103px;
  160. overflow-y:auto;
  161. overflow-x:hidden;
  162. }
  163. .notCreatable {
  164. padding-left: 12px;
  165. padding-top: 12px;
  166. color: #999;
  167. }
  168. .shareTabView .mailView .icon-mail {
  169. opacity: 0.5;
  170. }