diff --git a/assets/fonts/Lato-VariableFont_wght.ttf b/assets/fonts/Lato-VariableFont_wght.ttf new file mode 100755 index 0000000..59c4843 Binary files /dev/null and b/assets/fonts/Lato-VariableFont_wght.ttf differ diff --git a/assets/img/coin-icon.png b/assets/img/coin-icon.png new file mode 100755 index 0000000..249795f Binary files /dev/null and b/assets/img/coin-icon.png differ diff --git a/assets/img/electricity-icon.png b/assets/img/electricity-icon.png new file mode 100755 index 0000000..47518dc Binary files /dev/null and b/assets/img/electricity-icon.png differ diff --git a/assets/img/group-icon.png b/assets/img/group-icon.png new file mode 100755 index 0000000..963019c Binary files /dev/null and b/assets/img/group-icon.png differ diff --git a/assets/img/light_bulb.png b/assets/img/light_bulb.png deleted file mode 100644 index 7c2215d..0000000 Binary files a/assets/img/light_bulb.png and /dev/null differ diff --git a/assets/img/server-wires-page3.jpg b/assets/img/server-wires-page3.jpg new file mode 100755 index 0000000..4ee5e3b Binary files /dev/null and b/assets/img/server-wires-page3.jpg differ diff --git a/assets/img/server-wires-page3.png b/assets/img/server-wires-page3.png new file mode 100755 index 0000000..532b2be Binary files /dev/null and b/assets/img/server-wires-page3.png differ diff --git a/assets/img/tree-icon.png b/assets/img/tree-icon.png new file mode 100755 index 0000000..038f145 Binary files /dev/null and b/assets/img/tree-icon.png differ diff --git a/assets/img/water-icon.png b/assets/img/water-icon.png new file mode 100755 index 0000000..ecfd9d5 Binary files /dev/null and b/assets/img/water-icon.png differ diff --git a/src/routes/whymdc/components.rs b/src/routes/whymdc/components.rs index e54200c..4f80ef4 100644 --- a/src/routes/whymdc/components.rs +++ b/src/routes/whymdc/components.rs @@ -1,21 +1,35 @@ use leptos::*; #[component] -pub fn Subtitle(cx: Scope, children: Children) -> impl IntoView { +pub fn Subtitle(cx: Scope, class: &'static str, children: Children) -> impl IntoView { + let class = format!("text-3xl font-bold text-white {}", class); view! { cx, -

{children(cx)}

+

{children(cx)}

} } #[component] pub fn SectionTitle(cx: Scope, dark: bool, children: Children) -> impl IntoView { - let mut textColorClass = "text-indigo-950"; + let mut textColorClass = "text-blue-950"; if dark { textColorClass = "text-white"; } - let class = format!("text-5xl font-bold {}", textColorClass); + let class = format!("text-5xl font-bold text-center {}", textColorClass); view! { cx,

