commit 81afcbd15e7eca06b8f24329f00ce0440371c3bc Author: Alexandre CATTEAU Date: Mon Oct 3 20:00:44 2022 +0200 Initial commit diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..f806346 --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2018 Michael Dao + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/README.md b/README.md new file mode 100644 index 0000000..f1f6d5f --- /dev/null +++ b/README.md @@ -0,0 +1,5 @@ +# CV website + +Small static website for exposing our CV and email address. + +Based on [this GitHub project](https://github.com/MichaelDao/Minimal-Website-Template). diff --git a/index.html b/index.html new file mode 100644 index 0000000..089337b --- /dev/null +++ b/index.html @@ -0,0 +1,38 @@ + + + + + + + + + + + + + + + + + + Alexandre CATTEAU + + +
+
+
+ +

Alexandre CATTEAU

+ +

Ingénieur en informatique - Computing Engineer

+

Consultant en cybersécurité - Cybersecurity Consultant

+
+ + +
+
+ diff --git a/resources/favicon.png b/resources/favicon.png new file mode 100644 index 0000000..75dc625 Binary files /dev/null and b/resources/favicon.png differ diff --git a/stylesheets/style.css b/stylesheets/style.css new file mode 100644 index 0000000..d681844 --- /dev/null +++ b/stylesheets/style.css @@ -0,0 +1,231 @@ +html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, +blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, +img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, +i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, +tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, +figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font: inherit; + font-size: 100%; + vertical-align: baseline; +} + +html { + line-height: 1; +} + +ol, ul { + list-style: none; +} + +table { + border-collapse: collapse; + border-spacing: 0; +} + +caption, th, td { + text-align: left; + font-weight: normal; + vertical-align: middle; +} + +q, blockquote { + quotes: none; +} + +q:before, q:after, blockquote:before, blockquote:after { + content: ""; + content: none; +} + +a img { + border: none; +} + +article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { + display: block; +} + +body { + color: #fafafa; + text-align: center; + font-family: 'Roboto', sans-serif; + background: #666666; +} + +h1 { + font-size: 2.25em; + padding: 0 1em; + font-style: bold; +} + +a { + text-decoration: none; +} + +img { + max-width: 100%; + height: auto; +} + +ion-icon { + font-size: 25px; +} + +.gap { + padding: 1em 0 0; +} + +.padDown { + padding: 0.5em 0em 0.5em; +} + +.outer { + padding: 20px; + text-align: center; + overflow-x: hidden; +} + +.inner { + display: inline-block; + padding: 40px; +} + +.avatar { + -moz-box-shadow: 0 0 0px 3px #fff, 0 0 0 4px #ccc, 0 4px 6px #333; + -webkit-box-shadow: 0 0 0px 3px #fff, 0 0 0 4px #ccc, 0 4px 6px #333; + box-shadow: 0 0 0px 3px #fff, 0 0 0 4px #ccc, 0 4px 6px #333; + -moz-border-radius: 100px; + -webkit-border-radius: 100px; + border-radius: 100px; + width: 200px; + height: 200px; +} + +.loadanimation { + animation: 1s ease-in-out both fadeInRight; +} + +@keyframes fadeInRight { + 0% { + opacity: 0; + -webkit-transform: translateX(300px); + } + 100% { + opacity: 1; + -webkit-transform: translateX(0); + } +} + +.tile { + animation: .4s ease-in-out both fade-in; +} + +.tile:nth-child(1) { + animation-delay: 1.35s; +} + +.tile:nth-child(2) { + animation-delay: 1.5s; +} + +.tile:nth-child(3) { + animation-delay: 1.65s; +} + +.tile:nth-child(4) { + animation-delay: 1.8s; +} + +.tile:nth-child(5) { + animation-delay: 1.95s; +} + +.tile:nth-child(6) { + animation-delay: 2.1s; +} + +@keyframes fade-in { + 0% { + opacity: 0; + } + 100% { + opacity: 1; + } +} + +.social li { + position: relative; + display: inline-block; + vertical-align: middle; + *vertical-align: auto; + *zoom: 1; + *display: inline; + margin: .5em; + -moz-transition: all 0.15s ease; + -o-transition: all 0.15s ease; + -webkit-transition: all 0.15s ease; + transition: all 0.15s ease; +} + +.li-white:hover { + -moz-transform: scale(1.25, 1.25); + -ms-transform: scale(1.25, 1.25); + -webkit-transform: scale(1.25, 1.25); + transform: scale(1.25, 1.25); + color: black; +} + +/* .social li:hover { */ +.li-nonwhite:hover { + -moz-transform: scale(1.25, 1.25); + -ms-transform: scale(1.25, 1.25); + -webkit-transform: scale(1.25, 1.25); + transform: scale(1.25, 1.25); + color: white; +} + +.social li:before { + position: absolute; + width: 2em; + margin-left: -1em; + top: 1.5em; + left: 50%; +} + +.social li a { + display: block; + color: inherit; + padding: 1em 1em 1em; + width: 6em; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} + +.icon-resume-fr { + color: #0414b3; +} + +.icon-resume-fr:hover { + background: #0414b3; +} + +.icon-email { + color: #eeeeee; +} + +.icon-email:hover { + background: #eeeeee; +} + +.icon-resume-en { + color: #ec0c0c; +} + +.icon-resume-en:hover { + background: #ec0c0c; +}