1
0

common.css 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
  1. /**
  2. * PrivateBin
  3. *
  4. * Common cascading style sheets for all templates.
  5. *
  6. * @link https://github.com/PrivateBin/PrivateBin
  7. * @copyright 2012 Sébastien SAUVAGE (sebsauvage.net)
  8. * @license https://www.opensource.org/licenses/zlib-license.php The zlib/libpng License
  9. */
  10. #attachmentPreview {
  11. display: flex;
  12. flex-direction: column;
  13. align-items: center;
  14. }
  15. #attachmentPreview img {
  16. max-width: 100%;
  17. height: auto;
  18. margin-bottom: 20px;
  19. }
  20. #attachmentPreview .pdfPreview {
  21. width: 100%;
  22. height: 100vh;
  23. margin-bottom: 20px;
  24. }
  25. #dropzone {
  26. text-align: center;
  27. position: fixed;
  28. top: 0;
  29. left: 0;
  30. width: 100%;
  31. height: 100%;
  32. z-index: 1000;
  33. opacity: 0.6;
  34. background-color: #9cf;
  35. background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96zM14 13v4h-4v-4H7l5-5 5 5h-3z'/%3E%3C/svg%3E");
  36. background-repeat: no-repeat;
  37. background-position: center;
  38. background-size: 25vh;
  39. outline: 2px dashed #28f;
  40. outline-offset: -50px;
  41. }
  42. #filewrap {
  43. transition: background-color 0.75s ease-out;
  44. }
  45. #deletelink {
  46. float: right;
  47. margin-left: 5px;
  48. }
  49. #qrcodemodalClose {
  50. float: right;
  51. }
  52. #qrcode-display {
  53. width: 200px;
  54. margin: auto;
  55. }
  56. #pastelink {
  57. display: inline;
  58. }
  59. #pastelink > a, #plaintext > a {
  60. word-wrap: break-word;
  61. }
  62. #message {
  63. height: 70dvh;
  64. }
  65. @media ((max-width: 450px) and (max-height: 950px)) {
  66. #message {
  67. height: 55dvh;
  68. }
  69. }
  70. #message, .replymessage {
  71. font-family: monospace;
  72. resize: vertical;
  73. }
  74. .comment {
  75. border-left: 1px solid #ccc;
  76. transition: background-color 0.75s ease-out;
  77. }
  78. .commentdata {
  79. white-space: pre-wrap;
  80. }
  81. .dragAndDropFile {
  82. color: #777;
  83. font-size: 1em;
  84. display: inline;
  85. white-space: normal;
  86. }
  87. .highlight {
  88. background-color: #fd8;
  89. transition: background-color 0.2s ease-in;
  90. }
  91. ::-ms-reveal {
  92. display: none;
  93. }
  94. .password-peek-container {
  95. position: relative;
  96. }
  97. button.toggle-password {
  98. position: absolute;
  99. top: 3px;
  100. right: 4px;
  101. z-index: 9;
  102. width: 2rem;
  103. height: 2rem;
  104. background: 0;
  105. border: 0;
  106. }
  107. button.toggle-password:active,
  108. button.toggle-password:focus,
  109. button.toggle-password:hover {
  110. cursor: pointer;
  111. }
  112. button.toggle-password:focus {
  113. outline: none !important;
  114. }
  115. .input-password {
  116. padding-right: calc(1.5em + 0.75rem);
  117. background-repeat: no-repeat;
  118. background-position: right calc(0.375em + 0.1875rem) center;
  119. background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
  120. }
  121. .input-password[type=text] {
  122. background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z'/%3E%3Cpath d='M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299l.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z'/%3E%3Cpath d='M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709z'/%3E%3Cpath fill-rule='evenodd' d='M13.646 14.354l-12-12 .708-.708 12 12-.708.708z'/%3E%3C/svg%3E") !important;
  123. }
  124. .input-password[type=password] {
  125. background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M16 8s-3-5.5-8-5.5S0 8 0 8s3 5.5 8 5.5S16 8 16 8zM1.173 8a13.134 13.134 0 0 0 1.66 2.043C4.12 11.332 5.88 12.5 8 12.5c2.12 0 3.879-1.168 5.168-2.457A13.134 13.134 0 0 0 14.828 8a13.133 13.133 0 0 0-1.66-2.043C11.879 4.668 10.119 3.5 8 3.5c-2.12 0-3.879 1.168-5.168 2.457A13.133 13.133 0 0 0 1.172 8z'/%3E%3Cpath fill-rule='evenodd' d='M8 5.5a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5zM4.5 8a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0z'/%3E%3C/svg%3E") !important;
  126. }
  127. [data-bs-theme=dark] .input-password[type=text] {
  128. background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' fill='%23adb5bd' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z'/%3E%3Cpath d='M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299l.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z'/%3E%3Cpath d='M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709z'/%3E%3Cpath fill-rule='evenodd' d='M13.646 14.354l-12-12 .708-.708 12 12-.708.708z'/%3E%3C/svg%3E") !important;
  129. }
  130. [data-bs-theme=dark] .input-password[type=password] {
  131. background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' fill='%23adb5bd' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M16 8s-3-5.5-8-5.5S0 8 0 8s3 5.5 8 5.5S16 8 16 8zM1.173 8a13.134 13.134 0 0 0 1.66 2.043C4.12 11.332 5.88 12.5 8 12.5c2.12 0 3.879-1.168 5.168-2.457A13.134 13.134 0 0 0 14.828 8a13.133 13.133 0 0 0-1.66-2.043C11.879 4.668 10.119 3.5 8 3.5c-2.12 0-3.879 1.168-5.168 2.457A13.133 13.133 0 0 0 1.172 8z'/%3E%3Cpath fill-rule='evenodd' d='M8 5.5a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5zM4.5 8a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0z'/%3E%3C/svg%3E") !important;
  132. }