nicolas
/
liste-bebe-macia-capde-front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added dynamic illustration

This commit is contained in:
Nico 2023-11-05 10:42:11 +01:00
parent 846889e2a0
commit 01aa34da8d
4 changed files with 14 additions and 12142 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
app.vue
View File

@ -64,13 +64,15 @@ async function runMutation(payload) {
<h1>Liste de naissance</h1> <h1>Liste de naissance</h1>
<section class="intro sidebar--reverse" data-direction="rtl"> <section class="intro sidebar--reverse" data-direction="rtl">
<article v-html="homepage.content" class="editorial" /> <article v-html="homepage.content" class="editorial" />
<img <div>
src="~/assets/images/jungle.jpg" <NuxtImg
class="intro__image" :src="`https://contenu.liste-bebe-macia-capde.fr/assets/${homepage.illustration.id}.`"
width="400" width="900"
height="600" height="563"
alt="" class="intro__image"
/> alt=""
/>
</div>
</section> </section>
<hr /> <hr />
<SortFilter :onSort="sortList" :onDisplay="toggleDisplay" /> <SortFilter :onSort="sortList" :onDisplay="toggleDisplay" />
@ -96,19 +98,15 @@ h1 {
text-align: center; text-align: center;
} }
.intro { .intro {
--sidebar-target-width: 400px; --sidebar-target-width: 500px;
--sidebar-target-grow: 0;
margin: var(--space-m-l) auto; margin: var(--space-m-l) auto;
max-inline-size: 90ch; max-inline-size: 90ch;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.intro__image { .intro__image {
margin-inline: auto;
mix-blend-mode: multiply; mix-blend-mode: multiply;
filter: brightness(110%);
height: 600px;
width: 400px;
object-fit: cover;
} }
hr { hr {
margin-block: var(--space-xs-s); margin-block: var(--space-xs-s);

BIN
bun.lockb
View File

Binary file not shown.

12129
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

3
queries/singles/homepage.gql
View File

@ -2,5 +2,8 @@ query getHomepage {
homepage { homepage {
date_updated date_updated
content content
illustration {
id
}
} }
} }