Skip to content

Commit 1b12587

Browse files
codeperfectpluscodeperfectplus
committed
feat: more toggle and navbar improved
1 parent 51314e9 commit 1b12587

File tree

18 files changed

+347
-125
lines changed

18 files changed

+347
-125
lines changed

‎src/models.py‎

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,16 +22,36 @@ def __repr__(self):
2222
class DashboardSettings(db.Model):
2323
__tablename__ = "DashboardSettings"
2424
id = db.Column(db.Integer, primary_key=True)
25+
26+
# speedtest setting
2527
speedtest_cooldown = db.Column(db.Integer, default=1)
2628
number_of_speedtests = db.Column(db.Integer, default=1)
29+
30+
# general settings
2731
timezone = db.Column(db.String(50), default="Asia/Kolkata")
32+
enable_cache = db.Column(db.Boolean, default=True)
33+
34+
# page enable/disable
2835
is_cpu_info_enabled = db.Column(db.Boolean, default=True)
2936
is_memory_info_enabled = db.Column(db.Boolean, default=True)
3037
is_disk_info_enabled = db.Column(db.Boolean, default=True)
3138
is_network_info_enabled = db.Column(db.Boolean, default=True)
32-
is_process_info_enabled = db.Column(db.Boolean, default=True)
33-
is_speedtest_enabled = db.Column(db.Boolean, default=True)
34-
enable_cache = db.Column(db.Boolean, default=True)
39+
is_process_info_enabled = db.Column(db.Boolean, default=False)
40+
41+
42+
# card enable/disable
43+
is_user_card_enabled = db.Column(db.Boolean, default=True)
44+
is_server_card_enabled = db.Column(db.Boolean, default=True)
45+
is_battery_card_enabled = db.Column(db.Boolean, default=True)
46+
is_cpu_core_card_enabled = db.Column(db.Boolean, default=True)
47+
is_cpu_usage_card_enabled = db.Column(db.Boolean, default=True)
48+
is_cpu_temp_card_enabled = db.Column(db.Boolean, default=True)
49+
is_dashboard_memory_card_enabled = db.Column(db.Boolean, default=True)
50+
is_memory_usage_card_enabled = db.Column(db.Boolean, default=True)
51+
is_disk_usage_card_enabled = db.Column(db.Boolean, default=True)
52+
is_system_uptime_card_enabled = db.Column(db.Boolean, default=True)
53+
is_network_statistic_card_enabled = db.Column(db.Boolean, default=True)
54+
is_speedtest_enabled = db.Column(db.Boolean, default=False)
3555

3656
def __repr__(self):
3757
return f"<DashboardSettings {self.speedtest_cooldown}, {self.timezone}, {self.number_of_speedtests}>"

‎src/routes/settings.py‎

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,9 +19,22 @@ def settings():
1919
settings.is_disk_info_enabled = "is_disk_info_enabled" in request.form
2020
settings.is_network_info_enabled = "is_network_info_enabled" in request.form
2121
settings.is_process_info_enabled = "is_process_info_enabled" in request.form
22-
settings.is_speedtest_enabled = "is_speedtest_enabled" in request.form
2322
settings.enable_cache = "enable_cache" in request.form
2423

24+
# <!-- is_user_card_enabled -->
25+
settings.is_user_card_enabled = "is_user_card_enabled" in request.form
26+
settings.is_server_card_enabled = "is_server_card_enabled" in request.form
27+
settings.is_battery_card_enabled = "is_battery_card_enabled" in request.form
28+
settings.is_cpu_core_card_enabled = "is_cpu_core_card_enabled" in request.form
29+
settings.is_cpu_usage_card_enabled = "is_cpu_usage_card_enabled" in request.form
30+
settings.is_cpu_temp_card_enabled = "is_cpu_temp_card_enabled" in request.form
31+
settings.is_dashboard_memory_card_enabled = "is_dashboard_memory_card_enabled" in request.form
32+
settings.is_memory_usage_card_enabled = "is_memory_usage_card_enabled" in request.form
33+
settings.is_disk_usage_card_enabled = "is_disk_usage_card_enabled" in request.form
34+
settings.is_system_uptime_card_enabled = "is_system_uptime_card_enabled" in request.form
35+
settings.is_network_statistic_card_enabled = "is_network_statistic_card_enabled" in request.form
36+
settings.is_speedtest_enabled = "is_speedtest_enabled" in request.form
37+
2538
# Commit the changes to the database
2639
db.session.commit()
2740
flash("Settings updated successfully!", "success")

