Spaces:
Running
Running
labels for dates
Browse files- app.py +22 -10
- styles.css +17 -1
app.py
CHANGED
@@ -37,6 +37,10 @@ async def lifespan(app):
|
|
37 |
scheduler.shutdown()
|
38 |
|
39 |
|
|
|
|
|
|
|
|
|
40 |
app, rt = fast_app(hdrs=(Style(css_content),), lifespan=lifespan)
|
41 |
|
42 |
|
@@ -71,17 +75,25 @@ document.addEventListener('DOMContentLoaded', function() {
|
|
71 |
|
72 |
def date_range_inputs(start_date, end_date):
|
73 |
return Div(
|
74 |
-
|
75 |
-
|
76 |
-
|
77 |
-
|
78 |
-
|
|
|
|
|
|
|
|
|
79 |
),
|
80 |
-
|
81 |
-
|
82 |
-
|
83 |
-
|
84 |
-
|
|
|
|
|
|
|
|
|
85 |
),
|
86 |
cls="date-range",
|
87 |
)
|
|
|
37 |
scheduler.shutdown()
|
38 |
|
39 |
|
40 |
+
# If running locally, don't use the lifespan
|
41 |
+
if os.getenv("SPACE_ID") is None:
|
42 |
+
lifespan = None
|
43 |
+
|
44 |
app, rt = fast_app(hdrs=(Style(css_content),), lifespan=lifespan)
|
45 |
|
46 |
|
|
|
75 |
|
76 |
def date_range_inputs(start_date, end_date):
|
77 |
return Div(
|
78 |
+
Div(
|
79 |
+
Label("Start date", for_="start_date"),
|
80 |
+
Input(
|
81 |
+
type="date",
|
82 |
+
name="start_date",
|
83 |
+
value=start_date.strftime("%Y-%m-%d"),
|
84 |
+
title="Start date",
|
85 |
+
),
|
86 |
+
cls="date-input",
|
87 |
),
|
88 |
+
Div(
|
89 |
+
Label("End date", for_="end_date"),
|
90 |
+
Input(
|
91 |
+
type="date",
|
92 |
+
name="end_date",
|
93 |
+
value=end_date.strftime("%Y-%m-%d"),
|
94 |
+
title="End date",
|
95 |
+
),
|
96 |
+
cls="date-input",
|
97 |
),
|
98 |
cls="date-range",
|
99 |
)
|
styles.css
CHANGED
@@ -6,7 +6,7 @@
|
|
6 |
}
|
7 |
form {
|
8 |
display: flex;
|
9 |
-
align-items:
|
10 |
gap: 10px;
|
11 |
margin-bottom: 20px;
|
12 |
}
|
@@ -17,6 +17,7 @@ input[type="text"] {
|
|
17 |
.date-range {
|
18 |
display: flex;
|
19 |
gap: 10px;
|
|
|
20 |
}
|
21 |
input[type="date"] {
|
22 |
width: 180px;
|
@@ -26,6 +27,21 @@ button[type="submit"] {
|
|
26 |
min-width: 30px; /* Minimum width to ensure readability */
|
27 |
max-width: 100px;
|
28 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
29 |
#search-results {
|
30 |
list-style-type: none;
|
31 |
padding: 0;
|
|
|
6 |
}
|
7 |
form {
|
8 |
display: flex;
|
9 |
+
align-items: end;
|
10 |
gap: 10px;
|
11 |
margin-bottom: 20px;
|
12 |
}
|
|
|
17 |
.date-range {
|
18 |
display: flex;
|
19 |
gap: 10px;
|
20 |
+
align-items: center;
|
21 |
}
|
22 |
input[type="date"] {
|
23 |
width: 180px;
|
|
|
27 |
min-width: 30px; /* Minimum width to ensure readability */
|
28 |
max-width: 100px;
|
29 |
}
|
30 |
+
|
31 |
+
.date-input {
|
32 |
+
display: flex;
|
33 |
+
flex-direction: column;
|
34 |
+
align-items: flex-start;
|
35 |
+
}
|
36 |
+
|
37 |
+
label {
|
38 |
+
font-size: 14px;
|
39 |
+
margin-bottom: 5px;
|
40 |
+
}
|
41 |
+
|
42 |
+
.search-button {
|
43 |
+
align-self: flex-end;
|
44 |
+
}
|
45 |
#search-results {
|
46 |
list-style-type: none;
|
47 |
padding: 0;
|