florian.richer/portfolio_leptos
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Refactor TopComponent + Add style

Browse source
This commit is contained in:
Florian RICHER 2023-06-04 16:51:58 +02:00
parent fbf044829a
commit 1dadd6c821
4 changed files with 45 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/components/ShortDescription.scss
View file

@ -1,3 +0,0 @@
#short_description {
@apply text-center;
}

15
src/components/ShortDescription.tsx
View file

@ -1,15 +0,0 @@
import './ShortDescription.scss'
function ShortDescription() {
return (
<p id="short_description">
Découvrez mon parcours en développement, où ma passion précoce pour la programmation a débuté avec la
création d'applications 3D utilisant OpenGL et s'est étendue à la maîtrise de diverses technologies,
notamment le développement Web avec React, Ruby on Rails, Symfony, Tailwindcss et Bootstrap, la réalisation
d'applications mobiles avec Flutter et le développement système en Rust, toujours animé par mon désir
inépuisable d'apprendre et ma curiosité sans bornes.
</p>
)
}
export default ShortDescription

31
src/components/TopComponent.scss
View file

@ -1,3 +1,32 @@
#top {
@apply min-h-screen w-full;
@apply min-h-screen w-full flex flex-col md:flex-row items-center gap-5 relative;
& > div {
@apply flex-1 p-10;
}
& > .top__image {
@apply flex justify-center items-center;
& > img {
@apply mx-auto rounded-lg;
}
}
& > .top__presentation {
@apply flex flex-col gap-3;
& > h1 {
@apply font-bold text-2xl;
}
& > h4 {
@apply font-semibold text-base;
}
& > p {
@apply font-normal text-sm;
}
}
}

20
src/components/TopComponent.tsx
View file

@ -1,13 +1,23 @@
import ShortDescription from './ShortDescription'
import './TopComponent.scss'
function TopComponent() {
return (
<div id="top">
<h1>Florian RICHER</h1>
<h4>Développeur d´application Web et Mobile</h4>
<ShortDescription></ShortDescription>
{/*Reseau sociaux*/}
<div className='top__image'>
<img src="https://devemyhg.lycee-darchicourt.net/wp-content/uploads/2018/01/No-picture.png" alt="Ma photo" />
</div>
<div className='top__presentation'>
<h1>Florian RICHER</h1>
<h4>Développeur d´application Web et Mobile</h4>
{/*Reseau sociaux*/}
<p>
Découvrez mon parcours en développement, où ma passion précoce pour la programmation a débuté avec la
création d'applications 3D utilisant OpenGL et s'est étendue à la maîtrise de diverses technologies,
notamment le développement Web avec React, Ruby on Rails, Symfony, Tailwindcss et Bootstrap, la réalisation
d'applications mobiles avec Flutter et le développement système en Rust, toujours animé par mon désir
inépuisable d'apprendre et ma curiosité sans bornes.
</p>
</div>
</div>
)
}