‎src/static/css/settings.css‎

Lines changed: 24 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
.settings-container {
2-
max-width: 600px;
2+
max-width: 800px;
33
margin: 0 auto;
44
padding: 20px;
55
background-color: #f8f9fa;
@@ -8,37 +8,49 @@
88
}
99

1010
.settings-title {
11-
font-size: 28px;
11+
font-size: 32px;
1212
color: #343a40;
13-
margin-bottom: 20px;
13+
margin-bottom: 30px;
1414
text-align: center;
1515
}
1616

1717
.settings-form {
1818
display: flex;
1919
flex-direction: column;
20-
gap: 15px;
20+
gap: 20px;
21+
}
22+
23+
.settings-section {
24+
border: 1px solid #dee2e6;
25+
border-radius: 8px;
26+
padding: 15px;
27+
background-color: #ffffff;
28+
}
29+
30+
.section-title {
31+
font-size: 24px;
32+
color: #495057;
33+
margin-bottom: 15px;
2134
}
2235

2336
.form-group {
2437
display: flex;
2538
flex-direction: row;
26-
align-items: center; /* Align items vertically in the center */
27-
justify-content: space-between; /* Space out label and input */
28-
margin-bottom: 10px;
39+
align-items: center;
40+
justify-content: space-between;
41+
margin-bottom: 15px;
2942
}
3043

3144
.form-group label {
3245
font-weight: 600;
3346
color: #495057;
34-
margin-right: 10px; /* Add some space between the label and checkbox */
3547
}
3648

3749
.form-group input[type="checkbox"] {
3850
width: 20px;
3951
height: 20px;
4052
cursor: pointer;
41-
margin: 0; /* Remove any default margin */
53+
margin: 0;
4254
}
4355

4456
.form-group input[type="number"],
@@ -51,19 +63,8 @@
5163
width: 100%;
5264
}
5365

54-
@media (max-width: 576px) {
55-
.form-group {
56-
flex-direction: column;
57-
align-items: flex-start;
58-
}
59-
60-
.form-group label {
61-
margin-bottom: 5px;
62-
}
63-
}
64-
6566
.btn-primary {
66-
padding: 10px 20px;
67+
padding: 12px 25px;
6768
background-color: #007bff;
6869
color: #ffffff;
6970
border: none;
@@ -78,13 +79,13 @@
7879
background-color: #0056b3;
7980
}
8081

