use whitenoise

This commit is contained in:
KenwoodFox 2025-12-03 13:10:39 -05:00
parent 28336aa268
commit c12aedeb20
7 changed files with 267 additions and 247 deletions

View File

@ -2,10 +2,16 @@ FROM python:3.11-slim
WORKDIR /app
COPY . /app
RUN pip install --upgrade pip
RUN pip install --upgrade gunicorn
COPY requirements.txt /app
RUN pip install --no-cache-dir -r requirements.txt
RUN pip install --upgrade gunicorn
COPY . /app
# Collect static files for WhiteNoise
RUN python manage.py collectstatic --noinput
CMD ["gunicorn", "seduttomachineworks_project.wsgi:application", "--bind", "0.0.0.0:8000"]

View File

@ -1,2 +1,3 @@
Django>=4.2,<5.0
whitenoise>=6.0,<7.0

View File

@ -16,7 +16,7 @@ BASE_DIR = Path(__file__).resolve().parent.parent
SECRET_KEY = os.environ.get("SECRET_KEY", "django-insecure-change-this-in-production")
# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = os.environ.get("DEBUG", "True") == "True"
DEBUG = os.environ.get("DEBUG", "False") == "True"
ALLOWED_HOSTS = os.environ.get("ALLOWED_HOSTS", "*").split(",")
@ -32,6 +32,7 @@ INSTALLED_APPS = [
MIDDLEWARE = [
"django.middleware.security.SecurityMiddleware",
"whitenoise.middleware.WhiteNoiseMiddleware",
"django.contrib.sessions.middleware.SessionMiddleware",
"django.middleware.common.CommonMiddleware",
"django.middleware.csrf.CsrfViewMiddleware",
@ -87,6 +88,10 @@ USE_TZ = True
STATIC_URL = "static/"
STATIC_ROOT = BASE_DIR / "staticfiles"
STATICFILES_DIRS = [BASE_DIR / "static"]
# WhiteNoise configuration for serving static files
STATICFILES_STORAGE = "whitenoise.storage.CompressedManifestStaticFilesStorage"
MEDIA_URL = "media/"
MEDIA_ROOT = BASE_DIR / "media"

124
static/css/quote_upload.css Normal file
View File

@ -0,0 +1,124 @@
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,
body {
height: 100%;
}
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background: transparent;
}
.upload-box {
width: 100%;
min-height: 100vh;
background: white;
padding: 16px;
display: flex;
flex-direction: column;
}
h2 {
margin-bottom: 20px;
color: #333;
}
.drop-area {
border: 2px dashed #ccc;
border-radius: 4px;
padding: 24px;
text-align: center;
cursor: pointer;
transition: all 0.3s;
}
.drop-area:hover {
border-color: #666;
background: #f9f9f9;
}
.drop-area.dragover {
border-color: #0066cc;
background: #e6f2ff;
}
.drop-area p + p {
font-size: 14px;
color: #666;
margin-top: 10px;
}
input[type="file"] {
display: none;
}
.file-list {
margin-top: 20px;
display: none;
}
.file-list.show {
display: block;
}
.file-item {
padding: 10px;
background: #f9f9f9;
margin-bottom: 5px;
border-radius: 4px;
}
button {
margin-top: 20px;
padding: 12px 24px;
background: #0066cc;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
width: 100%;
}
button:hover {
background: #0052a3;
}
button:disabled {
background: #ccc;
cursor: not-allowed;
}
.todo {
margin-top: 20px;
padding: 10px;
background: #fff3cd;
border: 1px solid #ffc107;
border-radius: 4px;
font-size: 14px;
color: #856404;
}
footer {
margin-top: auto;
text-align: right;
font-size: 12px;
color: #888;
}
footer a {
color: #666;
text-decoration: none;
}
footer a:hover {
text-decoration: underline;
}

122
static/css/test_iframe.css Normal file
View File

@ -0,0 +1,122 @@
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: Arial, sans-serif;
background: #f5f5f5;
padding: 20px;
}
.test-container {
max-width: 1200px;
margin: 0 auto;
}
h1 {
color: #333;
margin-bottom: 10px;
}
.test-info {
background: #e3f2fd;
border-left: 4px solid #2196f3;
padding: 15px;
margin-bottom: 20px;
border-radius: 4px;
}
.test-info p {
margin: 5px 0;
color: #1976d2;
}
.iframe-wrapper {
background: white;
border: 2px solid #ddd;
border-radius: 8px;
padding: 10px;
margin-bottom: 30px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.iframe-wrapper h2 {
margin-bottom: 10px;
color: #555;
font-size: 18px;
}
.iframe-container {
width: 100%;
border: 1px solid #ccc;
border-radius: 4px;
overflow: hidden;
background: white;
}
iframe {
width: 100%;
border: none;
display: block;
}
.size-controls {
margin-top: 10px;
padding: 10px;
background: #f9f9f9;
border-radius: 4px;
}
.size-controls label {
margin-right: 15px;
color: #666;
}
.size-controls input[type="number"] {
width: 80px;
padding: 5px;
border: 1px solid #ccc;
border-radius: 4px;
margin: 0 5px;
}
.size-presets {
margin-top: 10px;
}
.size-presets button {
padding: 5px 15px;
margin-right: 10px;
background: #2196f3;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 12px;
}
.size-presets button:hover {
background: #1976d2;
}
.full-width {
width: 100%;
}
.mobile {
max-width: 375px;
margin: 0 auto;
}
.tablet {
max-width: 768px;
margin: 0 auto;
}
.desktop {
max-width: 1024px;
margin: 0 auto;
}

View File

@ -1,3 +1,4 @@
{% load static %}
<!DOCTYPE html>
<html lang="en">
@ -5,125 +6,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Request a Quote</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,
body {
height: 100%;
}
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background: transparent;
}
.upload-box {
width: 100%;
min-height: 100vh;
background: white;
padding: 16px;
display: flex;
flex-direction: column;
}
h2 {
margin-bottom: 20px;
color: #333;
}
.drop-area {
border: 2px dashed #ccc;
border-radius: 4px;
padding: 24px;
text-align: center;
cursor: pointer;
transition: all 0.3s;
}
.drop-area:hover {
border-color: #666;
background: #f9f9f9;
}
.drop-area.dragover {
border-color: #0066cc;
background: #e6f2ff;
}
input[type="file"] {
display: none;
}
.file-list {
margin-top: 20px;
display: none;
}
.file-list.show {
display: block;
}
.file-item {
padding: 10px;
background: #f9f9f9;
margin-bottom: 5px;
border-radius: 4px;
}
button {
margin-top: 20px;
padding: 12px 24px;
background: #0066cc;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
width: 100%;
}
button:hover {
background: #0052a3;
}
button:disabled {
background: #ccc;
cursor: not-allowed;
}
.todo {
margin-top: 20px;
padding: 10px;
background: #fff3cd;
border: 1px solid #ffc107;
border-radius: 4px;
font-size: 14px;
color: #856404;
}
footer {
margin-top: auto;
text-align: center;
font-size: 12px;
color: #888;
}
footer a {
color: #666;
text-decoration: none;
}
footer a:hover {
text-decoration: underline;
}
</style>
<link rel="stylesheet" href="{% static 'css/quote_upload.css' %}">
</head>
<body>
@ -131,7 +14,7 @@
<h2>Request a Quote</h2>
<div class="drop-area" id="dropArea">
<p>Drag & drop files here</p>
<p style="font-size: 14px; color: #666; margin-top: 10px;">or click to browse</p>
<p>or click to browse</p>
<input type="file" id="fileInput" multiple>
</div>
<div class="file-list" id="fileList"></div>

