Skip to content

Commit c343d6b

Browse files
Update background color gradient in style.css
1 parent 61450b5 commit c343d6b

10 files changed

Lines changed: 312 additions & 198 deletions

File tree

src/scripts/memory_stress.py

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
import time
2+
import argparse
3+
import sys
4+
5+
def allocate_memory(mb_to_allocate, duration):
6+
"""
7+
Allocates memory in megabytes and holds it for the specified duration.
8+
9+
:param mb_to_allocate: Amount of memory to allocate in MB.
10+
:param duration: How long (in seconds) to hold the memory allocation.
11+
"""
12+
try:
13+
# Allocate memory (list of bytes, 1MB = 1024 * 1024 bytes)
14+
allocated_memory = bytearray(mb_to_allocate * 1024 * 1024)
15+
print(f"Allocated {mb_to_allocate} MB of memory.")
16+
17+
# Keep the memory allocated for the specified duration
18+
time.sleep(duration)
19+
print(f"Held memory for {duration} seconds.")
20+
except MemoryError:
21+
print(f"Memory allocation failed for {mb_to_allocate} MB.")
22+
except Exception as e:
23+
print(f"An error occurred: {e}")
24+
finally:
25+
# Clean up
26+
del allocated_memory
27+
print(f"Memory released after {duration} seconds.")
28+
29+
def stress_test(total_mb, step_mb, duration):
30+
"""
31+
Perform a memory stress test by allocating increasing amounts of memory.
32+
33+
:param total_mb: The total amount of memory to allocate.
34+
:param step_mb: The step size in MB for each allocation.
35+
:param duration: Duration to hold each memory allocation.
36+
"""
37+
for current_mb in range(step_mb, total_mb + 1, step_mb):
38+
print(f"Attempting to allocate {current_mb} MB...")
39+
allocate_memory(current_mb, duration)
40+
print(f"Completed {current_mb} MB allocation.\n")
41+
42+
if __name__ == "__main__":
43+
# Argument parser for command-line execution
44+
parser = argparse.ArgumentParser(description="Memory Stress Test Tool")
45+
parser.add_argument("-t", "--total", type=int, default=8024, help="Total memory to allocate in MB (default: 1024 MB)")
46+
parser.add_argument("-s", "--step", type=int, default=4000, help="Step size in MB for each allocation (default: 256 MB)")
47+
parser.add_argument("-d", "--duration", type=int, default=30, help="Duration to hold the memory allocation in seconds (default: 5 seconds)")
48+
49+
args = parser.parse_args()
50+
51+
print(f"Starting memory stress test. Total: {args.total} MB, Step: {args.step} MB, Duration: {args.duration} seconds.")
52+
stress_test(args.total, args.step, args.duration)

src/static/css/graphs.css

Lines changed: 186 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -1,54 +1,58 @@
1-
/* Basic Reset and Global Styles */
1+
/* Reset and Global Styles */
22
* {
33
margin: 0;
44
padding: 0;
55
box-sizing: border-box;
66
}
77

8-
/* Container for Layout */
9-
.controls-container {
10-
display: flex;
11-
align-items: center;
12-
margin-bottom: 20px;
8+
body {
9+
font-family: 'Roboto', sans-serif;
10+
background-color: #f0f2f5;
11+
color: #333;
1312
}
1413

15-
.controls-container select,
16-
.controls-container button {
17-
margin-right: 10px; /* Space between select and button */
14+
/* Layout Containers */
15+
.container {
16+
max-width: 1200px;
17+
margin: 20px auto;
18+
padding: 20px;
19+
background-color: #fff;
20+
border-radius: 10px;
21+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
22+
transition: transform 0.3s, box-shadow 0.3s;
1823
}
1924

25+
.container:hover {
26+
transform: translateY(-5px);
27+
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
28+
}
29+
30+
/* Page Title */
2031
.page-title {
21-
font-size: 2rem;
22-
margin-bottom: 20px;
32+
font-size: 2.5rem;
2333
color: #333;
34+
margin-bottom: 30px;
2435
text-align: center;
25-
width: 100%; /* Ensure it takes full width */
2636
display: flex;
27-
justify-content: center; /* Center the text horizontally */
37+
justify-content: center;
38+
align-items: center;
2839
}
2940

30-
/* Style for Select Dropdown */
31-
select {
32-
padding: 10px;
33-
border: 1px solid #ddd;
34-
border-radius: 4px;
35-
font-size: 1rem;
36-
background-color: #fff;
37-
color: #333;
38-
transition: border-color 0.3s;
41+
.page-title i {
42+
color: #4caf50;
43+
margin-right: 10px;
44+
transition: transform 0.3s;
3945
}
4046

41-
select:hover,
42-
select:focus {
43-
border-color: #4caf50; /* Highlight on hover/focus */
44-
outline: none;
47+
.page-title:hover i {
48+
transform: rotate(10deg);
4549
}
4650

47-
/* Style for Refresh Button */
51+
/* Buttons */
4852
button {
49-
padding: 10px 20px;
53+
padding: 12px 24px;
5054
border: none;
51-
border-radius: 4px;
55+
border-radius: 6px;
5256
background-color: #4caf50;
5357
color: #fff;
5458
font-size: 1rem;
@@ -69,64 +73,54 @@ button i {
6973
margin-right: 8px;
7074
}
7175

72-
/* Container Styles for Charts */
73-
.container {
74-
max-width: 1200px;
75-
margin: 20px auto;
76-
padding: 20px;
76+
/* Select Dropdown */
77+
select {
78+
padding: 10px;
79+
border: 1px solid #ddd;
80+
border-radius: 6px;
81+
font-size: 1rem;
7782
background-color: #fff;
78-
border-radius: 8px;
79-
}
80-
81-
.selector-container {
82-
display: flex;
83-
align-items: center; /* Align items vertically in the center */
84-
gap: 1rem; /* Space between the elements */
85-
}
86-
87-
.time-filter-container {
88-
display: flex;
89-
flex-direction: column; /* Stack label and select vertically */
90-
}
91-
92-
.time-filter-container label {
93-
margin-bottom: 0.5rem; /* Space between label and select */
83+
color: #333;
84+
transition: border-color 0.3s, background-color 0.3s;
9485
}
9586

96-
select {
97-
padding: 0.5rem; /* Add padding for better appearance */
98-
border-radius: 0.25rem; /* Rounded corners */
99-
border: 1px solid #ccc; /* Border color */
87+
select:hover,
88+
select:focus {
89+
border-color: #4caf50;
90+
background-color: #f9f9f9;
91+
outline: none;
10092
}
10193

94+
/* Headings */
10295
h2 {
103-
font-size: 1.5rem;
104-
margin-bottom: 20px;
96+
font-size: 2rem;
10597
color: #444;
98+
margin-bottom: 20px;
10699
display: flex;
107100
align-items: center;
108101
}
109102

110103
h2 i {
111104
margin-right: 10px;
112-
color: #4caf50; /* Icon color */
105+
color: #4caf50;
113106
}
114107

115-
/* Chart Styles */
108+
/* Chart Canvas */
116109
canvas {
117110
display: block;
118-
height: 400px;
119111
width: 100%;
112+
height: 400px;
120113
background-color: #f5f5f5;
121114
border-radius: 8px;
122-
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
115+
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
116+
margin-bottom: 30px;
123117
}
124118

125-
/* Animation for Charts */
119+
/* Animation for Container and Chart Load */
126120
.container {
127121
opacity: 0;
128-
transform: translateY(20px);
129-
animation: fadeInUp 1s forwards;
122+
transform: translateY(30px);
123+
animation: fadeInUp 0.8s ease-out forwards;
130124
}
131125

132126
@keyframes fadeInUp {
@@ -136,6 +130,34 @@ canvas {
136130
}
137131
}
138132

133+
/* Controls */
134+
.controls-container {
135+
display: flex;
136+
align-items: center;
137+
justify-content: space-between;
138+
margin-bottom: 20px;
139+
}
140+
141+
.controls-container select,
142+
.controls-container button {
143+
margin-right: 10px;
144+
}
145+
146+
.selector-container {
147+
display: flex;
148+
gap: 1rem;
149+
align-items: center;
150+
}
151+
152+
.time-filter-container {
153+
display: flex;
154+
flex-direction: column;
155+
}
156+
157+
.time-filter-container label {
158+
margin-bottom: 0.5rem;
159+
}
160+
139161
/* Responsive Styles */
140162
@media (max-width: 768px) {
141163
.controls-container {
@@ -148,11 +170,111 @@ canvas {
148170
margin-bottom: 10px;
149171
}
150172

173+
.page-title {
174+
font-size: 1.75rem;
175+
}
176+
151177
h2 {
152-
font-size: 1.25rem;
178+
font-size: 1.5rem;
153179
}
154180

155181
button {
156182
font-size: 0.875rem;
157183
}
158184
}
185+
186+
/* Improved Color Scheme */
187+
body {
188+
--primary-color: #4caf50;
189+
--secondary-color: #333;
190+
--background-color: #f0f2f5;
191+
--text-color: #444;
192+
--light-bg: #fff;
193+
--shadow-color: rgba(0, 0, 0, 0.1);
194+
--hover-color: #45a049;
195+
--card-background: #f5f5f5;
196+
}
197+
198+
/* Apply Variables */
199+
body {
200+
background-color: var(--background-color);
201+
color: var(--text-color);
202+
}
203+
204+
.page-title i,
205+
h2 i {
206+
color: var(--primary-color);
207+
}
208+
209+
.container {
210+
background-color: var(--light-bg);
211+
box-shadow: 0 4px 8px var(--shadow-color);
212+
}
213+
214+
button {
215+
background-color: var(--primary-color);
216+
}
217+
218+
button:hover {
219+
background-color: var(--hover-color);
220+
}
221+
222+
canvas {
223+
background-color: var(--card-background);
224+
}
225+
226+
/* Hover Animations */
227+
button:hover {
228+
background-color: var(--hover-color);
229+
transform: scale(1.05);
230+
}
231+
232+
/* General Button Styles */
233+
button {
234+
padding: 10px 20px; /* Adjust padding for a comfortable size */
235+
border: 2px solid transparent; /* Add border for better contrast */
236+
border-radius: 5px; /* Slightly rounded corners for modern look */
237+
background-color: #4caf50; /* Primary button background color (green) */
238+
color: white; /* Button text color */
239+
font-size: 1rem; /* Base font size */
240+
cursor: pointer; /* Show pointer on hover */
241+
display: inline-flex; /* Align button content horizontally */
242+
align-items: center; /* Center icon and text vertically */
243+
justify-content: center; /* Center content */
244+
transition: background-color 0.3s, transform 0.3s; /* Smooth transition on hover */
245+
margin-bottom: 10px; /* Add space between buttons */
246+
}
247+
248+
/* Hover and Active States */
249+
button:hover {
250+
background-color: #45a049; /* Darken background on hover */
251+
transform: scale(1.05); /* Slight zoom effect on hover */
252+
}
253+
254+
button:active {
255+
transform: scale(0.98); /* Slight shrink effect on click */
256+
}
257+
258+
/* Icon Spacing */
259+
button i {
260+
margin-right: 8px; /* Space between icon and text */
261+
}
262+
263+
/* Style for Icon in Button */
264+
button i.fas {
265+
font-size: 1.2rem; /* Adjust icon size */
266+
vertical-align: middle; /* Center the icon vertically */
267+
}
268+
269+
/* Custom Styles for Specific Buttons (Optional) */
270+
#refreshData, #refreshCpuTime, #refreshMemoryTime, #refreshBatteryTime,
271+
#refreshNetworkTime, #refreshDashboardMemoryTime, #refreshCpuFrequencyTime,
272+
#refreshCurrentTempTime {
273+
background-color: #3498db; /* Optional: Blue background for specific buttons */
274+
}
275+
276+
#refreshData:hover, #refreshCpuTime:hover, #refreshMemoryTime:hover, #refreshBatteryTime:hover,
277+
#refreshNetworkTime:hover, #refreshDashboardMemoryTime:hover,
278+
#refreshCpuFrequencyTime:hover, #refreshCurrentTempTime:hover {
279+
background-color: #2980b9; /* Darker blue on hover for specific buttons */
280+
}

src/static/css/style.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -137,8 +137,8 @@ body {
137137
.card {
138138
min-height: 190px;
139139
/* background: linear-gradient(120deg, #e3f2fd, #bbdefb); */
140-
/* background: linear-gradient(135deg, #f5f7fa, #c3cfe2); */
141-
background: linear-gradient(200deg, #f5f7fa, #c3cfe2);
140+
background: linear-gradient(135deg, #f5f7fa, #c3cfe2);
141+
/* background: linear-gradient(200deg, #f5f7fa, #c3cfe2); */
142142
/* background: linear-gradient(135deg, #f5faf7, #c3e2d0); */
143143
box-sizing: border-box;
144144
border: 1px solid #cdddeb;

0 commit comments

Comments
 (0)