public.css 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276
  1. @charset "UTF-8";
  2. /**
  3. * @copyright Copyright (c) 2018, John Molakvoæ (skjnldsv@protonmail.com)
  4. *
  5. * @author John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
  6. *
  7. * @license GNU AGPL version 3 or any later version
  8. *
  9. * This program is free software: you can redistribute it and/or modify
  10. * it under the terms of the GNU Affero General Public License as
  11. * published by the Free Software Foundation, either version 3 of the
  12. * License, or (at your option) any later version.
  13. *
  14. * This program is distributed in the hope that it will be useful,
  15. * but WITHOUT ANY WARRANTY; without even the implied warranty of
  16. * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
  17. * GNU Affero General Public License for more details.
  18. *
  19. * You should have received a copy of the GNU Affero General Public License
  20. * along with this program. If not, see <http://www.gnu.org/licenses/>.
  21. *
  22. */
  23. #preview {
  24. text-align: center;
  25. }
  26. #preview .notCreatable {
  27. display: none;
  28. }
  29. #noPreview {
  30. display: none;
  31. padding-top: 80px;
  32. }
  33. #imgframe {
  34. height: 75%;
  35. padding-bottom: 32px;
  36. padding-top: 32px;
  37. width: 80%;
  38. margin: 0 auto;
  39. }
  40. #imgframe #viewer {
  41. height: 100%;
  42. width: 100%;
  43. }
  44. #imgframe img {
  45. max-height: calc(100vh - var(--header-height) - 65px - 200px - 16px) !important;
  46. max-width: 100% !important;
  47. width: unset !important;
  48. }
  49. #imgframe :not(#viewer) img {
  50. min-width: 100px;
  51. }
  52. #imgframe video {
  53. max-height: calc(100vh - var(--header-height) - 65px - 200px - 16px);
  54. }
  55. #imgframe .plyr:fullscreen video {
  56. max-height: unset;
  57. }
  58. #imgframe audio {
  59. display: block;
  60. margin-left: auto;
  61. margin-right: auto;
  62. }
  63. #imgframe #viewer[data-handler=audios] {
  64. margin-top: 400px;
  65. }
  66. #imgframe .plyr {
  67. top: 0px !important;
  68. }
  69. #imgframe .text-preview {
  70. display: inline-block;
  71. position: relative;
  72. text-align: left;
  73. white-space: pre-wrap;
  74. overflow-y: scroll;
  75. height: auto;
  76. min-height: 200px;
  77. max-height: 800px;
  78. }
  79. #imgframe .ellipsis {
  80. font-size: 1.2em;
  81. }
  82. #imgframe .viewer__file {
  83. height: 100%;
  84. width: 100%;
  85. }
  86. #imgframe .plyr {
  87. max-height: 100%;
  88. }
  89. .app-files_sharing #app-content footer {
  90. position: sticky !important;
  91. }
  92. /* fix multiselect bar offset on shared page */
  93. thead {
  94. left: 0 !important;
  95. }
  96. #data-upload-form {
  97. position: relative;
  98. right: 0;
  99. height: 32px;
  100. overflow: hidden;
  101. padding: 0;
  102. float: right;
  103. display: inline;
  104. margin: 0;
  105. }
  106. /* keep long file names in one line to not overflow download button on mobile */
  107. .directDownload #downloadFile {
  108. white-space: nowrap;
  109. overflow: hidden;
  110. text-overflow: ellipsis;
  111. max-width: 90%;
  112. display: inline-block;
  113. margin-left: auto;
  114. margin-right: auto;
  115. margin-top: 16px;
  116. }
  117. .download-size {
  118. opacity: 0.5;
  119. }
  120. /* header buttons */
  121. #details {
  122. display: inline-flex;
  123. }
  124. #details button,
  125. #details input,
  126. #details .button {
  127. margin: 0 5px;
  128. line-height: normal;
  129. }
  130. #details button:hover,
  131. #details input:hover,
  132. #details .button:hover {
  133. /* No */
  134. border-color: rgba(0, 0, 0, 0.3) !important;
  135. }
  136. #public-upload .avatardiv {
  137. margin: 0 auto;
  138. }
  139. .emptycontent.has-note {
  140. margin-top: 5vh;
  141. }
  142. #public-upload .emptycontent h2 {
  143. margin: 10px 0 5px 0;
  144. }
  145. #public-upload .emptycontent h2 + p {
  146. margin-bottom: 30px;
  147. }
  148. #public-upload .emptycontent .icon-folder {
  149. height: 16px;
  150. width: 16px;
  151. background-size: 16px;
  152. display: inline-block;
  153. vertical-align: text-top;
  154. margin-bottom: 0;
  155. margin-right: 5px;
  156. opacity: 1;
  157. }
  158. #public-upload .emptycontent #displayavatar .icon-folder {
  159. height: 48px;
  160. width: 48px;
  161. background-size: 48px;
  162. }
  163. #public-upload .emptycontent .button {
  164. display: inline-block;
  165. height: auto;
  166. width: auto;
  167. background-size: 16px;
  168. background-position: 16px;
  169. opacity: 0.7;
  170. font-size: 20px;
  171. line-height: initial;
  172. margin: 20px;
  173. padding: 10px 20px;
  174. padding-left: 42px;
  175. }
  176. #public-upload .emptycontent ul {
  177. width: 230px;
  178. margin: 5px auto 5vh;
  179. text-align: left;
  180. }
  181. #public-upload .emptycontent li {
  182. overflow: hidden;
  183. text-overflow: ellipsis;
  184. white-space: nowrap;
  185. padding: 7px 0;
  186. }
  187. #public-upload .emptycontent li img {
  188. margin-right: 5px;
  189. position: relative;
  190. top: 2px;
  191. }
  192. #drop-upload-progress-indicator span.icon-loading-small {
  193. padding-left: 18px;
  194. margin-right: 7px;
  195. }
  196. #drop-uploaded-files li #drop-upload-name {
  197. float: left;
  198. max-width: 180px;
  199. text-overflow: ellipsis;
  200. white-space: nowrap;
  201. overflow: hidden;
  202. }
  203. #drop-uploaded-files li #drop-upload-status {
  204. float: right;
  205. }
  206. .disclaimer,
  207. .note {
  208. margin: 0 auto 30px;
  209. max-width: 400px;
  210. text-align: left;
  211. }
  212. #note-content {
  213. padding: 5px;
  214. display: inline-block;
  215. width: 350px;
  216. }
  217. #note-content .content {
  218. overflow: auto;
  219. max-height: 200px;
  220. }
  221. #show-terms-dialog {
  222. cursor: pointer;
  223. font-weight: bold;
  224. }
  225. @media only screen and (min-width: 1025px) {
  226. #body-public .header-right #header-actions-menu > ul > li#download {
  227. display: none;
  228. }
  229. }
  230. @media only screen and (max-width: 1024px) {
  231. #body-public .header-right #header-primary-action {
  232. display: none;
  233. }
  234. }
  235. /*# sourceMappingURL=public.css.map */