{children(cx)}

} } +#[component] +pub fn SubsectionTitle(cx: Scope, dark: bool, children: Children) -> impl IntoView { + let mut textColorClass = "text-blue-950"; + if dark { + textColorClass = "text-white"; + } + let class = format!("text-3xl font-bold {}", textColorClass); + view! { cx, +
{children(cx)}
+ } +} + + diff --git a/src/routes/whymdc/page.rs b/src/routes/whymdc/page.rs index 36650f1..5387166 100644 --- a/src/routes/whymdc/page.rs +++ b/src/routes/whymdc/page.rs @@ -5,28 +5,97 @@ use leptos::*; pub fn WhyMicroDatacenters(cx: Scope) -> impl IntoView { view! { cx,
-
-
- -
-

"Micro centres de données"

- - "Pourquoi les centres de données grande échelle sont-ils voués à disparaître?" +
+

+ "Micro centres de données" +

+ + "Pourquoi les centres de données grande échelle sont-ils voués à disparaître?" +
-
-
- "Énergie: le nerf de la guerre" -

"Tous les systèmes économiques sont basés sur deux variables fondamentales: le temps et l’énergie. Depuis des millénaires l’or est dispendieux. Parce qu’il requiert beaucoup de temps et d’énergie à trouver. Depuis toujours l’eau a une valeur différente à différents endroits de la planète et moments de l’année, en fonction du temps et de l’énergie requis pour la trouver. D’ailleurs, l’énergie est souvent représentée comme fonction du temps. L’unité d’énergie choisie par le Système International, le Joule, s’exprime en Kilogramme X Mètre2 X Seconde2. "

-

+ +

+
+ + "Énergie: le nerf de la guerre" + +
+
+

+ "Tous les systèmes économiques sont basés sur deux variables fondamentales: le temps et l’énergie. Depuis des millénaires l’or est dispendieux. Parce qu’il requiert beaucoup de temps et d’énergie à trouver. Depuis toujours l’eau a une valeur différente à différents endroits de la planète et moments de l’année, en fonction du temps et de l’énergie requis pour la trouver. D’ailleurs, l’énergie est souvent représentée comme fonction du temps. L’unité d’énergie choisie par le Système International, le Joule, s’exprime en Kilogramme X Mètre2 X Seconde2. " +

+

"Il convient donc de considérer l’énergie comme fondement principal des différents systèmes économiques. Ce livre blanc vise à étudier les caractéristiques économiques selon différentes métriques naturelles, dont l’énergie est la plus importante, des différentes technologies de déploiement de centres de données. Cette analyse vise plus particulièrement à comparer l’efficacité énergétique, et donc économique, des déploiements de centres de données à très petite et très grande échelle."

-

- "L’impact global sera calculé en fonction des 5 métriques présentées ci-dessous." +

+ "L’impact global sera calculé en fonction des 5 métriques présentées ci-dessous."

-
-
+ +
+
+ +
+

"1"

+

"Consommation +d'énergie"

+
+
+
+ +
+

"2"

+

"Consommation +d'eau"

+
+
+
+ +
+

"3"

+

"Impact +environnemental"

+
+
+
+ +
+

"4"

+

"Impact +économique"

+
+
+
+ +
+

"5"

+

+ "Impact social" +

+
+
+
+ +
+
+ + "Qu'est-ce qu'un centre de données" + +
+
+
+
+ + "Micro centres de données (MCD)" + +

+ "Un MCD est une unité de serveurs de petite taille pouvant être installée dans n’importe quel immeuble, tant les maisons unifamiliales que les gratte-ciels ou les usines. Sa taille est adaptée aux besoins énergétiques de l’immeuble qui l’abrite. Les rejets énergétiques, le plus souvent sous forme de chaleur, sont réutilisés au maximum dans l’immeuble pour le chauffer. Ils peuvent également être utilisée pour chauffer l’eau, ou même regénérer de l’électricité dans certains cas. Ce type de déploiement réduit également les besoins de climatisation du centre de données puisque la chaleur est transférée à d’autres usages. L’énergie totale consommée par le centre de données est donc déjà réduite." +

+
+ +
+
} } diff --git a/src/style/main.css b/src/style/main.css index a26439c..acf9486 100644 --- a/src/style/main.css +++ b/src/style/main.css @@ -14,3 +14,20 @@ font-family: "Nunito"; src: url("/fonts/Nunito-VariableFont_wght.ttf"); } + +@font-face { + font-family: "Lato"; + src: url("/fonts/Lato-VariableFont_wght.ttf"); +} + +.p-18 { + padding:4.5rem; +} + +.border-3 { + border:3px; +} + + + + diff --git a/tailwind.config.js b/tailwind.config.js index df031ed..59da3a9 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -9,4 +9,16 @@ module.exports = { }, }, plugins: [], + + theme: { + extend: { + screens: { + 'max-w-row-page3': '1342px', + }, + }, + }, + + padding: { + '18': '4.5rem', + }, }