main-blocked.html 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160
  1. <!DOCTYPE html>
  2. <!-- ***************************************************************************
  3. ηMatrix - a browser extension to black/white list requests.
  4. Copyright (C) 2019 Alessio Vanni
  5. This program is free software: you can redistribute it and/or modify
  6. it under the terms of the GNU General Public License as published by
  7. the Free Software Foundation, either version 3 of the License, or
  8. (at your option) any later version.
  9. This program is distributed in the hope that it will be useful,
  10. but WITHOUT ANY WARRANTY; without even the implied warranty of
  11. MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
  12. GNU General Public License for more details.
  13. You should have received a copy of the GNU General Public License
  14. along with this program. If not, see {http://www.gnu.org/licenses/}.
  15. Home: https://gitlab.com/vannilla/ematrix
  16. uMatrix Home: https://github.com/gorhill/uMatrix
  17. -->
  18. <html>
  19. <head>
  20. <meta name="viewport" content="width=device-width, initial-scale=1">
  21. <title></title>
  22. <link rel="stylesheet" href="css/common.css" type="text/css">
  23. <style>
  24. body {
  25. font-family: sans-serif;
  26. font-size: large;
  27. text-align: center;
  28. }
  29. body > div {
  30. margin: 1.5em 0;
  31. }
  32. body > div > p {
  33. margin: 4px 0;
  34. }
  35. body > div > p:first-child {
  36. margin: 1.5em 0 0 0;
  37. }
  38. .code {
  39. background-color: rgba(0, 0, 0, 0.1);
  40. display: inline-block;
  41. font-family: monospace;
  42. font-size: large;
  43. line-height: 1.2;
  44. padding: 2px 4px;
  45. word-break: break-all;
  46. }
  47. button {
  48. cursor: pointer;
  49. margin: 0 1em 0.25em 1em;
  50. padding: 0.25em 0.5em;
  51. font-size: inherit;
  52. }
  53. #theURL {
  54. margin: 0.25em 0;
  55. padding: 0;
  56. }
  57. #theURL > * {
  58. margin: 0;
  59. }
  60. #theURL > p {
  61. position: relative;
  62. z-index: 10;
  63. }
  64. #theURL > p > span {
  65. background-color: transparent;
  66. top: 100%;
  67. box-sizing: border-box;
  68. cursor: pointer;
  69. opacity: 0.5;
  70. padding: 0.2em;
  71. position: absolute;
  72. transform: translate(0, -50%);
  73. }
  74. body[dir="ltr"] #theURL > p > span {
  75. right: 0;
  76. }
  77. body[dir="rtl"] #theURL > p > span {
  78. left: 0;
  79. }
  80. #theURL > p:hover > span {
  81. opacity: 1;
  82. }
  83. #theURL > p > span:before {
  84. content: '\f010';
  85. }
  86. #theURL.collapsed > p > span:before {
  87. content: '\f00e';
  88. }
  89. #parsed {
  90. background-color: #f8f8f8;
  91. border: 1px solid rgba(0, 0, 0, 0.1);
  92. border-top: none;
  93. color: gray;
  94. font-size: small;
  95. overflow-x: hidden;
  96. padding: 4px;
  97. text-align: initial;
  98. text-overflow: ellipsis;
  99. }
  100. #theURL.collapsed > #parsed {
  101. display: none;
  102. }
  103. #parsed ul, #parsed li {
  104. list-style-type: none;
  105. }
  106. #parsed li {
  107. white-space: nowrap;
  108. }
  109. #parsed span {
  110. display: inline-block;
  111. }
  112. #parsed span:first-of-type {
  113. font-weight: bold;
  114. }
  115. #warningSign {
  116. margin: 1e, 0;
  117. opacity: 1;
  118. pointer-events: none;
  119. width: 100%;
  120. }
  121. #warningSign > span {
  122. color: #f2a500;
  123. font-size: 180px;
  124. }
  125. </style>
  126. </head>
  127. <body>
  128. <div id="warningSign"><span class="fa">&#xf071;</span></div>
  129. <div>
  130. <p data-i18n="mainBlockedPrompt1"></p>
  131. <div id="theURL" class="collapsed">
  132. <p class="what code"></p>
  133. <ul id="parsed"></ul>
  134. </div>
  135. </div>
  136. <!-- <div>
  137. <p data-i18n="mainBlockedPrompt2"></p>
  138. <p id="why" class="code"></p>
  139. </div>
  140. -->
  141. <div>
  142. <p><button id="back" data-i18n="mainBlockedBack" type="button"></button>
  143. <button id="bye" data-i18n="mainBlockedClose" type="button"></button></p>
  144. </div>
  145. <script src="js/vapi-common.js"></script>
  146. <script src="js/vapi-client.js"></script>
  147. <script src="js/udom.js"></script>
  148. <script src="js/i18n.js"></script>
  149. <script src="js/main-blocked.js"></script>
  150. </body>
  151. </html>