This commit is contained in:
sofordar 2025-02-24 16:30:01 +06:00
parent a26ef551ee
commit 333e5dff05
11 changed files with 221 additions and 1061 deletions

View File

@ -1,177 +0,0 @@
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
line-height: 1.6;
color: #333;
max-width: 80%;
margin: 0 auto;
padding: 20px;
background-color: #f4f6f9;
}
.form-container {
max-width: 800px;
margin: 20px auto;
padding: 20px;
background: #ffffff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
h1 {
color: #2c3e50;
text-align: center;
border-bottom: 3px solid #3498db;
padding-bottom: 10px;
margin-bottom: 20px;
font-size: 24px;
font-weight: bold;
}
h3 {
color: #2980b9;
margin-top: 25px;
border-left: 4px solid #3498db;
padding-left: 10px;
}
p {
text-align: justify;
margin-bottom: 15px;
}
list {
display: block;
margin-left: 30px;
}
list li {
margin-bottom: 10px;
position: relative;
padding-left: 20px;
}
list li::before {
content: '•';
color: #3498db;
font-weight: bold;
position: absolute;
left: -20px;
}
.form-title {
color: #2c3e50;
text-align: center;
margin-bottom: 30px;
font-size: 24px;
font-weight: bold;
}
.form-table {
width: 100%;
border-collapse: separate;
border-spacing: 0 15px;
}
.form-table th {
text-align: left;
padding: 8px;
color: #34495e;
font-weight: 600;
width: 30%;
vertical-align: middle;
}
.form-table input[type="text"],
.form-table input[type="date"] {
width: 90%;
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 14px;
transition: border-color 0.3s;
}
.form-table input[type="text"]:focus,
.form-table input[type="date"]:focus {
border-color: #3498db;
outline: none;
box-shadow: 0 0 5px rgba(52,152,219,0.3);
}
.form-table input[type="file"] {
padding: 8px 0;
}
.submit-btn {
background-color: #3498db;
color: white;
padding: 10px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
transition: background-color 0.3s;
}
.submit-btn:hover {
background-color: #2980b9;
}
.file-input-wrapper {
position: relative;
}
.file-input-label {
display: inline-block;
background-color: #f8f9fa;
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 4px;
cursor: pointer;
}
.alert {
background-color: #d4edda;
color: #155724;
padding: 15px;
margin: 10px 0;
border-radius: 4px;
border: 1px solid #c3e6cb;
animation: fadeOut 5s forwards;
}
@keyframes fadeOut {
0% { opacity: 1; }
90% { opacity: 1; }
100% { opacity: 0; }
}
/* Responsive design */
@media (max-width: 768px) {
.form-container {
margin: 10px;
padding: 15px;
}
.form-table th {
width: 100%;
display: block;
}
.form-table td {
width: 100%;
display: block;
}
body {
padding: 10px;
}
h1 {
font-size: 24px;
}
h3 {
font-size: 20px;
}
}

View File

@ -9,7 +9,7 @@ body {
background-color: #2c3e50; background-color: #2c3e50;
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0 20px; padding: 10px 20px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1); box-shadow: 0 2px 4px rgba(0,0,0,0.1);
} }
@ -20,8 +20,8 @@ body {
} }
.logo { .logo {
width: 50px; width: 80px;
height: 50px; height: 80px;
background-color: white; background-color: white;
border-radius: 50%; border-radius: 50%;
display: flex; display: flex;
@ -31,8 +31,8 @@ body {
} }
.logo img { .logo img {
max-width: 40px; max-width: 80px;
max-height: 40px; max-height: 80px;
} }
.company-name { .company-name {
@ -82,8 +82,201 @@ body {
color: #2c3e50; color: #2c3e50;
padding: 12px 16px; padding: 12px 16px;
display: block; display: block;
transition: background-color 0.3s;
} }
.dropdown-content a:hover { .dropdown-content a:hover {
background-color: #f1f1f1; background-color: #f1f1f1;
} }
.content {
padding: 0 40px;
}
.form-container {
max-width: 800px;
margin: 20px auto;
padding: 20px;
background: #ffffff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
font-family: Arial, sans-serif;
}
.form-group {
margin-bottom: 15px;
}
.form-group label {
display: block;
margin-bottom: 3px;
color: #333;
font-weight: bold;
}
.form-group input, .form-table input[type="text"], .form-table input[type="date"], .form-table td input {
width: 100%;
padding: 8px;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
transition: border-color 0.3s ease;
}
.form-group input:focus, .form-table input[type="text"]:focus, .form-table input[type="date"]:focus, .form-table td input:focus {
outline: none;
border-color: #666;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
button[type="submit"], .submit-btn, .form-table td strong center input[type="Submit"] {
width: 100%;
padding: 10px;
background-color: #4CAF50;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
transition: background-color 0.3s ease;
}
button[type="submit"]:hover, .submit-btn:hover, .form-table td strong center input[type="Submit"]:hover {
background-color: #45a049;
}
.error-message {
color: #dc3545;
margin-top: 5px;
}
.form-title {
color: #2c3e50;
text-align: center;
margin-bottom: 30px;
font-size: 24px;
font-weight: bold;
}
.alert {
background-color: #d4edda;
color: #155724;
padding: 15px;
margin: 10px 0;
border-radius: 4px;
border: 1px solid #c3e6cb;
animation: fadeOut 5s forwards;
}
@keyframes fadeOut {
0% { opacity: 1; }
90% { opacity: 1; }
100% { opacity: 0; }
}
/* Responsive design */
@media (max-width: 768px) {
.form-container {
margin: 10px;
padding: 15px;
}
.form-table th, .form-table td {
width: 100%;
display: block;
}
body {
padding: 10px;
}
h1 {
font-size: 24px;
}
h3 {
font-size: 20px;
}
.table-container {
padding: 10px;
}
.records-table {
width: 100%;
overflow-x: auto;
display: block;
}
.search-box {
width: 100%;
margin-bottom: 10px;
}
}
.table-container {
max-width: 1200px;
margin: 0 auto;
padding: 20px;
}
.table-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
.table-header h2 {
color: #333;
font-size: 1.5em;
margin: 0;
}
.search-box {
padding: 8px 16px;
border-radius: 4px;
border: 1px solid #ccc;
width: 300px;
transition: border-color 0.3s ease;
}
.search-box:focus {
outline: none;
border-color: #666;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}
.records-table {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
background-color: white;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.records-table th, .records-table td {
padding: 12px;
text-align: left;
border-bottom: 1px solid #eee;
}
.records-table th {
background-color: #f8f9fa;
color: #333;
font-weight: bold;
}
.records-table tr:hover {
background-color: #f5f6fa;
}
.records-table td a {
color: #4CAF50;
text-decoration: none;
transition: color 0.3s ease;
}
.records-table td a:hover {
color: #45a049;
}

View File

@ -1,67 +0,0 @@
.table-container {
max-width: 100%;
margin: 20px auto;
padding: 20px;
background: #ffffff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
overflow-x: auto;
}
.records-table {
width: 80%%;
border-collapse: collapse;
margin-top: 20px;
}
.records-table th,
.records-table td {
padding: 12px;
text-align: left;
border-bottom: 1px solid #ddd;
}
.records-table th {
background-color: #f8f9fa;
font-weight: 600;
color: #2c3e50;
}
.records-table tr:hover {
background-color: #f5f5f5;
}
.download-link {
display: inline-block;
padding: 6px 12px;
background-color: #3498db;
color: white;
text-decoration: none;
border-radius: 4px;
font-size: 14px;
transition: background-color 0.3s;
}
.download-link:hover {
background-color: #2980b9;
}
.table-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
.search-box {
padding: 8px;
border: 1px solid #ddd;
border-radius: 4px;
width: 200px;
}
.no-records {
text-align: center;
padding: 20px;
color: #666;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 123 KiB

After

Width:  |  Height:  |  Size: 116 KiB

View File

@ -5,8 +5,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>MIS</title> <title>MIS</title>
<link rel="stylesheet" href="{% static 'css/style.css' %}"> <link rel="stylesheet" href="{% static 'css/style.css' %}">
<link rel="stylesheet" href="{% static 'css/form.css' %}">
<link rel="stylesheet" href="{% static 'css/table.css' %}">
</head> </head>
<body> <body>
<div class="navbar"> <div class="navbar">
@ -16,16 +15,12 @@
</div> </div>
<div class="company-name">Management Information System (MIS)</div> <div class="company-name">Management Information System (MIS)</div>
</div> </div>
<div class="menu-container"> <div class="menu-container">
<a href="http://localhost:8000/rcm">Home</a>
<a href="http://localhost:8000/rcm/login">Sign in</a>
<a href="http://localhost:8000/rcm/signup">Sign up</a>
{% if user.is_authenticated %} {% if user.is_authenticated %}
<a href="http://localhost:8000/rcm">Home</a> <a href="http://localhost:8000/rcm/signup">Sign up</a>
<a href="http://localhost:8000/rcm/logout">Logout</a>
<div class="dropdown"> <div class="dropdown">
<a href="#" class="dropdown-btn">Upload</a> <a href="#" class="dropdown-btn">Upload ▼</a>
<div class="dropdown-content"> <div class="dropdown-content">
<a href="http://localhost:8000/rcm/resulation">Resulation</a> <a href="http://localhost:8000/rcm/resulation">Resulation</a>
<a href="http://localhost:8000/rcm/deed">Contract</a> <a href="http://localhost:8000/rcm/deed">Contract</a>
@ -33,17 +28,19 @@
</div> </div>
</div> </div>
<div class="dropdown"> <div class="dropdown">
<a href="#" class="dropdown-btn">View</a> <a href="#" class="dropdown-btn">View</a>
<div class="dropdown-content"> <div class="dropdown-content">
<a href="http://localhost:8000/rcm/viewresulation">Resulations</a> <a href="http://localhost:8000/rcm/viewresulation">Resulations</a>
<a href="http://localhost:8000/rcm/viewdeed">Contracts</a> <a href="http://localhost:8000/rcm/viewdeed">Contracts</a>
<a href="http://localhost:8000/rcm/viewmou">MoU</a> <a href="http://localhost:8000/rcm/viewmou">MoU</a>
</div>
</div>
{% else %}
<a href="http://localhost:8000/rcm">Home</a>
<a href="http://localhost:8000/rcm/login">Sign in</a>
{% endif %} {% endif %}
</div> </div>
</div> </div>
</div>
</div>
{% block content %} {% block content %}
<br> <br>
<br> <br>
@ -68,6 +65,7 @@
{% endblock content %} {% endblock content %}
</body> </body>
<footer> <footer>
<div class="content">
copyright@MIS-DGHS, Bangladesh copyright@MIS-DGHS, Bangladesh
</div>
</footer> </footer>

View File

@ -1,6 +1,7 @@
{% extends "base.html" %} {% extends "base.html" %}
{% block content %} {% block content %}
<div class="content">
<div class="form-container"> <div class="form-container">
<h2>Login</h2> <h2>Login</h2>
{% if messages %} {% if messages %}
@ -26,4 +27,5 @@
</form> </form>
<p>Don't have an account? <a href="{% url 'signup' %}">Register here</a></p> <p>Don't have an account? <a href="{% url 'signup' %}">Register here</a></p>
</div> </div>
</div>
{% endblock %} {% endblock %}

View File

@ -1,184 +1,6 @@
{% extends "base.html" %} {% extends "base.html" %}
{% block content %} {% block content %}
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
line-height: 1.6;
color: #333;
max-width: 800px;
margin: 0 auto;
padding: 20px;
background-color: #f4f6f9;
}
.form-container {
max-width: 800px;
margin: 20px auto;
padding: 20px;
background: #ffffff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
h1 {
color: #2c3e50;
text-align: center;
border-bottom: 3px solid #3498db;
padding-bottom: 10px;
margin-bottom: 20px;
font-size: 24px;
font-weight: bold;
}
h3 {
color: #2980b9;
margin-top: 25px;
border-left: 4px solid #3498db;
padding-left: 10px;
}
p {
text-align: justify;
margin-bottom: 15px;
}
list {
display: block;
margin-left: 30px;
}
list li {
margin-bottom: 10px;
position: relative;
padding-left: 20px;
}
list li::before {
content: '•';
color: #3498db;
font-weight: bold;
position: absolute;
left: -20px;
}
.form-title {
color: #2c3e50;
text-align: center;
margin-bottom: 30px;
font-size: 24px;
font-weight: bold;
}
.form-table {
width: 100%;
border-collapse: separate;
border-spacing: 0 15px;
}
.form-table th {
text-align: left;
padding: 8px;
color: #34495e;
font-weight: 600;
width: 30%;
vertical-align: middle;
}
.form-table input[type="text"],
.form-table input[type="date"] {
width: 90%;
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 14px;
transition: border-color 0.3s;
}
.form-table input[type="text"]:focus,
.form-table input[type="date"]:focus {
border-color: #3498db;
outline: none;
box-shadow: 0 0 5px rgba(52,152,219,0.3);
}
.form-table input[type="file"] {
padding: 8px 0;
}
.submit-btn {
background-color: #3498db;
color: white;
padding: 10px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
transition: background-color 0.3s;
}
.submit-btn:hover {
background-color: #2980b9;
}
.file-input-wrapper {
position: relative;
}
.file-input-label {
display: inline-block;
background-color: #f8f9fa;
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 4px;
cursor: pointer;
}
.alert {
background-color: #d4edda;
color: #155724;
padding: 15px;
margin: 10px 0;
border-radius: 4px;
border: 1px solid #c3e6cb;
animation: fadeOut 5s forwards;
}
@keyframes fadeOut {
0% { opacity: 1; }
90% { opacity: 1; }
100% { opacity: 0; }
}
/* Responsive design */
@media (max-width: 768px) {
.form-container {
margin: 10px;
padding: 15px;
}
.form-table th {
width: 100%;
display: block;
}
.form-table td {
width: 100%;
display: block;
}
body {
padding: 10px;
}
h1 {
font-size: 24px;
}
h3 {
font-size: 20px;
}
}
</style>
{% if messages %} {% if messages %}
<div class="messages"> <div class="messages">
{% for message in messages %} {% for message in messages %}
@ -192,7 +14,7 @@
<table class="form-table"> <table class="form-table">
<tr> <tr>
<th align="left">Userneme:</th> <th align="left">Userneme:</th>
<td><input type="text" id="username" name="username" required></td> <td><input type="email" id="username" name="username" required></td>
</tr> </tr>
<tr> <tr>
<th align="left">Email:</th> <th align="left">Email:</th>

View File

@ -1,184 +1,6 @@
{% extends "base.html" %} {% extends "base.html" %}
{% block content %} {% block content %}
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
line-height: 1.6;
color: #333;
max-width: 800px;
margin: 0 auto;
padding: 20px;
background-color: #f4f6f9;
}
.form-container {
max-width: 800px;
margin: 20px auto;
padding: 20px;
background: #ffffff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
h1 {
color: #2c3e50;
text-align: center;
border-bottom: 3px solid #3498db;
padding-bottom: 10px;
margin-bottom: 20px;
font-size: 24px;
font-weight: bold;
}
h3 {
color: #2980b9;
margin-top: 25px;
border-left: 4px solid #3498db;
padding-left: 10px;
}
p {
text-align: justify;
margin-bottom: 15px;
}
list {
display: block;
margin-left: 30px;
}
list li {
margin-bottom: 10px;
position: relative;
padding-left: 20px;
}
list li::before {
content: '•';
color: #3498db;
font-weight: bold;
position: absolute;
left: -20px;
}
.form-title {
color: #2c3e50;
text-align: center;
margin-bottom: 30px;
font-size: 24px;
font-weight: bold;
}
.form-table {
width: 100%;
border-collapse: separate;
border-spacing: 0 15px;
}
.form-table th {
text-align: left;
padding: 8px;
color: #34495e;
font-weight: 600;
width: 30%;
vertical-align: middle;
}
.form-table input[type="text"],
.form-table input[type="date"] {
width: 90%;
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 14px;
transition: border-color 0.3s;
}
.form-table input[type="text"]:focus,
.form-table input[type="date"]:focus {
border-color: #3498db;
outline: none;
box-shadow: 0 0 5px rgba(52,152,219,0.3);
}
.form-table input[type="file"] {
padding: 8px 0;
}
.submit-btn {
background-color: #3498db;
color: white;
padding: 10px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
transition: background-color 0.3s;
}
.submit-btn:hover {
background-color: #2980b9;
}
.file-input-wrapper {
position: relative;
}
.file-input-label {
display: inline-block;
background-color: #f8f9fa;
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 4px;
cursor: pointer;
}
.alert {
background-color: #d4edda;
color: #155724;
padding: 15px;
margin: 10px 0;
border-radius: 4px;
border: 1px solid #c3e6cb;
animation: fadeOut 5s forwards;
}
@keyframes fadeOut {
0% { opacity: 1; }
90% { opacity: 1; }
100% { opacity: 0; }
}
/* Responsive design */
@media (max-width: 768px) {
.form-container {
margin: 10px;
padding: 15px;
}
.form-table th {
width: 100%;
display: block;
}
.form-table td {
width: 100%;
display: block;
}
body {
padding: 10px;
}
h1 {
font-size: 24px;
}
h3 {
font-size: 20px;
}
}
</style>
<div class="form-container"> <div class="form-container">
<h3 class="form-title">Fill up the form and upload Contract</h3> <h3 class="form-title">Fill up the form and upload Contract</h3>
<form action="{% url "deed" %}" method="POST" enctype="multipart/form-data"> <form action="{% url "deed" %}" method="POST" enctype="multipart/form-data">

View File

@ -6,88 +6,10 @@ style="background-color: #d4edda; color: #155724; padding: 15px; margin: 10px 0;
{{ message }} {{ message }}
</div> </div>
{% endif %} {% endif %}
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
line-height: 1.6;
color: #333;
max-width: 800px;
margin: 0 auto;
padding: 20px;
background-color: #f4f6f9;
}
h1 {
color: #2c3e50;
text-align: center;
border-bottom: 3px solid #3498db;
padding-bottom: 10px;
margin-bottom: 20px;
}
h3 {
color: #2980b9;
margin-top: 25px;
border-left: 4px solid #3498db;
padding-left: 10px;
}
p {
text-align: justify;
margin-bottom: 15px;
}
list {
display: block;
margin-left: 30px;
}
list li {
margin-bottom: 10px;
position: relative;
padding-left: 20px;
}
list li::before {
content: '•';
color: #3498db;
font-weight: bold;
position: absolute;
left: -20px;
}
.alert {
background-color: #d4edda;
color: #155724;
padding: 15px;
margin: 10px 0;
border-radius: 4px;
border: 1px solid #c3e6cb;
animation: fadeOut 5s forwards;
}
@keyframes fadeOut {
0% { opacity: 1; }
90% { opacity: 1; }
100% { opacity: 0; }
}
@media (max-width: 600px) {
body {
padding: 10px;
}
h1 {
font-size: 24px;
}
h3 {
font-size: 20px;
}
}
</style>
</div> </div>
<div class="content">
<h1 strong align='center'>Archiving and Timely Upload of Meeting Minutes, Deeds, and MoUs</h1> <h1 strong align='center'>Archiving and Timely Upload of Meeting Minutes, Deeds, and MoUs</h1>
<br><p>To ensure seamless access and efficient management of critical documents within the Directorate General of Health Services (DGHS), it is essential to archive and upload Meeting Minutes, Deeds, and Memorandums of Understanding (MOUs) in a timely manner. <br><p>To ensure seamless access and efficient management of critical documents within the Directorate General of Health Services (DGHS), it is essential to archive and upload Meeting Minutes, Deeds, and Memorandums of Understanding (MOUs) in a timely manner.
</p> </p>
@ -127,4 +49,5 @@ Regular audits will be conducted to maintain data integrity and compliance.</p>
<h3>Call to Action:</h3> <h3>Call to Action:</h3>
<p>All offices under DGHS are encouraged to adopt this process and contribute to maintaining an updated and accessible document archive.</p> <p>All offices under DGHS are encouraged to adopt this process and contribute to maintaining an updated and accessible document archive.</p>
</div>
{% endblock content %} {% endblock content %}

View File

@ -1,184 +1,6 @@
{% extends "base.html" %} {% extends "base.html" %}
{% block content %} {% block content %}
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
line-height: 1.6;
color: #333;
max-width: 800px;
margin: 0 auto;
padding: 20px;
background-color: #f4f6f9;
}
.form-container {
max-width: 800px;
margin: 20px auto;
padding: 20px;
background: #ffffff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
h1 {
color: #2c3e50;
text-align: center;
border-bottom: 3px solid #3498db;
padding-bottom: 10px;
margin-bottom: 20px;
font-size: 24px;
font-weight: bold;
}
h3 {
color: #2980b9;
margin-top: 25px;
border-left: 4px solid #3498db;
padding-left: 10px;
}
p {
text-align: justify;
margin-bottom: 15px;
}
list {
display: block;
margin-left: 30px;
}
list li {
margin-bottom: 10px;
position: relative;
padding-left: 20px;
}
list li::before {
content: '•';
color: #3498db;
font-weight: bold;
position: absolute;
left: -20px;
}
.form-title {
color: #2c3e50;
text-align: center;
margin-bottom: 30px;
font-size: 24px;
font-weight: bold;
}
.form-table {
width: 100%;
border-collapse: separate;
border-spacing: 0 15px;
}
.form-table th {
text-align: left;
padding: 8px;
color: #34495e;
font-weight: 600;
width: 30%;
vertical-align: middle;
}
.form-table input[type="text"],
.form-table input[type="date"] {
width: 90%;
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 14px;
transition: border-color 0.3s;
}
.form-table input[type="text"]:focus,
.form-table input[type="date"]:focus {
border-color: #3498db;
outline: none;
box-shadow: 0 0 5px rgba(52,152,219,0.3);
}
.form-table input[type="file"] {
padding: 8px 0;
}
.submit-btn {
background-color: #3498db;
color: white;
padding: 10px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
transition: background-color 0.3s;
}
.submit-btn:hover {
background-color: #2980b9;
}
.file-input-wrapper {
position: relative;
}
.file-input-label {
display: inline-block;
background-color: #f8f9fa;
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 4px;
cursor: pointer;
}
.alert {
background-color: #d4edda;
color: #155724;
padding: 15px;
margin: 10px 0;
border-radius: 4px;
border: 1px solid #c3e6cb;
animation: fadeOut 5s forwards;
}
@keyframes fadeOut {
0% { opacity: 1; }
90% { opacity: 1; }
100% { opacity: 0; }
}
/* Responsive design */
@media (max-width: 768px) {
.form-container {
margin: 10px;
padding: 15px;
}
.form-table th {
width: 100%;
display: block;
}
.form-table td {
width: 100%;
display: block;
}
body {
padding: 10px;
}
h1 {
font-size: 24px;
}
h3 {
font-size: 20px;
}
}
</style>
<div class="form-container"> <div class="form-container">
<h3 class="form-title">Fill up the form and upload your MoU</h3> <h3 class="form-title">Fill up the form and upload your MoU</h3>
<form action="{% url "mou" %}" method="POST" enctype="multipart/form-data"> <form action="{% url "mou" %}" method="POST" enctype="multipart/form-data">

View File

@ -5,185 +5,7 @@
{{ message }} {{ message }}
</div> </div>
{% endif %} {% endif %}
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
line-height: 1.6;
color: #333;
max-width: 800px;
margin: 0 auto;
padding: 20px;
background-color: #f4f6f9;
}
.form-container {
max-width: 800px;
margin: 20px auto;
padding: 20px;
background: #ffffff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
h1 {
color: #2c3e50;
text-align: center;
border-bottom: 3px solid #3498db;
padding-bottom: 10px;
margin-bottom: 20px;
font-size: 24px;
font-weight: bold;
}
h3 {
color: #2980b9;
margin-top: 25px;
border-left: 4px solid #3498db;
padding-left: 10px;
}
p {
text-align: justify;
margin-bottom: 15px;
}
list {
display: block;
margin-left: 30px;
}
list li {
margin-bottom: 10px;
position: relative;
padding-left: 20px;
}
list li::before {
content: '•';
color: #3498db;
font-weight: bold;
position: absolute;
left: -20px;
}
.form-title {
color: #2c3e50;
text-align: center;
margin-bottom: 30px;
font-size: 24px;
font-weight: bold;
}
.form-table {
width: 100%;
border-collapse: separate;
border-spacing: 0 15px;
}
.form-table th {
text-align: left;
padding: 8px;
color: #34495e;
font-weight: 600;
width: 30%;
vertical-align: middle;
}
.form-table input[type="text"],
.form-table input[type="date"] {
width: 90%;
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 14px;
transition: border-color 0.3s;
}
.form-table input[type="text"]:focus,
.form-table input[type="date"]:focus {
border-color: #3498db;
outline: none;
box-shadow: 0 0 5px rgba(52,152,219,0.3);
}
.form-table input[type="file"] {
padding: 8px 0;
}
.submit-btn {
background-color: #3498db;
color: white;
padding: 10px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
transition: background-color 0.3s;
}
.submit-btn:hover {
background-color: #2980b9;
}
.file-input-wrapper {
position: relative;
}
.file-input-label {
display: inline-block;
background-color: #f8f9fa;
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 4px;
cursor: pointer;
}
.alert {
background-color: #d4edda;
color: #155724;
padding: 15px;
margin: 10px 0;
border-radius: 4px;
border: 1px solid #c3e6cb;
animation: fadeOut 5s forwards;
}
@keyframes fadeOut {
0% { opacity: 1; }
90% { opacity: 1; }
100% { opacity: 0; }
}
/* Responsive design */
@media (max-width: 768px) {
.form-container {
margin: 10px;
padding: 15px;
}
.form-table th {
width: 100%;
display: block;
}
.form-table td {
width: 100%;
display: block;
}
body {
padding: 10px;
}
h1 {
font-size: 24px;
}
h3 {
font-size: 20px;
}
}
</style>
<div class="form-container"> <div class="form-container">
<h3 class="form-title">Fill up the form and upload your resolutions</h3> <h3 class="form-title">Fill up the form and upload your resolutions</h3>
<form action="{% url "resulation" %}" method="POST" enctype="multipart/form-data"> <form action="{% url "resulation" %}" method="POST" enctype="multipart/form-data">