Skip to content
Snippets Groups Projects
Commit 15da3f0d authored by j5-burt's avatar j5-burt
Browse files

html changes

parent a1fd6c89
No related branches found
No related tags found
No related merge requests found
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<title>ShallowSink - Home</title> <title>ShallowSink - Home</title>
{% load static %} {% load static %}
<link rel="stylesheet" href="{% static 'styles.css' %}"> <link rel="stylesheet" href="{% static 'styles.css' %}">
<style> <style>
/* General Styles */ /* General Styles */
body { html, body {
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
margin: 0; margin: 0;
padding: 0; padding: 0;
...@@ -14,6 +14,14 @@ ...@@ -14,6 +14,14 @@
color: #333; color: #333;
height: 100%; height: 100%;
} }
/* Page wrapper to ensure footer at bottom */
.page-wrapper {
min-height: 100%;
display: flex;
flex-direction: column;
}
header { header {
background-color: #004085; background-color: #004085;
color: #ffffff; color: #ffffff;
...@@ -24,7 +32,7 @@ ...@@ -24,7 +32,7 @@
/* Navbar Styles */ /* Navbar Styles */
.nav-container { .nav-container {
display: flex; display: flex;
justify-content: space-between; justify-content: center;
align-items: center; align-items: center;
max-width: 1200px; max-width: 1200px;
margin: 0 auto; margin: 0 auto;
...@@ -32,24 +40,33 @@ ...@@ -32,24 +40,33 @@
} }
.logo h1 { .logo h1 {
margin: 0; margin: 0;
font-size: 24px; font-size: 28px;
text-align: center;
} }
.auth-links {
/* Auth Buttons */
.auth-buttons {
display: flex; display: flex;
gap: 10px; justify-content: center;
gap: 20px;
margin-top: 40px;
} }
.auth-links .btn { .big-btn {
color: #ffffff; color: #ffffff;
background-color: #004085;
text-decoration: none; text-decoration: none;
padding: 8px 16px; padding: 15px 30px;
border: 2px solid #ffffff; border: 2px solid #004085;
border-radius: 4px; border-radius: 6px;
font-weight: bold; font-weight: bold;
font-size: 18px;
transition: 0.3s; transition: 0.3s;
display: inline-block;
} }
.auth-links .btn:hover { .big-btn:hover {
background-color: #ffffff; background-color: #002d5e;
color: #004085; transform: translateY(-3px);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
} }
/* Main Content */ /* Main Content */
...@@ -58,8 +75,7 @@ ...@@ -58,8 +75,7 @@
margin: 40px auto; margin: 40px auto;
padding: 0 20px; padding: 0 20px;
text-align: center; text-align: center;
flex: 1; flex: 1; /* This will push the footer down */
height: 100%;
} }
.intro h1 { .intro h1 {
font-size: 36px; font-size: 36px;
...@@ -78,8 +94,7 @@ ...@@ -78,8 +94,7 @@
color: #ffffff; color: #ffffff;
text-align: center; text-align: center;
padding: 10px 0; padding: 10px 0;
margin-top: 40px; width: 100%;
bottom: 0;
} }
footer p { footer p {
margin: 0; margin: 0;
...@@ -87,16 +102,13 @@ ...@@ -87,16 +102,13 @@
</style> </style>
</head> </head>
<body> <body>
<div class="page-wrapper">
<header> <header>
<nav> <nav>
<div class="nav-container"> <div class="nav-container">
<div class="logo"> <div class="logo" style="margin: 0 auto;">
<h1>ShallowSink</h1> <h1>ShallowSink</h1>
</div> </div>
<div class="auth-links">
<a href="{% url 'login' %}" class="btn">Login</a>
<a href="{% url 'register' %}" class="btn">Register</a>
</div>
</div> </div>
</nav> </nav>
</header> </header>
...@@ -105,14 +117,20 @@ ...@@ -105,14 +117,20 @@
<section class="intro"> <section class="intro">
<h1>Welcome to ShallowSink</h1> <h1>Welcome to ShallowSink</h1>
<p>Your trusted platform for making better tech decisions.</p> <p>Your trusted platform for making better tech decisions.</p>
<div class="auth-buttons">
<a href="{% url 'login' %}" class="big-btn">Login</a>
<a href="{% url 'register' %}" class="big-btn">Register</a>
</div>
</section> </section>
{% block content %}
{% endblock %}
</main> </main>
<footer> <footer>
<p>&copy; 2025 ShallowSink</p> <p>&copy; 2025 ShallowSink</p>
</footer> </footer>
{% block content %} </div>
{% endblock %}
</body> </body>
</html> </html>
\ No newline at end of file
...@@ -81,20 +81,60 @@ ...@@ -81,20 +81,60 @@
<div class="container"> <div class="container">
<p><a href="{% url 'profile' %}" style="display: inline-block; background-color: #4CAF50; color: white; text-decoration: none; padding: 10px 15px; border-radius: 5px; font-weight: bold; margin-bottom: 20px; transition: background-color 0.3s ease;">Return to Profile</a></p> <p><a href="{% url 'profile' %}" style="display: inline-block; background-color: #4CAF50; color: white; text-decoration: none; padding: 10px 15px; border-radius: 5px; font-weight: bold; margin-bottom: 20px; transition: background-color 0.3s ease;">Return to Profile</a></p>
<form action="" method="POST" enctype="multipart/form-data"> <form action="" method="POST" enctype="multipart/form-data">
{% csrf_token %}
{% for model in models %} {% for model in models %}
<h2>{{ model.modelTitle }}</h2> <h2>{{ model.modelTitle }}</h2>
<p>Uploaded by: {{ model.username }}</p> <p>Uploaded by: {{ model.username }}</p>
<p>{{ model.modelDescription }}</p> <p>{{ model.modelDescription }}</p>
<hr> <hr>
{% endfor %} {% endfor %}
<h1>Upload your CSV</h1> <h1>Upload your CSV</h1>
{% csrf_token %} {# Render hidden username field #}
{{ form.as_p }} {{ form.username }}
{# Render uploadedFile field #}
<div class="form-group">
<label for="{{ form.uploadedFile.id_for_label }}">{{ form.uploadedFile.label }}:</label>
{{ form.uploadedFile }}
{% if form.uploadedFile.help_text %}
<small>{{ form.uploadedFile.help_text }}</small>
{% endif %}
{% if form.uploadedFile.errors %}
<span class="error">{{ form.uploadedFile.errors }}</span>
{% endif %}
</div>
{# Render targetColumn field #}
<div class="form-group">
<label>{{ form.targetColumn.label }}:</label>
{{ form.targetColumn }}
{% if form.targetColumn.help_text %}
<small>{{ form.targetColumn.help_text }}</small>
{% endif %}
{% if form.targetColumn.errors %}
<span class="error">{{ form.targetColumn.errors }}</span>
{% endif %}
</div>
{# Replace chosenML with dropdown #}
<div class="form-group">
<label for="model-select">{{ form.chosenML.label }}:</label>
<select id="model-select" name="chosenML">
<option value="">-- Select a model --</option>
{% for model in models %}
<option value="{{ model.modelTitle }}">{{ model.modelTitle }}</option>
{% endfor %}
</select>
{% if form.chosenML.errors %}
<span class="error">{{ form.chosenML.errors }}</span>
{% endif %}
</div>
<input type="submit" value="Submit"> <input type="submit" value="Submit">
</form> </form>
</div> </div>
</body> </body>
</html> </html>
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment