karma/website
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added languages

Browse Source
This commit is contained in:
Karma Riuk 2023-09-07 13:55:54 +02:00
parent db4f5b8b51
commit e4b90621b3
4 changed files with 104 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
assets/css/style.css
View File

@ -100,6 +100,9 @@ h6 {
*/ */
.navbar { .navbar {
padding: 0; padding: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
} }
.navbar ul { .navbar ul {
@ -618,14 +621,14 @@ section {
margin-top: 30px; margin-top: 30px;
} }
.about .skills-content .progress { .progress {
height: 60px; height: 60px;
display: block; display: block;
background: none; background: none;
border-radius: 0; border-radius: 0;
} }
.about .skills-content .progress .skill { .progress .skill {
padding: 10px 0; padding: 10px 0;
margin: 0 0 6px 0; margin: 0 0 6px 0;
text-transform: uppercase; text-transform: uppercase;
@ -635,16 +638,16 @@ section {
color: #3b434a; color: #3b434a;
} }
.about .skills-content .progress .skill .val { .progress .skill .val {
float: right; float: right;
font-style: normal; font-style: normal;
} }
.about .skills-content .progress-bar-wrap { .progress-bar-wrap {
background: #e6e8eb; background: #e6e8eb;
} }
.about .skills-content .progress-bar { .progress-bar {
width: 1px; width: 1px;
height: 10px; height: 10px;
transition: 0.9s; transition: 0.9s;

9
assets/js/main.js
View File

@ -175,7 +175,7 @@
/** /**
* Skills animation * Skills animation
*/ */
let skillsContent = select(".skills-content .progress", true); let skillsContent = select(".progress", true);
if (skillsContent) { if (skillsContent) {
skillsContent.forEach((skill) => { skillsContent.forEach((skill) => {
new Waypoint({ new Waypoint({
@ -184,7 +184,12 @@
handler: function(direction) { handler: function(direction) {
let progress = skill.querySelectorAll(".progress-bar"); let progress = skill.querySelectorAll(".progress-bar");
progress.forEach((el) => { progress.forEach((el) => {
el.style.width = el.getAttribute("aria-valuenow") + "%"; let percent =
100 *
(+el.getAttribute("aria-valuenow") /
(+el.getAttribute("aria-valuemax") -
+el.getAttribute("aria-valuemin")));
el.style.width = percent + "%";
}); });
}, },
}); });

40
assets/vendor/mdb/mdb.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

49
index.html
View File

@ -21,6 +21,7 @@
rel="stylesheet"> rel="stylesheet">
<!-- Vendor CSS Files --> <!-- Vendor CSS Files -->
<link href="assets/vendor/mdb/mdb.min.css" rel="stylesheet">
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet"> <link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
<link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet"> <link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
@ -50,6 +51,7 @@
<li><a class="nav-link scrollto active" href="#hero">Home</a></li> <li><a class="nav-link scrollto active" href="#hero">Home</a></li>
<li><a class="nav-link scrollto" href="#about">About</a></li> <li><a class="nav-link scrollto" href="#about">About</a></li>
<li><a class="nav-link scrollto" href="#resume">Resume</a></li> <li><a class="nav-link scrollto" href="#resume">Resume</a></li>
<li><a class="nav-link scrollto" href="#languages">Languages</a></li>
<li><a class="nav-link scrollto" href="#skills">Skills</a></li> <li><a class="nav-link scrollto" href="#skills">Skills</a></li>
<li><a class="nav-link scrollto " href="#portfolio">Portfolio</a></li> <li><a class="nav-link scrollto " href="#portfolio">Portfolio</a></li>
<li><a class="nav-link scrollto" href="#contact">Contact</a></li> <li><a class="nav-link scrollto" href="#contact">Contact</a></li>
@ -371,6 +373,53 @@
<a href="/assets/pdf/Fauconnet_Arnaud_CV.pdf" class="btn mt-lg-3" data-aos="fade-up">Download my CV </a> <a href="/assets/pdf/Fauconnet_Arnaud_CV.pdf" class="btn mt-lg-3" data-aos="fade-up">Download my CV </a>
</section><!-- End My Resume Section --> </section><!-- End My Resume Section -->
<section id="languages" class="languages">
<div class="container">
<div class="section-title" data-aos="fade-up">
<span>Languages</span>
<h2>Languages</h2>
<p></p>
</div>
<div class="w-75 m-auto">
<div class="row">
<div class="progress col-md-6" data-aos="fade-up-right">
<span class="skill"><i class="flag
flag-france"></i>French <i class="val">Native</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="8" aria-valuemin="0"
aria-valuemax="8"></div>
</div>
</div>
<div class="progress col-md-6" data-aos="fade-up-left">
<span class="skill"><i class="flag
flag-uk"></i>English <i class="val">Native</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="8" aria-valuemin="0"
aria-valuemax="8"></div>
</div>
</div>
</div>
<div class="row">
<div class="progress col-md-6" data-aos="fade-up-right">
<span class="skill"><i class="flag
flag-italy"></i>Italian <i class="val">C2</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="7" aria-valuemin="0"
aria-valuemax="8"></div>
</div>
</div>
<div class="progress col-md-6" data-aos="fade-up-left">
<span class="skill"><i class="flag
flag-germany"></i>German <i class="val">B1</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="4.5" aria-valuemin="0"
aria-valuemax="8"></div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- ======= My Skills Section ======= --> <!-- ======= My Skills Section ======= -->
<section id="skills" class="skills"> <section id="skills" class="skills">
<div class="container"> <div class="container">