上下ナビバー
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 |
{% load static %} <html lang="ja"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content=""> <meta name="author" content=""> <title>{% block title %}{% endblock %}</title> <!-- Bootstrap core CSS --> <link href="{% static 'wonder/css/styles.css' %}" rel="stylesheet"> <!-- Custom fonts for this template --> <link href="https://fonts.googleapis.com/css?family=Catamaran:100,200,300,400,500,600,700,800,900" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i" rel="stylesheet"> <!-- Custom styles for this template --> <link href="{% static 'wonder/css/mystyles.css' %}" rel="stylesheet"> <!-- My style --> <link rel="stylesheet" type="text/css" href="{% static 'css/mystyle.css' %}"> {% block head %}{% endblock %} </head> <body> <div id="wrapper"> <!-- Navigation --> <nav class="navbar navbar-expand-lg navbar-dark navbar-custom fixed-top"> <div class="container"> <!-- <a class="navbar-brand" href="">PRIVATE DIARY</a> --> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarResponsive"> <ul class="navbar-nav mr-auto"> <li class="nav-item {% block active_inquiry %}{% endblock %}"> <a class="nav-link" href="/contact/">INQUIRY</a> </li> </ul> <ul class="navbar-nav ml-auto"> {% if user.is_authenticated %} <li class="nav-item"> <a class="nav-link" href="{% url 'subscriptions:subscriptions-home' %}">Dashboard</a> </li> <li class="nav-item"> <a class="nav-link" href="/accounts/logout/">Log Out</a> </li> <li class="nav-item"> <a class="nav-link" href="{% url 'db:search' %}">Search</a> </li> {% else %} <li class="nav-item"> <a class="nav-link" href="/accounts/signup/">Sign Up</a> </li> <li class="nav-item"> <a class="nav-link" href="/accounts/login/">Log In</a> </li> {% endif %} </ul> </div> </div> </nav> {% block header%}{% endblock %} {% block contents%}{% endblock %} <nav class="navbar navbar-expand-sm navbar-dark navbar-custom p-1"> <a class="navbar-brand" href="#">ボトムナビゲーションバー</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarCollapse"> <ul class="navbar-nav mr-auto"> <li class="nav-item active"> <!-- <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a> --> <a class="nav-link" href="#">ホーム <span class="sr-only">（現在位置）</span></a> </li> <li class="nav-item"> <!-- <a class="nav-link" href="#">Link</a> --> <a class="nav-link" href="#">リンク</a> </li> <li class="nav-item"> <!-- <a class="nav-link disabled" href="#">Disabled</a> --> <a class="nav-link disabled" href="#">無効なボタン</a> </li> <li class="nav-item"> </li> <li class="nav-item dropup"> <a class="nav-link dropdown-toggle" href="https://getbootstrap.com" id="dropdown10" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropup</a> <div class="dropdown-menu" aria-labelledby="dropdown10"> <!-- <a class="dropdown-item" href="#">Action</a> --> <a class="dropdown-item" href="#">アクション</a> <!-- <a class="dropdown-item" href="#">Another action</a> --> <a class="dropdown-item" href="#">別のアクション</a> <!-- <a class="dropdown-item" href="#">Something else here</a> --> <a class="dropdown-item" href="#">異なるなにか</a> </div> </li> </ul> </div> </nav> <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script> <script> window.jQuery || document.write('<script src="/docs/4.4/assets/js/vendor/jquery-slim.min.js"><\/script>') </script><script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script><script src="/docs/4.4/assets/js/vendor/anchor.min.js"></script> <!-- Bootstrap core JavaScript --> <script src="{% static 'wonder/js/scripts.js' %}"></script> <script src="{% static 'vendor/bootstrap/js/bootstrap.bundle.min.js' %}"></script> </div> </body> </html> |