Compare commits
1 commit
master
...
resume-loc
Author | SHA1 | Date | |
---|---|---|---|
![]() |
2fefcd41cf |
3 changed files with 76 additions and 23 deletions
42
src/app.rs
42
src/app.rs
|
@ -1,5 +1,5 @@
|
|||
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::{
|
||||
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()));
|
||||
view! {
|
||||
<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
|
||||
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"
|
||||
alt="Tanguy Gérôme - portait"
|
||||
// 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"
|
||||
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
|
||||
fallback=move || view! { <div>"Loading..."</div> }
|
||||
>
|
||||
|
@ -216,6 +249,7 @@ pub fn Resume() -> impl IntoView {
|
|||
})
|
||||
}
|
||||
</Suspense>
|
||||
// <label class="resume-image-label">Portrait by Jutta Kivilompolo</label>
|
||||
</main>
|
||||
}
|
||||
}
|
||||
|
|
|
@ -118,9 +118,7 @@ pub fn GalleryEntry() -> impl IntoView {
|
|||
view! {
|
||||
<div class="main-width gallery-open-entry">
|
||||
<h2 class="gallery-title">{image.title}</h2>
|
||||
<a class="gallery-image-details-link" href=format!("https://directus.gerome.fi/assets/{}?format=auto&quality=95", image.watermarked.id)>
|
||||
<img src=format!("https://directus.gerome.fi/assets/{}?width=1600&height=1600&fit=inside&format=auto&quality=90&withoutEnlargement=true", image.watermarked.id)/>
|
||||
</a>
|
||||
{if subtitle.len() > 0 {
|
||||
Some(view!{<h4 class="gallery-subtitle">{subtitle}</h4>})
|
||||
} else {
|
||||
|
|
|
@ -257,9 +257,12 @@ body {
|
|||
|
||||
.resume-image {
|
||||
float: right;
|
||||
max-width: 300px;
|
||||
width: 100%;
|
||||
margin: 16px;
|
||||
height: 250px;
|
||||
width: 250px;
|
||||
margin: 0px;
|
||||
margin-top: 0px;
|
||||
object-fit: cover;
|
||||
position: relative;
|
||||
|
||||
@media all and (max-width: 550px) {
|
||||
float: unset;
|
||||
|
@ -268,8 +271,31 @@ body {
|
|||
margin-top: 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 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
|
@ -399,10 +425,6 @@ body {
|
|||
align-items: flex-start;
|
||||
margin-top: 32px;
|
||||
|
||||
.gallery-image-details-link {
|
||||
display: block;
|
||||
margin: auto;
|
||||
|
||||
img {
|
||||
object-fit: contain;
|
||||
width: 100%;
|
||||
|
@ -410,7 +432,6 @@ body {
|
|||
max-width: 1232px;
|
||||
align-self: center;
|
||||
}
|
||||
}
|
||||
|
||||
.gallery-title {
|
||||
margin-bottom: 16px;
|
||||
|
|
Loading…
Add table
Reference in a new issue