Local changes for exporting resume pdf
This commit is contained in:
parent
47e4cccb5d
commit
2fefcd41cf
2 changed files with 73 additions and 9 deletions
42
src/app.rs
42
src/app.rs
|
@ -1,5 +1,5 @@
|
||||||
use leptos::prelude::*;
|
use leptos::prelude::*;
|
||||||
use leptos_meta::{provide_meta_context, MetaTags, Stylesheet, Title};
|
use leptos_meta::{provide_meta_context, MetaTags, Style, Stylesheet, Title};
|
||||||
use leptos_router::{
|
use leptos_router::{
|
||||||
components::{Outlet, ParentRoute, Route, Router, Routes, A}, path
|
components::{Outlet, ParentRoute, Route, Router, Routes, A}, path
|
||||||
};
|
};
|
||||||
|
@ -198,11 +198,44 @@ pub fn Resume() -> impl IntoView {
|
||||||
let resume = Resource::new(move || i18n.get_locale(), move |locale| get_resume(locale.to_string()));
|
let resume = Resource::new(move || i18n.get_locale(), move |locale| get_resume(locale.to_string()));
|
||||||
view! {
|
view! {
|
||||||
<main class="main-width">
|
<main class="main-width">
|
||||||
|
<Title text="tanguy.gerome.cv"/>
|
||||||
|
<Style>
|
||||||
|
"
|
||||||
|
header, footer {
|
||||||
|
display: none!important;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2 {
|
||||||
|
color: #317349!important;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
margin-top: 16px!important;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
margin-top: 32px!important;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: #0F0F0F!important;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
margin-top: 0!important;
|
||||||
|
}
|
||||||
|
"
|
||||||
|
</Style>
|
||||||
|
<picture class="resume-image">
|
||||||
<img
|
<img
|
||||||
class="resume-image"
|
// src="https://directus.gerome.fi/assets/0c33f439-4e1b-4a1f-a1ab-df1cc9b60f23?width=600&height=600&fit=cover&format=auto&quality=90&withoutEnlargement=true"
|
||||||
src="https://directus.gerome.fi/assets/0c33f439-4e1b-4a1f-a1ab-df1cc9b60f23?width=600&height=600&fit=cover&format=auto&quality=90&withoutEnlargement=true"
|
// src="https://directus.gerome.fi/assets/efdc0b69-7a48-4434-bf07-d406e42a971e?width=1600&fit=inside&format=auto&quality=95&withoutEnlargement=true"
|
||||||
alt="Tanguy Gérôme - portait"
|
src="https://directus.gerome.fi/assets/4f4838be-9eb2-4a55-95de-8fe5c86f935a?width=600&height=600&fit=cover&format=auto&quality=90&withoutEnlargement=true"
|
||||||
|
alt="Portrait by Jutta Kivilompolo"
|
||||||
/>
|
/>
|
||||||
|
<label class="resume-image-label">Portrait by Jutta Kivilompolo</label>
|
||||||
|
</picture>
|
||||||
<Suspense
|
<Suspense
|
||||||
fallback=move || view! { <div>"Loading..."</div> }
|
fallback=move || view! { <div>"Loading..."</div> }
|
||||||
>
|
>
|
||||||
|
@ -216,6 +249,7 @@ pub fn Resume() -> impl IntoView {
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
</Suspense>
|
</Suspense>
|
||||||
|
// <label class="resume-image-label">Portrait by Jutta Kivilompolo</label>
|
||||||
</main>
|
</main>
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -257,9 +257,12 @@ body {
|
||||||
|
|
||||||
.resume-image {
|
.resume-image {
|
||||||
float: right;
|
float: right;
|
||||||
max-width: 300px;
|
height: 250px;
|
||||||
width: 100%;
|
width: 250px;
|
||||||
margin: 16px;
|
margin: 0px;
|
||||||
|
margin-top: 0px;
|
||||||
|
object-fit: cover;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
@media all and (max-width: 550px) {
|
@media all and (max-width: 550px) {
|
||||||
float: unset;
|
float: unset;
|
||||||
|
@ -268,8 +271,31 @@ body {
|
||||||
margin-top: 16px;
|
margin-top: 16px;
|
||||||
margin-bottom: 16px;
|
margin-bottom: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
>img {
|
||||||
|
max-width: 100%;
|
||||||
|
max-height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
label {
|
||||||
|
display: block;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 10px;
|
||||||
|
transform: rotate(-90deg) translate(0%, 101%);
|
||||||
|
position: absolute;
|
||||||
|
// right: 0%;
|
||||||
|
top: 0%;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// label.resume-image-label {
|
||||||
|
// display: block;
|
||||||
|
// text-align: center;
|
||||||
|
// font-size: 10px;
|
||||||
|
// }
|
||||||
|
|
||||||
.gallery-entries, .blog-entries {
|
.gallery-entries, .blog-entries {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -289,9 +315,13 @@ body {
|
||||||
|
|
||||||
.blog-illustration {
|
.blog-illustration {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
height: min(60vh, 75vw);
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
|
||||||
img {
|
img {
|
||||||
max-height: 60vh;
|
max-height: 60vh;
|
||||||
|
height: 100%;
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
max-width: 100vw;
|
max-width: 100vw;
|
||||||
object-fit: cover;
|
object-fit: cover;
|
||||||
|
|
Loading…
Add table
Reference in a new issue