81-
@media (max-width: 576px) {
82+
@media (max-width: 768px) {
8283
.settings-container {
8384
padding: 15px;
8485
}
8586

8687
.settings-title {
87-
font-size: 24px;
88+
font-size: 28px;
8889
}
8990

9091
.btn-primary {

‎src/static/css/style.css‎

Lines changed: 39 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -58,63 +58,67 @@ body {
5858
font-size: 2.5rem;
5959
}
6060

61+
/* Navbar Styles */
6162
/* Navbar Styles */
6263
.navbar {
63-
background-color: #0056b3; /* Dark blue background */
64-
padding: 0.75rem 1rem; /* Increased padding for a more substantial navbar */
65-
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Soft shadow for depth */
66-
border-radius: 0.5rem; /* Slightly rounded corners */
64+
background-color: #ffffff;
65+
border-bottom: 1px solid #dee2e6;
66+
padding: 0.5rem 1rem;
6767
}
6868

6969
.navbar-brand {
70-
font-size: 1.75rem; /* Slightly larger and bolder for prominence */
71-
color: #000000; /* White text color for contrast */
72-
font-weight: bold; /* Added weight for emphasis */
70+
font-size: 1.5rem;
71+
font-weight: bold;
72+
color: #007bff;
73+
}
74+
75+
.navbar-nav {
76+
display: flex;
77+
align-items: center;
7378
}
7479

75-
.navbar-nav .nav-link {
76-
color: #000000; /* White text color */
77-
font-size: 1.125rem; /* Slightly larger font for readability */
78-
padding: 0.5rem 1rem; /* More padding for clickable area */
79-
transition: color 0.3s ease, background-color 0.3s ease; /* Smooth transition */
80+
.nav-item {
81+
margin-left: 1rem;
8082
}
8183

82-
.navbar-nav .nav-link:hover {
83-
color: #0056b3; /* Blue text on hover */
84-
background-color: #f8f9fa; /* Light gray background on hover */
85-
border-radius: 0.25rem;
84+
.nav-link {
85+
color: #495057;
86+
font-size: 1rem;
87+
padding: 0.5rem 1rem;
88+
border-radius: 4px;
89+
transition: background-color 0.3s, color 0.3s;
90+
}
91+
92+
.nav-link:hover, .nav-link.active {
93+
color: #ffffff;
94+
background-color: #007bff;
95+
text-decoration: none;
8696
}
8797

88-
/* Active Page Styling */
89-
.navbar-nav .nav-link.active {
90-
background-color: #003d80; /* Darker blue for the active page */
91-
color: #ffffff; /* Keep the text white */
92-
border-radius: 0.25rem; /* Match the hover effect */
98+
.nav-link i {
99+
font-size: 1.2rem;
93100
}
94101

95102
.navbar-toggler {
96-
border: none; /* Remove default border */
97-
outline: none; /* Remove focus outline */
98-
padding: 0.25rem 0.5rem; /* Smaller padding for a sleek look */
103+
border: none;
99104
}
100105

101106
.navbar-toggler-icon {
102-
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M4 6h16M4 12h16M4 18h16'/%3E%3C/svg%3E");
103-
filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.2)); /* Add subtle shadow */
107+
background-image: url('data:image/svg+xml;charset=utf8,...'); /* Include your own icon URL or SVG here */
104108
}
105109

106-
/* Responsive Styles */
107-
@media (max-width: 767.98px) {
108-
.navbar-nav .nav-link {
109-
padding-right: 1rem;
110-
padding-left: 1rem;
111-
text-align: center; /* Center-align links on smaller screens */
112-
}
110+
/* Add margin-right to space out authentication links */
111+
.navbar-nav.ml-auto .nav-item {
112+
margin-left: 1rem;
113+
}
113114

114-
.navbar-brand {
115-
font-size: 1.5rem; /* Adjust brand size on smaller screens */
115+
/* Responsive adjustments */
116+
@media (max-width: 992px) {
117+
.navbar-nav {
118+
margin-top: 0.5rem;
116119
}
117120
}
121+
/* end of navbar styles */
118122

119123
.btn-primary {
120124
margin-top: 1rem; /* Adds space above buttons */

‎src/templates/dasbhboard_comp/battery/percentage.html‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,10 @@
1-
<div class="col-md-6 col-lg-4 mb-4"><div class="card battery-card" data-battery="{{ system_info['battery_percent']}}"><div class="card-body"><h5 class="card-title">Battery Percentage <i class="fas fa-battery-three-quarters"></i></h5><p class="card-text fs-4">{{ system_info['battery_percent']}}%</p></div></div></div>
1+
{% if settings.is_battery_card_enabled %}
2+
<div class="col-md-6 col-lg-4 mb-4">
3+
<div class="card battery-card" data-battery="{{ system_info['battery_percent']}}">
4+
<div class="card-body">
5+
<h5 class="card-title">Battery Percentage <i class="fas fa-battery-three-quarters"></i></h5>
6+
<p class="card-text fs-4">{{ system_info['battery_percent']}}%</p>
7+
</div>
8+
</div>
9+
</div>
10+
{% endif %}

‎src/templates/dasbhboard_comp/cpu/core.html‎

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,12 @@
1-
<div class="col-md-6 col-lg-4 mb-4"><div class="card bg-cpu" data-cpu="{{ system_info['cpu_percent']}}"><div class="card-body"><h5 class="card-title">CPU Cores <i class="fas fa-microchip"></i></h5><p class="card-text fs-4">{{ system_info['cpu_core']}}</p><div class="cpu-core-visualization">{% for i in range(system_info['cpu_core']) %} <div class="cpu-core-bar"></div>{% endfor %} </div></div></div></div>
1+
{% if settings.is_cpu_core_card_enabled %}
2+
<div class="col-md-6 col-lg-4 mb-4">
3+
<div class="card bg-cpu" data-cpu="{{ system_info['cpu_percent']}}">
4+
<div class="card-body">
5+
<h5 class="card-title">CPU Cores <i class="fas fa-microchip"></i></h5>
6+
<p class="card-text fs-4">{{ system_info['cpu_core']}}</p>
7+
<div class="cpu-core-visualization">{% for i in range(system_info['cpu_core']) %} <div class="cpu-core-bar">
8+
</div>{% endfor %} </div>
9+
</div>
10+
</div>
11+
</div>
12+
{% endif %}

‎src/templates/dasbhboard_comp/cpu/current_temp.html‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,10 @@
1-
<div class="col-md-6 col-lg-4 mb-4"><div class="card cpu-card bg-cpu" data-cpu-usage="{{ system_info['cpu_percent']}}%" shadow-sm border-0 rounded-3"><div class="card-body"><h5 class="card-title">CPU Temperature <i class="fas fa-microchip"></i></h5><p class="card-text fs-4">{{ system_info['current_temp']}}%</p></div></div></div>
1+
{% if settings.is_cpu_temp_card_enabled %}
2+
<div class="col-md-6 col-lg-4 mb-4">
3+
<div class="card cpu-card bg-cpu" data-cpu-usage="{{ system_info['cpu_percent']}}%" shadow-sm border-0 rounded-3">
4+
<div class="card-body">
5+
<h5 class="card-title">CPU Temperature <i class="fas fa-microchip"></i></h5>
6+
<p class="card-text fs-4">{{ system_info['current_temp']}}%</p>
7+
</div>
8+
</div>
9+
</div>
10+
{% endif %}

‎src/templates/dasbhboard_comp/cpu/usages.html‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,10 @@
1-
<div class="col-md-6 col-lg-4 mb-4"><div class="card cpu-card bg-cpu" data-cpu-usage="{{ system_info['cpu_percent']}}%" shadow-sm border-0 rounded-3"><div class="card-body"><h5 class="card-title">CPU Usage <i class="fas fa-microchip"></i></h5><p class="card-text fs-4">{{ system_info['cpu_percent']}}%</p></div></div></div>
1+
{% if settings.is_cpu_usage_card_enabled %}
2+
<div class="col-md-6 col-lg-4 mb-4">
3+
<div class="card cpu-card bg-cpu" data-cpu-usage="{{ system_info['cpu_percent']}}%" shadow-sm border-0 rounded-3">
4+
<div class="card-body">
5+
<h5 class="card-title">CPU Usage <i class="fas fa-microchip"></i></h5>
6+
<p class="card-text fs-4">{{ system_info['cpu_percent']}}%</p>
7+
</div>
8+
</div>
9+
</div>
10+
{% endif %}

‎src/templates/dasbhboard_comp/disk/usage.html‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,10 @@
1-
<div class="col-md-6 col-lg-4 mb-4"><div class="card bg-disk shadow-sm border-0 rounded-3"><div class="card-body"><h5 class="card-title">Disk Usage <i class="fas fa-hdd"></i></h5><p class="card-text fs-4">{{ system_info['disk_usage']}}%</p></div></div></div>
1+
{% if settings.is_disk_usage_card_enabled %}
2+
<div class="col-md-6 col-lg-4 mb-4">
3+
<div class="card bg-disk shadow-sm border-0 rounded-3">
4+
<div class="card-body">
5+
<h5 class="card-title">Disk Usage <i class="fas fa-hdd"></i></h5>
6+
<p class="card-text fs-4">{{ system_info['disk_usage']}}%</p>
7+
</div>
8+
</div>
9+
</div>
10+
{% endif %}

‎src/templates/dasbhboard_comp/memory/dashboard_memory.html‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
1+
{% if settings.is_dashboard_memory_card_enabled %}
12
<div class="col-md-6 col-lg-4 mb-4">
23
<div class="card bg-dashboard-memory">
34
<div class="card-body">
45
<h5 class="card-title">Memory Usages(Dashboard) <i class="fas fa-memory"></i></h5>
56
<p class="card-text fs-4">{{ system_info['dashboard_memory_usage']}} MB</p>
67
</div>
78
</div>
8-
</div>
9+
</div>
10+
{% endif %}

0 commit comments

Comments
 (0)