View File

@ -1,3 +1,4 @@
{% load static %}
<!DOCTYPE html>
<html lang="en">
@ -5,129 +6,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Iframe Test - Quote Upload</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: Arial, sans-serif;
background: #f5f5f5;
padding: 20px;
}
.test-container {
max-width: 1200px;
margin: 0 auto;
}
h1 {
color: #333;
margin-bottom: 10px;
}
.test-info {
background: #e3f2fd;
border-left: 4px solid #2196f3;
padding: 15px;
margin-bottom: 20px;
border-radius: 4px;
}
.test-info p {
margin: 5px 0;
color: #1976d2;
}
.iframe-wrapper {
background: white;
border: 2px solid #ddd;
border-radius: 8px;
padding: 10px;
margin-bottom: 30px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.iframe-wrapper h2 {
margin-bottom: 10px;
color: #555;
font-size: 18px;
}
.iframe-container {
width: 100%;
border: 1px solid #ccc;
border-radius: 4px;
overflow: hidden;
background: white;
}
iframe {
width: 100%;
border: none;
display: block;
}
.size-controls {
margin-top: 10px;
padding: 10px;
background: #f9f9f9;
border-radius: 4px;
}
.size-controls label {
margin-right: 15px;
color: #666;
}
.size-controls input[type="number"] {
width: 80px;
padding: 5px;
border: 1px solid #ccc;
border-radius: 4px;
margin: 0 5px;
}
.size-presets {
margin-top: 10px;
}
.size-presets button {
padding: 5px 15px;
margin-right: 10px;
background: #2196f3;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 12px;
}
.size-presets button:hover {
background: #1976d2;
}
.full-width {
width: 100%;
}
.mobile {
max-width: 375px;
margin: 0 auto;
}
.tablet {
max-width: 768px;
margin: 0 auto;
}
.desktop {
max-width: 1024px;
margin: 0 auto;
}
</style>
<link rel="stylesheet" href="{% static 'css/test_iframe.css' %}">
</head>
<body>