gitea_admin/wondif_vue
1
0
Fork 0
generated from gitea_admin/default
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

dev

Browse Source
This commit is contained in:
Julie
2026-04-12 23:25:07 +02:00
parent d8f9bb59fa
commit ef126bc177
69 changed files with 4168 additions and 1806 deletions
Download Patch File Download Diff File Expand all files Collapse all files

190
app/pages/index.vue
View File

@@ -37,7 +37,7 @@
<!-- ================== -->
<!-- PARTOUT ET POUR TOUS -->
<!-- ================== -->
<PageSection padded_size="md" class="theme_ppt_wp remonter_bloc_dessous">
<PageSection padded_size="" class="theme_ppt_wp remonter_bloc_dessous">
<SectionContent class="theme_ppt">
<!-- PHOTO DE L'ORCHETSRE -->
<DsMedia :src="orchestre_img" alt="L'Orchestre" class="theme_ppt--img"/>
@@ -52,7 +52,7 @@
</SectionTitle>
<SectionContent pad="xs" class="theme_ppt--description">
<DsText tone="invert" size="lg" class="theme_ppt--txt" >
Faire vivre la musique symphonique au coeur du territoire et la rendre accessible à toutes et tous : telle est la mission de nos 95 musiciennes et musiciens. L'Orchestre donne 120 concerts par saison dans les 8 départements d'Île-de-France, dans des salles tradionnelles aux lieux les plus divers.
Faire vivre la musique symphonique au coeur du territoire et la rendre accessible à toutes et tous : telle est la mission de nos <span class="gros_chiffres">95</span> musiciennes et musiciens. L'Orchestre donne <span class="gros_chiffres">120</span> concerts par saison dans les <span class="gros_chiffres">8</span> départements d'Île-de-France, dans des salles tradionnelles aux lieux les plus divers.
</DsText>
<!-- UN CTA / LIEN SUR L'IMAGE -->
<DsButtonArrow to="/" variant="invert">
@@ -64,11 +64,23 @@
</PageSection>
<!-- CARTES PARTOUT ET POUR TOUS -->
<PageSection padded_size="md" class="theme_ppt_wp">
<SectionContent class="theme_ppt">
<SquareCardBlocTextList >
</SquareCardBlocTextList>
<PageSection padded_size="" class="theme_ppt_cards_wp">
<SectionContent
class="theme_ppt"
:style="themePptCardsBgStyle"
>
<RoundedCardBlocTextList >
<RoundedCardBlocText
v-for="ppt_card in cards_ppt"
:key="ppt_card.id"
:id="ppt_card.id"
:imgSrc="ppt_card.imgSrc"
:imgAlt="ppt_card.imgAlt"
:title="ppt_card.title"
:description="ppt_card.description"
:url="ppt_card.url"
></RoundedCardBlocText>
</RoundedCardBlocTextList>
</SectionContent>
</PageSection>
@@ -226,6 +238,43 @@
}
})
//--------------------------------------------------------------------------
// DONNÉES POUR LES CARTES PARTOUT ET POUR TOUS
//--------------------------------------------------------------------------
const cards_ppt = ref([
{
id: '1',
imgSrc: '/contenus/actu1_1.jpg',
imgAlt: 'Femme en mouvement tenant deux cymbales, l’une devant elle et l’autre derrière, sur fond de mur blanc, dans une posture dynamique évoquant la musique et le rythme',
title: "Le nouvelle saison arrive !",
description: `Ce lundi 13 avril c'est le jour de sortie de la nouvelle saison 2026/2027 !`,
url:"https://www.orchestre-ile.com/concerts/saison?saison=2026/2027",
},
{
id: '2',
imgSrc: '/contenus/actu1_1.jpg',
imgAlt: 'Femme en mouvement tenant deux cymbales, l’une devant elle et l’autre derrière, sur fond de mur blanc, dans une posture dynamique évoquant la musique et le rythme',
title: "Le nouvelle saison arrive !",
description: `Ce lundi 13 avril c'est le jour de sortie de la nouvelle saison 2026/2027 !`,
url:"https://www.orchestre-ile.com/concerts/saison?saison=2026/2027",
},
{
id: '3',
imgSrc: '/contenus/actu1_1.jpg',
imgAlt: 'Femme en mouvement tenant deux cymbales, l’une devant elle et l’autre derrière, sur fond de mur blanc, dans une posture dynamique évoquant la musique et le rythme',
title: "Le nouvelle saison arrive !",
description: `Ce lundi 13 avril c'est le jour de sortie de la nouvelle saison 2026/2027 !`,
url:"https://www.orchestre-ile.com/concerts/saison?saison=2026/2027",
},
])
//--------------------
// DONNÉES POUR LES ACTUS
//--------------------
@@ -233,35 +282,35 @@
{
id: '1',
imgSrc: '/contenus/actu1_1.jpg',
imgAlt: 'Les prochains concours',
title: "Les prochains concours",
description: `Inscrivez-vous aux auditions de l'Orchestre national d'Île-de-France.
Un nombre maximum de caractère sera défini pour le texte qui figure dans la description de l’actu sur la page d’accueil.`,
url:"#",
imgAlt: 'Femme en mouvement tenant deux cymbales, l’une devant elle et l’autre derrière, sur fond de mur blanc, dans une posture dynamique évoquant la musique et le rythme',
title: "Le nouvelle saison arrive !",
description: `Ce lundi 13 avril c'est le jour de sortie de la nouvelle saison 2026/2027 !`,
url:"https://www.orchestre-ile.com/concerts/saison?saison=2026/2027",
},
{
id: '2',
imgSrc: '/contenus/actu1_1.jpg',
imgAlt: 'Du sur-mesure pour les petites oreilles',
title: "Du sur-mesure pour les petites oreilles",
description: `Les ateliers 0-3 ans sont de retour !`,
url:"#",
},
{
id: '3',
imgSrc: '/contenus/actu1_1.jpg',
imgSrc: '/contenus/academie_orchestre_26.jpg',
imgAlt: "Académie d'Orchestre 2026",
title: "Académie d'Orchestre 2026",
description: `Les ateliers 0-3 ans sont de retour !`,
url:"#",
url:"https://www.orchestre-ile.com/mediation/academie",
},
{
id: '3',
imgSrc: '/contenus/atelier0-3ans.jpg',
imgAlt: 'Du sur-mesure pour les petites oreilles',
title: "Du sur-mesure pour les petites oreilles",
description: `Les ateliers 0-3 ans sont de retour !`,
url:"",
},
{
id: '4',
imgSrc: '/contenus/actu1_1.jpg',
imgSrc: '/contenus/pablo_gonzalez.jpg',
imgAlt: "Pablo González, nouveau directeur musical pour la saison 27.28",
title: "Pablo González, nouveau directeur musical pour la saison 27.28",
description: ``,
url:"#",
url:"",
},
])
@@ -297,7 +346,7 @@
}
.remonter_bloc_dessous {
// parce que le bloc du dessus à un transform: translateY(-170px); alors cela laisse un espace vide que l'on comble avec ce margin-top négatif
margin-top: -170px;
margin-top: -110px;
}
.photo_orchestre_wp {
@@ -321,10 +370,6 @@
// PARTOUT ET POUR TOUS
//========================
.theme_ppt_wp {
margin-bottom: 50px;
}
.theme_ppt {
display: grid;
@@ -356,94 +401,17 @@
&--txt {
margin-bottom: 35px;
}
}
.theme_ppt_cards_wp {
padding-top: 30px;
padding-bottom: 80px;
}
//========================
// TOUS A L'ORCHESTRE
//========================
.theme_tao {
margin-bottom: 50px;
&--description {
max-width: 800px;
}
&--txt {
margin-bottom: 35px;
}
&--filters {
display: flex;
flex-wrap: wrap;
column-gap: 10px;
row-gap: 14px;
}
&--cardlist {
margin-top: 20px;
&--card {
background-color: var(--c-surface);
border-radius: 10px;
//padding: 50px;
padding: clamp(18px, 2.4vw, 32px);
&--wp {
display: flex;
flex-direction: column;
align-items: center;
}
&--img {
max-width: 280px;
overflow: hidden;
img {
max-height: 280px;
}
@media (min-width: 400px) {
img {
max-height: 350px;
}
}
}
&--content {
max-width: 320px;
padding-top: 20px;
}
}
&--card {
/* base: mobile-first */
width: clamp(260px, 81vw, 360px);
}
@media (min-width: 400px) {
&--card {
width: clamp(260px, 80vw, 360px);
}
}
@media (min-width: 500px) {
&--card {
width: clamp(280px, 63vw, 460px);
}
}
@media (min-width: 700px) {
&--card {
width: clamp(280px, 60vw, 460px);
}
}
@media (min-width: 1024px) {
&--card {
width: clamp(320px, 33vw, 520px);
}
}
@media (min-width: 1440px) {
&--card {
width: clamp(360px, 28vw, 560px);
}
}
}
}
//========================
// MAGAZINE