commit 8a9e25d6a9ad6fb7fe654a4c882e1a70e36e2956 Author: jmd Date: Tue Apr 1 17:44:35 2025 +0200 version énoncé diff --git a/contact.php b/contact.php new file mode 100644 index 0000000..e69de29 diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..c848e40 --- /dev/null +++ b/css/style.css @@ -0,0 +1,110 @@ +@-webkit-keyframes showwindow { + 0% { + object-position: top; + } + 50% { + object-position: bottom; + } + 100% { + object-position: top; + } + } + + @keyframes showwindow { + 0% { + -o-object-position: top; + object-position: top; + } + 50% { + -o-object-position: bottom; + object-position: bottom; + } + 100% { + -o-object-position: top; + object-position: top; + } + } + + .dot-effect { + position: relative; + display: inline-block; + z-index: 10; + } + + .dot-effect::before { + content: ""; + background-image: url('data:image/svg+xml;charset=UTF-8,'); + background-position: 0% 0%; + position: absolute; + z-index: -1; + opacity: 0.2; + top: 40px; + right: 40px; + height: 100%; + width: 100%; + } + + h2.dot-effect { + position: relative; + display: inline-block; + z-index: 10; + } + + h2.dot-effect::before { + content: ""; + background-image: url('data:image/svg+xml;charset=UTF-8,'); + background-position: top; + position: absolute; + z-index: -1; + opacity: 0.2; + top: 20px; + right: 20px; + height: 80%; + width: 100%; + } + + .carousel .carousel-item { + position: relative; + z-index: 15; + } + + .carousel .carousel-item::before { + content: ""; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 16; + background-color: rgba(0, 0, 0, 0.3); + } + + .carousel * { + z-index: 17; + } + + .img-cover { + -o-object-fit: cover; + object-fit: cover; + height: 250px; + } + + .card img.card-img-top { + -o-object-fit: cover; + object-fit: cover; + height: 400px; + -o-object-position: top; + object-position: top; + } + + .card img.card-img-top:hover { + -webkit-animation: showwindow 3s infinite; + animation: showwindow 3s infinite; + } + + .card img.card-img-top:hover.mobile-view { + -webkit-animation: showwindow 12s infinite; + animation: showwindow 12s infinite; + } + + diff --git a/img/envelope.svg b/img/envelope.svg new file mode 100644 index 0000000..aa8498b --- /dev/null +++ b/img/envelope.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/img/portrait.jpg b/img/portrait.jpg new file mode 100644 index 0000000..f92ac3e Binary files /dev/null and b/img/portrait.jpg differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..887d771 --- /dev/null +++ b/index.html @@ -0,0 +1,436 @@ + + + + + + + + Modèle - Portfolio + + + + + +
+ +
+
+ + +
+
+

Je suis Quelqu'un,

+

en formation pour devenir {concepteur et développeur d'applications} / {administrateur systèmes et réseaux}

+ Mes compétences +
+
+ John Doe +
+
+ + + +
+
+

Mon portfolio

+

Projets perso et pro

+ +
+
+
+ ... +
+
Projet 1
+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce + sollicitudin.

+ En savoir plus +
+
+
+
Projet 1
+ +
+
+ + +
+
+
+
+
+
+ ... +
+
Projet 2
+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce + sollicitudin.

+ En savoir plus +
+
+
+
Projet 2
+ +
+
+ + +
+
+
+
+
+
+ ... +
+
Projet 3
+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce + sollicitudin.

+ En savoir plus +
+
+
+
Projet 3
+ +
+
+ + +
+
+
+
+
+
+ ... +
+
Projet 4
+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce + sollicitudin.

+ En savoir plus +
+
+
+
Projet 4
+ +
+
+ + +
+
+
+
+
+
+
+ + +
+
+

Un projet de création web ?

+

Discutons-en !

+ +
+ Image d'une enveloppe +
+
+ +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ +
+
+ +
+
+
+ +
+ + + + + \ No newline at end of file