colin/colibre
1
0
Fork 0
Code Issues 30 Pull Requests Actions Packages Projects Releases 33 Activity

refactor: replace CSS grid layout with Dash Bootstrap Components grid

Browse Source 
Replace the custom CSS grid (`.wrapper`, `.org_*`, `.results_*` classes)
in acheteur, titulaire, and recherche pages with dbc.Row/dbc.Col.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Colin Maudry
2026-03-18 23:21:17 +01:00
parent 52958ccbaa
commit 6a6be51455
4 changed files with 163 additions and 156 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/css/style.css
-45
View File
@@ -94,12 +94,6 @@ button:hover:not([disabled]) {
padding: 28px 24px 0 24px;
}
.wrapper {
display: grid;
grid-gap: 10px;
margin-bottom: 50px;
justify-content: space-between;
}
#header > * {
margin: 0 0 20px 0px;
@@ -180,15 +174,6 @@ p.version > a {
margin-right: 12px;
}
.results_acheteur {
grid-column: 1;
grid-row: 1;
}
.results_titulaire {
grid-column: 2;
grid-row: 1;
}
/* --- Dashboard inputs --- */
@@ -446,40 +431,10 @@ input[type="checkbox"] {
margin-bottom: 16px;
}
.org_title {
grid-column: 1 / 3;
grid-row: 1;
}
.org_year {
grid-column: 3;
grid-row: 1;
}
.org_infos {
grid-column: 1;
grid-row: 2;
}
.org_infos > p {
margin: 8px 0;
}
.org_stats {
grid-column: 2;
grid-row: 2;
}
.org_map {
grid-column: 3;
grid-row: 2;
}
.org_top {
grid-column: 1/3;
grid-row: 3;
}
/* --- About Page (A Propos) --- */
.a-propos-container {
display: flex;
src/pages/acheteur.py
+77 -51
View File
@@ -82,68 +82,94 @@ layout = [
html.Div(
children=[
html.Div(
className="wrapper",
style={"marginBottom": "50px"},
children=[
html.H2(
className="org_title",
dbc.Row(
className="mb-2",
children=[
html.Span(id="acheteur_siret"),
" - ",
html.Span(id="acheteur_nom"),
],
),
html.Div(
className="org_year",
children=dcc.Dropdown(
id="acheteur_year",
options=["Toutes les années"]
+ [
str(year)
for year in range(
2018, int(datetime.date.today().year) + 1
)
],
placeholder="Année",
),
),
html.Div(
className="org_infos",
children=[
# TODO: ajouter le type d'acheteur : commune, CD, CR, etc.
html.P(["Commune : ", html.Strong(id="acheteur_commune")]),
html.P(
[
"Département : ",
html.Strong(id="acheteur_departement"),
]
dbc.Col(
html.H2(
children=[
html.Span(id="acheteur_siret"),
" - ",
html.Span(id="acheteur_nom"),
],
),
width=8,
),
html.P(["Région : ", html.Strong(id="acheteur_region")]),
html.A(
id="acheteur_lien_annuaire",
children="Plus de détails sur l'Annuaire des entreprises",
dbc.Col(
dcc.Dropdown(
id="acheteur_year",
options=["Toutes les années"]
+ [
str(year)
for year in range(
2018, int(datetime.date.today().year) + 1
)
],
placeholder="Année",
),
width=4,
),
],
),
html.Div(
className="org_stats",
dbc.Row(
className="mb-2",
children=[
html.P(id="acheteur_titre_stats"),
html.P(id="acheteur_marches_attribues"),
html.P(id="acheteur_titulaires_differents"),
html.Button(
"Téléchargement au format Excel",
id="btn-download-data-acheteur",
className="btn btn-primary",
dbc.Col(
html.Div(
className="org_infos",
children=[
# TODO: ajouter le type d'acheteur : commune, CD, CR, etc.
html.P(["Commune : ", html.Strong(id="acheteur_commune")]),
html.P(
[
"Département : ",
html.Strong(id="acheteur_departement"),
]
),
html.P(["Région : ", html.Strong(id="acheteur_region")]),
html.A(
id="acheteur_lien_annuaire",
children="Plus de détails sur l'Annuaire des entreprises",
),
],
),
width=4,
),
dbc.Col(
html.Div(
children=[
html.P(id="acheteur_titre_stats"),
html.P(id="acheteur_marches_attribues"),
html.P(id="acheteur_titulaires_differents"),
html.Button(
"Téléchargement au format Excel",
id="btn-download-data-acheteur",
className="btn btn-primary",
),
dcc.Download(id="download-data-acheteur"),
],
),
width=4,
),
dbc.Col(
html.Div(id="acheteur_map"),
width=4,
),
dcc.Download(id="download-data-acheteur"),
],
),
html.Div(className="org_map", id="acheteur_map"),
html.Div(
className="org_top",
dbc.Row(
children=[
html.H3("Top titulaires"),
html.Div(className="marches_table", id="top10_titulaires"),
dbc.Col(
html.Div(
children=[
html.H3("Top titulaires"),
html.Div(className="marches_table", id="top10_titulaires"),
],
),
width=8,
),
],
),
html.Div(id="acheteur-distance-histogram"),
src/pages/recherche.py
+9 -9
View File
@@ -1,3 +1,4 @@
import dash_bootstrap_components as dbc
from dash import Input, Output, State, callback, dcc, html, register_page
from src.figures import DataTable
@@ -77,7 +78,7 @@ layout = html.Div(
# className="search_options",
# children=[dcc.RadioItems(options=["Acheteur(s)"])],
# ),
html.Div(id="search_results", className="wrapper"),
html.Div(id="search_results"),
],
)
@@ -92,7 +93,7 @@ layout = html.Div(
)
def update_search_results(n_submit, n_clicks, query):
if query and len(query) >= 1:
content = []
cols = []
for org_type in ["acheteur", "titulaire"]:
if org_type == "acheteur":
@@ -109,9 +110,8 @@ def update_search_results(n_submit, n_clicks, query):
# Format output
columns, tooltip = setup_table_columns(results, hideable=False)
org_content = [
col_content = (
html.Div(
className=f"results_{org_type}",
children=[
html.H3(f"{org_type.title()}s : {count}"),
DataTable(
@@ -125,10 +125,10 @@ def update_search_results(n_submit, n_clicks, query):
],
)
if count > 0
else html.P(f"Aucun {org_type} trouvé."),
]
content.extend(org_content)
style = {"textAlign": "center", "display": "none"}
else html.P(f"Aucun {org_type} trouvé.")
)
cols.append(dbc.Col(col_content, width=6))
return content, style
style = {"textAlign": "center", "display": "none"}
return dbc.Row(cols), style
return html.P(""), {"textAlign": "center"}
src/pages/titulaire.py
+77 -51
View File
@@ -82,68 +82,94 @@ layout = [
html.Div(
children=[
html.Div(
className="wrapper",
style={"marginBottom": "50px"},
children=[
html.H2(
className="org_title",
dbc.Row(
className="mb-2",
children=[
html.Span(id="titulaire_siret"),
" - ",
html.Span(id="titulaire_nom"),
],
),
html.Div(
className="org_year",
children=dcc.Dropdown(
id="titulaire_year",
options=["Toutes les années"]
+ [
str(year)
for year in range(
2018, int(datetime.date.today().year) + 1
)
],
placeholder="Année",
),
),
html.Div(
className="org_infos",
children=[
# TODO: ajouter le type d'acheteur : commune, CD, CR, etc.
html.P(["Commune : ", html.Strong(id="titulaire_commune")]),
html.P(
[
"Département : ",
html.Strong(id="titulaire_departement"),
]
dbc.Col(
html.H2(
children=[
html.Span(id="titulaire_siret"),
" - ",
html.Span(id="titulaire_nom"),
],
),
width=8,
),
html.P(["Région : ", html.Strong(id="titulaire_region")]),
html.A(
id="titulaire_lien_annuaire",
children="Plus de détails sur l'Annuaire des entreprises",
dbc.Col(
dcc.Dropdown(
id="titulaire_year",
options=["Toutes les années"]
+ [
str(year)
for year in range(
2018, int(datetime.date.today().year) + 1
)
],
placeholder="Année",
),
width=4,
),
],
),
html.Div(
className="org_stats",
dbc.Row(
className="mb-2",
children=[
html.P(id="titulaire_titre_stats"),
html.P(id="titulaire_marches_remportes"),
html.P(id="titulaire_acheteurs_differents"),
html.Button(
"Téléchargement au format Excel",
id="btn-download-data-titulaire",
className="btn btn-primary",
dbc.Col(
html.Div(
className="org_infos",
children=[
# TODO: ajouter le type d'acheteur : commune, CD, CR, etc.
html.P(["Commune : ", html.Strong(id="titulaire_commune")]),
html.P(
[
"Département : ",
html.Strong(id="titulaire_departement"),
]
),
html.P(["Région : ", html.Strong(id="titulaire_region")]),
html.A(
id="titulaire_lien_annuaire",
children="Plus de détails sur l'Annuaire des entreprises",
),
],
),
width=4,
),
dbc.Col(
html.Div(
children=[
html.P(id="titulaire_titre_stats"),
html.P(id="titulaire_marches_remportes"),
html.P(id="titulaire_acheteurs_differents"),
html.Button(
"Téléchargement au format Excel",
id="btn-download-data-titulaire",
className="btn btn-primary",
),
dcc.Download(id="download-data-titulaire"),
],
),
width=4,
),
dbc.Col(
html.Div(id="titulaire_map"),
width=4,
),
dcc.Download(id="download-data-titulaire"),
],
),
html.Div(className="org_map", id="titulaire_map"),
html.Div(
className="org_top",
dbc.Row(
children=[
html.H3("Top acheteurs"),
html.Div(className="marches_table", id="top10_acheteurs"),
dbc.Col(
html.Div(
children=[
html.H3("Top acheteurs"),
html.Div(className="marches_table", id="top10_acheteurs"),
],
),
width=8,
),
],
),
html.Div(id="titulaire-distance-histogram"),