base.html 8.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248
  1. {% load static %}
  2. <!DOCTYPE html>
  3. <html>
  4. <head>
  5. <meta charset="utf-8"/>
  6. <meta name="baidu-site-verification" content="codeva-y7kl5gdyM4"/>
  7. <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"/>
  8. <meta
  9. name="viewport"
  10. content="width=device-width, initial-scale=1, maximum-scale=2, user-scalable=no"
  11. />
  12. <meta
  13. name="description"
  14. content="CyberSicko.net"
  15. />
  16. <link rel="shortcut icon" href="{% static 'favicon.ico' %}">
  17. <meta name="keywords" content="Semantic-UI, Theme, Design, Template"/>
  18. <meta name="author" content="CyberSicko"/>
  19. <meta name="theme-color" content="#ffffff"/>
  20. <title>CyberSicko.NET</title>
  21. <link rel="preconnect" href="https://fonts.googleapis.com">
  22. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  23. <link href="https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@200;300;400;500;600;700;900&display=swap"
  24. rel="stylesheet">
  25. <link
  26. rel="stylesheet"
  27. href="{% static 'semantic.min.css' %}"
  28. type="text/css"
  29. />
  30. <link
  31. rel="stylesheet"
  32. href="{% static 'photoswipe/photoswipe.css' %}"
  33. type="text/css"
  34. />
  35. {% if is_login %}
  36. <link href="https://unpkg.com/@wangeditor/editor@latest/dist/css/style.css" rel="stylesheet">
  37. {% endif %}
  38. <style type="text/css">
  39. p {
  40. font-size: 1.2em;
  41. }
  42. body {
  43. padding-top: 54px;
  44. -webkit-font-smoothing: antialiased;
  45. -moz-font-smoothing: grayscale;
  46. }
  47. .ui.borderless.menu {
  48. background-color: #f8f8f8;
  49. {#box-shadow: none;#} flex-wrap: wrap;
  50. border: none;
  51. padding-left: 0;
  52. padding-right: 0;
  53. }
  54. .ui.borderless.menu .header.item {
  55. font-size: 18px;
  56. font-weight: 400;
  57. }
  58. .ui.mobile.only.grid .ui.menu .ui.vertical.menu {
  59. display: none;
  60. }
  61. .ui.mobile.only.grid .ui.vertical.menu .dropdown.icon {
  62. float: unset;
  63. }
  64. .ui.mobile.only.grid .ui.vertical.menu .dropdown.icon:before {
  65. content: "\f0d7";
  66. }
  67. .ui.mobile.only.grid .ui.vertical.menu .ui.dropdown.item .menu {
  68. position: static;
  69. width: 100%;
  70. background-color: unset;
  71. border: none;
  72. box-shadow: none;
  73. }
  74. .ui.mobile.only.grid .ui.vertical.menu .ui.dropdown.item .menu {
  75. margin-top: 6px;
  76. }
  77. .ui.container > .ui.message {
  78. background-color: rga(238, 238, 238);
  79. box-shadow: none;
  80. padding: 5rem 4rem;
  81. margin-top: 1rem;
  82. }
  83. .ui.message h1.ui.header {
  84. font-size: 4.5rem;
  85. }
  86. .ui.message p.lead {
  87. font-size: 1.3rem;
  88. color: #333333;
  89. line-height: 1.4;
  90. font-weight: 300;
  91. }
  92. p > a > img {
  93. width: 100px;
  94. height: 100px;
  95. }
  96. {% block css %}
  97. {% endblock %}
  98. </style>
  99. </head>
  100. <body id="root">
  101. {% if is_login %}
  102. {% csrf_token %}
  103. {% endif %}
  104. <div class="ui tablet computer only padded grid">
  105. <div class="ui top fixed borderless fluid huge menu">
  106. <div class="ui container">
  107. <a href="/" class="header item"><img style="width: 7em;" src="{% static '/img.png' %}"/></a>
  108. <a href="{% url 'index' %}" class="{% if current_category == None %}
  109. active
  110. {% else %}
  111. {% endif %} item">主页</a>
  112. {% for item in category %}
  113. {# <li class="category_li"><a href="/category/{{ item.name }}?page=1">{{ item.name }}</a></li>#}
  114. <a class="{% if current_category != None and current_category == item.name %}
  115. active
  116. {% else %}
  117. {% endif %} item" href="/category/{{ item.name }}?page=1">{{ item.name }}</a>
  118. {% endfor %}
  119. <div class="right menu">
  120. <div id="dropdown1" class="ui dropdown item right">关联<i class="dropdown icon"></i>
  121. <div class="menu">
  122. <a class="item" href="http://git.cybersicko.net"><i class="gitlab icon"></i>GOGS</a>
  123. <a class="item" href="http://files.cybersicko.net"><i class="file icon"></i>Files</a>
  124. </div>
  125. </div>
  126. <a href="/login" class="item"> <i class="icon share square"></i>
  127. Sign in</a>
  128. </div>
  129. </div>
  130. </div>
  131. </div>
  132. <div class="ui mobile only padded grid">
  133. <div class="ui top fixed borderless huge fluid menu">
  134. <a href="/" class="header item"><img style="width: 7em;" src="{% static '/img.png' %}"/></a>
  135. <div class="right menu">
  136. <div class="item">
  137. <button class="ui icon toggle basic button">
  138. <i class="content icon"></i>
  139. </button>
  140. </div>
  141. </div>
  142. <div class="ui vertical borderless fluid menu">
  143. <a href="{% url 'index' %}" class="{% if current_category == None %}
  144. active
  145. {% else %}
  146. {% endif %} item">主页</a>
  147. {% for item in category %}
  148. {# <li class="category_li"><a href="/category/{{ item.name }}?page=1">{{ item.name }}</a></li>#}
  149. <a class="{% if current_category != None and current_category == item.name %}
  150. active
  151. {% else %}
  152. {% endif %} item" href="/category/{{ item.name }}?page=1">{{ item.name }}</a>
  153. {% endfor %}
  154. <a href="/login" class="item"> <i class="icon share square"></i>
  155. Sign in</a>
  156. <div id="dropdown1" class="ui dropdown item right">关联<i class="dropdown icon"></i>
  157. <div class="menu">
  158. <a class="item" href="http://git.cybersicko.net"><i class="gitlab icon"></i>GOGS</a>
  159. <a class="item" href="http://files.cybersicko.net"><i class="file icon"></i>Files</a>
  160. </div>
  161. </div>
  162. </div>
  163. </div>
  164. </div>
  165. {% block container %}
  166. {% endblock %}
  167. <footer style="margin-top: 50px" class="ui secondary segment">
  168. <div class="ui two column stackable grid">
  169. <div class="ten wide column">
  170. <img style="width: 8rem" src="{% static '/img.png' %}">
  171. <p> © 2023 - 2023 cybersicko.net - All Rights Reserved.</p>
  172. </div>
  173. <div class="six wide column">
  174. <div class="ui left aligned container" style="margin-top:10px">
  175. <a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=50019002503732"
  176. style="display:inline-block;text-decoration:none;height:20px;line-height:20px;"><img
  177. src="{% static '/备案图标.png' %}" style="float:left;"/>
  178. <p style="float:left;height:20px;line-height:20px;margin: 0px 0px 0px 5px; color:#939393;"> 渝公网安备
  179. 50019002503732号</p></a>
  180. <a rel="nofollow"
  181. href="http://beian.miit.gov.cn/publish/query/indexFirst.action"
  182. target="_blank"><p>皖ICP备2023011943号</p></a>
  183. </div>
  184. </div>
  185. </div>
  186. </footer>
  187. <script type="application/javascript" src="{% static 'js/jquery.min.js' %}"></script>
  188. <script type="application/javascript" src="{% static 'semantic.js' %}"></script>
  189. <script type="application/javascript" src="{% static 'photoswipe/photoswipe.umd.min.js' %}"></script>
  190. <script type="application/javascript" src="{% static 'photoswipe/photoswipe-lightbox.umd.min.js' %}"></script>
  191. <script>
  192. $('#search')
  193. .search({
  194. type: 'category',
  195. minCharacters: 3,
  196. apiSettings: {
  197. url: '/search?keywords={query}'
  198. }
  199. })
  200. var lightbox = new PhotoSwipeLightbox({
  201. gallery: '.extra.images',
  202. children: 'a',
  203. // dynamic import is not supported in UMD version
  204. pswpModule: PhotoSwipe
  205. });
  206. lightbox.init();
  207. $(document).ready(function () {
  208. $(".ui.toggle.button").click(function () {
  209. $(".mobile.only.grid .ui.vertical.menu").toggle(100);
  210. });
  211. $(".ui.dropdown").dropdown();
  212. });
  213. </script>
  214. {% block js %}
  215. {% endblock %}
  216. <script>
  217. </script>
  218. </body>
  219. </html>