rework the style
This commit is contained in:
Karl Hudgell
parent
9573a4f0ca
commit
24435e57b0
@ -1,8 +1,13 @@
|
||||
/* Base styles */
|
||||
html, body {
|
||||
height: 100%; /* Ensure the body and html elements fill the viewport height */
|
||||
margin: 0; /* Remove default margin */
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
header {
|
||||
@ -13,15 +18,13 @@ header {
|
||||
}
|
||||
|
||||
main {
|
||||
flex: 1; /* Make the main content area grow to fill the available space */
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
/* Mobile styles */
|
||||
@media (max-width: 600px) {
|
||||
header {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
main {
|
||||
padding: 0.5em;
|
||||
}
|
||||
footer {
|
||||
background-color: #333;
|
||||
color: white;
|
||||
text-align: center;
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Add Account - KTVManager</title>
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
|
||||
<style>
|
||||
/* Hide the spinner by default */
|
||||
#loadingSpinner {
|
||||
@ -51,7 +52,7 @@
|
||||
</div>
|
||||
|
||||
<!-- Main Content -->
|
||||
<div class="container mt-5">
|
||||
<main div class="container mt-5">
|
||||
<h1>Add Account</h1>
|
||||
<br>
|
||||
|
||||
@ -74,9 +75,10 @@
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</main>
|
||||
|
||||
<footer class="bg-dark text-white text-center py-3 mt-5">
|
||||
<p>© 2024 KTV Manager | All rights reserved</p>
|
||||
<p></p>
|
||||
</footer>
|
||||
|
||||
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
|
||||
|
||||
@ -1,4 +1,3 @@
|
||||
<!-- templates/index.html -->
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
@ -6,6 +5,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>KTVManager</title>
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@ -30,60 +30,60 @@
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Main Content -->
|
||||
<div class="container mt-5">
|
||||
<h1>Welcome {{ username }}!</h1>
|
||||
<br>
|
||||
<h2>You have {{ accounts }} active accounts</h2>
|
||||
<br>
|
||||
|
||||
{% if current_month_accounts %}
|
||||
<h3>Accounts Expiring This Month</h3>
|
||||
<table class="table table-bordered table-striped">
|
||||
<thead class="thead-dark">
|
||||
<tr>
|
||||
<th>Stream Name</th>
|
||||
<th>Username</th>
|
||||
<th>Expiry Date</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for account in current_month_accounts %}
|
||||
<!-- Main Content -->
|
||||
<main class="container mt-5">
|
||||
<h1>Welcome {{ username }}!</h1>
|
||||
<br>
|
||||
<h2>You have {{ accounts }} active accounts</h2>
|
||||
<br>
|
||||
|
||||
{% if current_month_accounts %}
|
||||
<h3>Accounts Expiring This Month</h3>
|
||||
<table class="table table-bordered table-striped">
|
||||
<thead class="thead-dark">
|
||||
<tr>
|
||||
<td>{{ account.stream }}</td>
|
||||
<td>{{ account.username }}</td>
|
||||
<td>{{ account.expiaryDate_rendered }}</td>
|
||||
<th>Stream Name</th>
|
||||
<th>Username</th>
|
||||
<th>Expiry Date</th>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
{% endif %}
|
||||
{% if expired_accounts %}
|
||||
<h3>Expired Accounts</h3>
|
||||
<table class="table table-bordered table-striped">
|
||||
<thead class="thead-dark">
|
||||
<tr>
|
||||
<th>Stream Name</th>
|
||||
<th>Username</th>
|
||||
<th>Expiry Date</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for account in expired_accounts %}
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for account in current_month_accounts %}
|
||||
<tr>
|
||||
<td>{{ account.stream }}</td>
|
||||
<td>{{ account.username }}</td>
|
||||
<td>{{ account.expiaryDate_rendered }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
{% endif %}
|
||||
{% if expired_accounts %}
|
||||
<h3>Expired Accounts</h3>
|
||||
<table class="table table-bordered table-striped">
|
||||
<thead class="thead-dark">
|
||||
<tr>
|
||||
<td>{{ account.stream }}</td>
|
||||
<td>{{ account.username }}</td>
|
||||
<td>{{ account.expiaryDate_rendered }}</td>
|
||||
<th>Stream Name</th>
|
||||
<th>Username</th>
|
||||
<th>Expiry Date</th>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for account in expired_accounts %}
|
||||
<tr>
|
||||
<td>{{ account.stream }}</td>
|
||||
<td>{{ account.username }}</td>
|
||||
<td>{{ account.expiaryDate_rendered }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
{% endif %}
|
||||
</main>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="bg-dark text-white text-center py-3 mt-5">
|
||||
<p>© 2024 KTV Manager | All rights reserved</p>
|
||||
<p></p>
|
||||
</footer>
|
||||
|
||||
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>KTV Manager</title>
|
||||
<title>KTVManager</title>
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
|
||||
<link rel="icon" type="image/png" href="{{ url_for('static', filename='favicon-96x96.png') }}" sizes="96x96" />
|
||||
<link rel="icon" type="image/svg+xml" href="{{ url_for('static', filename='favicon.svg') }}" />
|
||||
@ -12,6 +12,7 @@
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="{{ url_for('static', filename='apple-touch-icon.png') }}" />
|
||||
<meta name="apple-mobile-web-app-title" content="kTvManager" />
|
||||
<link rel="manifest" href="{{ url_for('static', filename='site.webmanifest') }}" />
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@ -37,7 +38,7 @@
|
||||
</nav>
|
||||
|
||||
<!-- Main Content -->
|
||||
<div class="container mt-5">
|
||||
<main div class="container mt-5">
|
||||
<h1>Welcome to KTV Manager</h1>
|
||||
|
||||
<!-- Login Form -->
|
||||
@ -56,9 +57,10 @@
|
||||
{% endif %}
|
||||
</form>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer class="bg-dark text-white text-center py-3 mt-5">
|
||||
<p>© 2024 KTV Manager | All rights reserved</p>
|
||||
<p></p>
|
||||
</footer>
|
||||
|
||||
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>KTVManager</title>
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@ -32,7 +33,7 @@
|
||||
|
||||
|
||||
<!-- Main Content -->
|
||||
<div class="container mt-5">
|
||||
<main div class="container mt-5">
|
||||
<h2>URLs</h2>
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
@ -51,9 +52,10 @@
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
</main>
|
||||
|
||||
<footer class="bg-dark text-white text-center py-3 mt-5">
|
||||
<p>© 2024 KTVManager | All rights reserved</p>
|
||||
<p></p>
|
||||
</footer>
|
||||
|
||||
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
|
||||
|
||||
@ -7,6 +7,7 @@
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.24/css/jquery.dataTables.min.css">
|
||||
<link rel="stylesheet" href="https://cdn.datatables.net/responsive/2.2.9/css/responsive.dataTables.min.css">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
|
||||
</head>
|
||||
<body>
|
||||
<!-- Navbar -->
|
||||
@ -39,7 +40,7 @@
|
||||
</div>
|
||||
|
||||
<!-- Main Content -->
|
||||
<div class="container mt-5">
|
||||
<main div class="container mt-5">
|
||||
<h2>{{ username }}'s Accounts</h2>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped" id="accountsTable">
|
||||
@ -78,9 +79,10 @@
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer class="bg-dark text-white text-center py-3 mt-5">
|
||||
<p>© 2024 KTVManager | All rights reserved</p>
|
||||
<p></p>
|
||||
</footer>
|
||||
|
||||
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user