Improved base.html navbar and added css

This commit is contained in:
2021-11-09 20:27:03 -06:00
parent f686a93852
commit e7375e6319
3 changed files with 41 additions and 16 deletions

View File

@@ -42,7 +42,9 @@ INSTALLED_APPS = [
'django.contrib.sessions', 'django.contrib.sessions',
'django.contrib.messages', 'django.contrib.messages',
'django.contrib.staticfiles', 'django.contrib.staticfiles',
'bootstrap5' 'bootstrap5',
'crispy_forms',
'benchcoach'
] ]
MIDDLEWARE = [ MIDDLEWARE = [
@@ -132,4 +134,6 @@ STATIC_URL = '/static/'
DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField' DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField'
MEDIA_URL = '/media/' MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media') MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
CRISPY_TEMPLATE_PACK = 'bootstrap4'

View File

@@ -0,0 +1,7 @@
body {
padding-top: 5rem;
}
.starter-template {
padding: 3rem 1.5rem;
text-align: center;
}

View File

@@ -1,28 +1,42 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en"> {% load bootstrap5 %} {% load static %}
{% load bootstrap5 %}
{% bootstrap_css %}
{% bootstrap_javascript %}
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>{% block title %}Title{% endblock %}</title> <title>{% block title %}Title{% endblock %}</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
{% bootstrap_css %}
{% bootstrap_javascript %}
<link rel='stylesheet' href="{% static 'base.css' %}">
</head> </head>
<body> <body class="bg-light">
<nav class="navbar navbar-expand-lg navbar-light bg-light"> <nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
<a class="navbar-brand" href={% url 'home' %}>⚾️ Bench Coach</a> <a class="navbar-brand" href="{% url 'home' %}">⚾️ Bench Coach</a>
<div class="navbar-nav">
<a class="nav-item nav-link" href="{% url 'schedule' %}">Schedule</a> <div class="collapse navbar-collapse">
<a class="nav-item nav-link" href="{% url 'players list' %}">Players</a> <ul class="navbar-nav mr-auto">
<a class="nav-item nav-link" href="{% url 'teams list' %}">Teams</a> <li>
<a class="nav-item nav-link" href="{% url 'venues list' %}">Venues</a> <a class="nav-link" href="{% url 'schedule' %}">Schedule</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'players list' %}">Players</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'teams list' %}">Teams</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'venues list' %}">Venues</a>
</li>
</ul>
</div> </div>
</nav> </nav>
<div id="content" class="container"> <main role="main" class="container">
{% block content %}{% endblock %} {% block content %}{% endblock %}
</div> </main>
</body> </body>
</html> </html>