host/paulnicoue
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Edit services section style and content

Browse source
This commit is contained in:
Paul Nicoué 2023-02-14 15:02:10 +01:00
parent dc7acf0397
commit 77899872d7
2 changed files with 19 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

4
assets/styles/main.scss
View file

@ -18,7 +18,7 @@
--black-font-weight: 900; --black-font-weight: 900;
--h1-font-size: 2rem; --h1-font-size: 2rem;
--h2-font-size: 2rem; --h2-font-size: 2rem;
--h3-font-size: 1.4rem; --h3-font-size: 1.2rem;
--button-font-size: 1.4rem; --button-font-size: 1.4rem;
--text-font-size: 1.2rem; --text-font-size: 1.2rem;
--caption-font-size: 1.1rem; --caption-font-size: 1.1rem;
@ -107,7 +107,7 @@ h2 {
} }
h3 { h3 {
font-family: var(--title-font-family); font-family: var(--text-font-family);
font-size: var(--h3-font-size); font-size: var(--h3-font-size);
font-weight: var(--medium-font-weight); font-weight: var(--medium-font-weight);
} }

25
components/ServicesSection.vue
View file

@ -56,10 +56,10 @@
<h2 class="services__title">Prestations</h2> <h2 class="services__title">Prestations</h2>
<ul class="services__list"> <ul class="services__list">
<li><h3>Intégration web et développement front-end</h3> <li><h3>Intégration web et développement front-end</h3>
<p>Retranscription fidèle de maquettes dans le respect des standards W3C et de la charte graphique définie par votre agence.</p> <p>Intégration de maquettes dans le respect des standards W3C et de la charte graphique définie par votre agence de communication digitale.</p>
</li> </li>
<li><h3>Conception de site internet sur mesure</h3> <li><h3>Création de site internet sur mesure</h3>
<p>Accompagnement de votre entreprise ou association dans la création ou la refonte de son site vitrine ou e-commerce.</p> <p>Accompagnement de votre entreprise ou association dans la création ou la refonte de son site vitrine, portfolio ou e-commerce.</p>
</li> </li>
</ul> </ul>
</section> </section>
@ -92,9 +92,10 @@
'title' auto 'title' auto
'list' auto 'list' auto
/ 1fr; / 1fr;
place-content: start center; place-content: start;
place-items: start center; place-items: start;
gap: 2rem; row-gap: 2rem;
column-gap: 1rem;
&__illustration { &__illustration {
grid-area: illustration; grid-area: illustration;
@ -103,14 +104,13 @@
justify-content: center; justify-content: center;
svg { svg {
max-width: 35rem; max-width: 30rem;
height: auto; height: auto;
} }
} }
&__title { &__title {
grid-area: title; grid-area: title;
place-self: start;
} }
&__list { &__list {
@ -122,6 +122,15 @@
@media screen and (min-width: $tablet-media-query) { @media screen and (min-width: $tablet-media-query) {
grid:
'title illustration' auto
'list list' auto
/ auto 1fr;
&__title {
place-self: end start;
}
&__list { &__list {
flex-direction: row; flex-direction: row;
gap: 4rem; gap: 4rem;