base.html 3.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1">
  6. <link
  7. rel="stylesheet"
  8. href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
  9. integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh"
  10. crossorigin="anonymous"
  11. />
  12. <link
  13. rel="stylesheet"
  14. href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
  15. crossorigin="anonymous"
  16. />
  17. <link
  18. rel="stylesheet"
  19. href="static/css/custom.css"
  20. />
  21. <link rel = "icon" href ="static/icons/balloon-heart.svg" type = "image/x-icon" class="brand-icon">
  22. <title>{% block title %}Matcsh.{% endblock %}</title>
  23. </head>
  24. <body>
  25. <nav class="navbar navbar-expand-md">
  26. <img src="static/icons/balloon-heart.svg" class="navbar-brand">
  27. <p class="navbar-text">Matcsh.</p>
  28. <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar"> <!-- for mobile devices -->
  29. <span class="navbar-toggler-icon"></span>
  30. </button>
  31. <div class="collapse navbar-collapse" id="navbar">
  32. <div class="navbar-nav">
  33. {% if user.is_authenticated %} <!-- shows only if user is logged in -->
  34. <a class="nav-item nav-link" id="profile" href="/">Profile</a>
  35. <a class="nav-item nav-link" id="matchbook" href="/matchbook">Matchbook</a>
  36. <a class="nav-item nav-link" id="logout" href="/logout">Logout</a>
  37. {% else %}
  38. <a class="nav-item nav-link" id="login" href="/login">Login</a>
  39. <a class="nav-item nav-link" id="register" href="/register">Register</a>
  40. {% endif %}
  41. </div>
  42. </div>
  43. </nav>
  44. <!-- For Flash Errors to User -->
  45. {% with messages = get_flashed_messages(with_categories=true) %}
  46. {% if messages %}
  47. {% for category, message in messages %}
  48. {% if category == 'error' %}
  49. <div class="alert alert-danger alter-dismissable fade show", role="alert">
  50. {{ message }}
  51. <button type="button" class="close" data-dismiss="alert">
  52. <span aria-hidden="true">&times;</span> <!-- fancy button styling-->
  53. </button>
  54. </div>
  55. {% else %}
  56. <div class="alert alert-success alter-dismissable fade show", role="alert">
  57. {{ message }}
  58. <button type="button" class="close" data-dismiss="alert">
  59. <span aria-hidden="true">&times;</span> <!-- fancy button styling-->
  60. </button>
  61. </div>
  62. {% endif %}
  63. {% endfor %}
  64. {% endif %}
  65. {% endwith %}
  66. <div class="container">
  67. {% block content %}
  68. {% endblock %}
  69. </div>
  70. <script
  71. src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
  72. integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
  73. crossorigin="anonymous">
  74. </script>
  75. <script
  76. src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
  77. integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
  78. crossorigin="anonymous">
  79. </script>
  80. <script
  81. src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
  82. integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
  83. crossorigin="anonymous">
  84. </script>
  85. </body>
  86. </html>