{% load static %} <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"/> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=2, user-scalable=no" /> <meta name="description" content="CyberSicko.net" /> <link rel="shortcut icon" href="{% static 'favicon.ico' %}"> <meta name="keywords" content="Semantic-UI, Theme, Design, Template"/> <meta name="author" content="CyberSicko"/> <meta name="theme-color" content="#ffffff"/> <title>CyberSicko.NET</title> <link rel="stylesheet" href="{% static 'semantic.min.css' %}" type="text/css" /> <link rel="stylesheet" href="{% static 'photoswipe/photoswipe.css' %}" type="text/css" /> {% if is_login %} <link href="https://unpkg.com/@wangeditor/editor@latest/dist/css/style.css" rel="stylesheet"> {% endif %} <style type="text/css"> p { font-size: 1.2em; } body { padding-top: 54px; -webkit-font-smoothing: antialiased; -moz-font-smoothing: grayscale; } .ui.borderless.menu { background-color: #f8f8f8; {#box-shadow: none;#} flex-wrap: wrap; border: none; padding-left: 0; padding-right: 0; } .ui.borderless.menu .header.item { font-size: 18px; font-weight: 400; } .ui.mobile.only.grid .ui.menu .ui.vertical.menu { display: none; } .ui.mobile.only.grid .ui.vertical.menu .dropdown.icon { float: unset; } .ui.mobile.only.grid .ui.vertical.menu .dropdown.icon:before { content: "\f0d7"; } .ui.mobile.only.grid .ui.vertical.menu .ui.dropdown.item .menu { position: static; width: 100%; background-color: unset; border: none; box-shadow: none; } .ui.mobile.only.grid .ui.vertical.menu .ui.dropdown.item .menu { margin-top: 6px; } .ui.container > .ui.message { background-color: rga(238, 238, 238); box-shadow: none; padding: 5rem 4rem; margin-top: 1rem; } .ui.message h1.ui.header { font-size: 4.5rem; } .ui.message p.lead { font-size: 1.3rem; color: #333333; line-height: 1.4; font-weight: 300; } p > a > img { width: 100px; height: 100px; } {% block css %} {% endblock %} </style> </head> <body id="root"> {% if is_login %} {% csrf_token %} {% endif %} <div class="ui tablet computer only padded grid"> <div class="ui top fixed borderless fluid huge menu"> <div class="ui container"> <a href="/" class="header item"><img style="width: 7em;" src="{% static '/img.png' %}"/></a> <a href="{% url 'index' %}" class="{% if current_category == None %} active {% else %} {% endif %} item">主页</a> {% for item in category %} {# <li class="category_li"><a href="/category/{{ item.name }}?page=1">{{ item.name }}</a></li>#} <a class="{% if current_category != None and current_category == item.name %} active {% else %} {% endif %} item" href="/category/{{ item.name }}?page=1">{{ item.name }}</a> {% endfor %} <div class="right menu"> <a href="http://git.cybersicko.net" class="item"> <i class="icon gitlab "></i> Git Repository</a> <a href="/login" class="item"> <i class="icon share square"></i> Sign in</a> </div> </div> </div> </div> <div class="ui mobile only padded grid"> <div class="ui top fixed borderless huge fluid menu"> <a href="/" class="header item"><img style="width: 7em;" src="{% static '/img.png' %}"/></a> <div class="right menu"> <div class="item"> <button class="ui icon toggle basic button"> <i class="content icon"></i> </button> </div> </div> <div class="ui vertical borderless fluid menu"> <a href="{% url 'index' %}" class="{% if current_category == None %} active {% else %} {% endif %} item">主页</a> {% for item in category %} {# <li class="category_li"><a href="/category/{{ item.name }}?page=1">{{ item.name }}</a></li>#} <a class="{% if current_category != None and current_category == item.name %} active {% else %} {% endif %} item" href="/category/{{ item.name }}?page=1">{{ item.name }}</a> {% endfor %} <a href="/login" class="item"> <i class="icon share square"></i> Sign in</a> </div> </div> </div> {% block container %} {% endblock %} <div class="ui divider"></div> <footer> <div style="text-align: center;height: 40px"><p>@2024 C.J</p></div> </footer> <script type="application/javascript" src="{% static 'js/jquery.min.js' %}"></script> <script type="application/javascript" src="{% static 'semantic.js' %}"></script> <script type="application/javascript" src="{% static 'photoswipe/photoswipe.umd.min.js' %}"></script> <script type="application/javascript" src="{% static 'photoswipe/photoswipe-lightbox.umd.min.js' %}"></script> <script> $('#search') .search({ type: 'category', minCharacters: 3, apiSettings: { url: '/search?keywords={query}' } }) var lightbox = new PhotoSwipeLightbox({ gallery: '.extra.images', children: 'a', // dynamic import is not supported in UMD version pswpModule: PhotoSwipe }); lightbox.init(); $(document).ready(function () { $(".ui.toggle.button").click(function () { $(".mobile.only.grid .ui.vertical.menu").toggle(100); }); $(".ui.dropdown").dropdown(); }); </script> {% block js %} {% endblock %} <script> </script> </body> </html>