vf

bilelz · Dec 14, 2023 · 1c5f48c · 1c5f48c
1 parent a215f2e
commit 1c5f48c
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 566 deletions.
diff --git a/.github/workflows/static_multi.yml b/.github/workflows/static_multi.yml
@@ -1,5 +1,5 @@
 # Simple workflow for deploying static content to GitHub Pages
-name: Deploy static content to Pages
+name: (draft)Deploy static content to Pages
 
 on:
   # Runs on pushes targeting the default branch

diff --git a/css/main.css b/css/main.css
@@ -27,7 +27,7 @@ body {
   -webkit-transition: 1s;
   transition: 1s;
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
-
+  font-size: 18px;
   -webkit-overflow-scrolling: touch;
   min-height: -webkit-fill-available;
   height: 100vh;
@@ -292,7 +292,7 @@ pre {
 .social-container button {
   font: inherit;
   padding: 0.5rem;
-  background: rgb(0 0 0 / 50%);
+  background: rgb(0 0 0 / 75%);
   color: white;
   margin: 0.5rem 0.25rem 0 0;
   display: inline-block;

diff --git a/index.html b/index.html
@@ -95,9 +95,9 @@ <h2>&nbsp;</h2>
               </label>
 
               <ul>
-                <li class="run-animation">Loading...</li>
-                <li class="run-animation">Welcome 👋</li>
-                <li class="run-animation info-offline"><span>✈️</span> <span>Offline mode available</span></li>
+                <li class="run-animation">Chargement...</li>
+                <li class="run-animation">Bienvenue 👋</li>
+                <li class="run-animation info-offline"><span>✈️</span> <span>Mode avion disponible</span></li>
                 <li class="run-animation">Let's go! 🚀</li>
                 <li class="run-animation">
                   <button type="button" id="playAnim" class="btn-action">🔄 Replay</button>
@@ -112,7 +112,7 @@ <h2>&nbsp;</h2>
         </div>
         <div class="left cube-face">
           <div class="cube-content">
-            <h2>Who's watching?</h2>
+            <h2>Qui est-ce?</h2>
 
             <div class="users">
               <label for="back" class="btn-action" tabindex="0" data-swipe="left">
@@ -121,7 +121,7 @@ <h2>Who's watching?</h2>
               </label>
               <label for="right" class="btn-action" tabindex="0">
                 <div class="users-avatar">🐱‍🚀</div>
-                Tech. user
+                Pirate
               </label>
               <label for="random" class="btn-action" tabindex="0">
                 <div class="users-avatar">🎢</div>
@@ -165,7 +165,7 @@ <h2>Who's watching?</h2>
                   <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1000 1000" enable-background="new 0 0 1000 1000" xml:space="preserve" > <metadata>Svg Vector Icons : http://www.onlinewebfonts.com/icon</metadata><g><path d="M720.1,990L237.8,507.7c-15.3-15.3-15.3-38.3,0-53.6L720.1,10l53.6,53.6L318.2,480.9l455.5,455.5L720.1,990z"/></g></svg>
                   <span>back</span>
                 </label>
-                <label for="right" class="btn-action hidden" tabindex="0" data-swipe="right"> &nbsp; </label>
+                <label for="right" class="btn-action" hidden tabindex="0" data-swipe="right"> &nbsp; </label>
               </div>
             </nav>
             <section class="header" id="🏡" data-bg="../img/hero.webp">
@@ -182,10 +182,10 @@ <h1 class="hide-when-playing">
                       <img src="img/developer.svg" alt="DEVELOPER" id="developer" width="183" height="27" loading="lazy" />
                     </h1>
                     <div class="tags hide-when-playing">
-                      <span class="match">100% Match</span>
+                      <span class="match">Recommandé à 100%</span>
                       <span class="secondary">2006</span>
                       <span class="level">PG-3</span>
-                      <span class="secondary" id="nbSeasons">16 Seasons</span>
+                      <span class="secondary" id="nbSeasons">16 Saisons</span>
                       <span class="quality">4K</span>
                       <span class="quality">2.0</span>
                       <span class="quality">VOSTFR</span>
@@ -214,13 +214,13 @@ <h1 class="hide-when-playing">
                         <a href="https://www.linkedin.com/in/bilelz">
                           <span>👷‍♂️ Linkedin</span>
                         </a>
-                        <button type="button" id="install"><span class="f1-5">📥</span> Install my web app</button>
+                        <button type="button" id="install"><span class="f1-5">📥</span> Installer la web app</button>
                       </div>
                     </div>
                     <p class="blabla hide-when-playing">
-                      <em>Based on a true story.</em>
-                      <br />Web developer for a very very long time 🦖.<br />
-                      I love building websites with custom CSS and vanilla javascript (like this website by the way).
+                      <em>Basé sur une histoire vraie.</em>
+                      <br />Développeur Web depuis très très longtemps 🦖.<br />
+                      Je crée des sites Web avec du CSS personnalisé et du javascript (goût vanilla).
                     </p>
                     <!-- <p class="blabla hide-when-playing">
                       <em>Basé sur une histoire vraie.</em>
@@ -241,7 +241,7 @@ <h1 class="hide-when-playing">
             <section id="📝">
               <div class="container">
                 <a href="https://bilelz.blogspot.com/search/label/wallpaper" target="_parent"
-                  ><h2 class="anchor m-0">Blog / <em>my favorite wallpapers</em></h2></a
+                  ><h2 class="anchor m-0">Blog / <em>Mes fonds d'écran favoris</em></h2></a
                 >
               </div>
               <div id="blog-wallpaper" class="template">
@@ -275,7 +275,7 @@ <h3>Loading...</h3>
               </div>
               <div class="container">
                 <a href="https://bilelz.blogspot.com" target="_parent"
-                  ><h2>Blog / <em> Last posts </em></h2></a
+                  ><h2>Blog / <em> Derniers articles </em></h2></a
                 >
               </div>
               <div id="blog-posts" class="template">
@@ -308,7 +308,7 @@ <h3>${item.title.$t}</h3>
 
             <section id="☕" data-bg="img/coffee.webp">
               <div class="container">
-                <h2 class="anchor">☕ Coffee</h2>
+                <h2 class="anchor">☕ Café?</h2>
 
                 <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_blank" class="coffee" id="form">
                   <input type="hidden" name="cmd" value="_donations" /><input type="hidden" name="business" value="N9M9SHGPGYGWJ" /><input
@@ -322,9 +322,9 @@ <h2 class="anchor">☕ Coffee</h2>
                     value="EUR"
                   />
                   <input type="hidden" name="bn" value="PP-DonationsBF:btn_donateCC_LG.gif:NonHosted" />
-                  <h2>Cheers!</h2>
+                  <h2>Tournée générale!</h2>
                   <label for="amount" tabindex="0"
-                    >You can offer me
+                    >Combien? (je te compte pas la TVA)
                     <br />
                     <input type="number" name="amount" id="amount" min="1" value="3" step="1" required autocomplete="off" />
                     <span id="☕count">☕☕☕</span>
@@ -348,7 +348,7 @@ <h2>Hello World 🐱‍🐉</h2>
               <label for="front" class="btn-action" tabindex="0">
                 <img src="img/android/android-launchericon-96-96.png" loading="lazy" alt="avatar" />
                 <br />
-                Go to my profile
+                Go to : 🏠
               </label>
               <label for="back" class="btn-action" tabindex="0" data-swipe="right">
                 <div class="users-avatar">👉</div>
@@ -357,7 +357,7 @@ <h2>Hello World 🐱‍🐉</h2>
             </div>
             <hr />
 
-            <h3>Technical informations:</h3>
+            <h3>Mode debug:</h3>
             <ul>
               <li class="stats">
                 <span class="f1-5">👨‍💻</span>

diff --git a/js/main.js b/js/main.js
@@ -115,7 +115,7 @@ document.querySelectorAll("nav a").forEach((item) => {
 });
 
 // header
-document.getElementById("nbSeasons").textContent = `${new Date().getFullYear() - 2006} seasons`;
+document.getElementById("nbSeasons").textContent = `${new Date().getFullYear() - 2006} saisons`;
 
 // blog
 window.lazySizesConfig = window.lazySizesConfig || {};
@@ -130,6 +130,11 @@ readBlogPosts = function (data) {
 };
 readBlogWallpaper = function (data) {
   readData(data, "#blog-wallpaper");
+
+  if (data.feed.entry.length > 0 && data.feed.entry[0].media$thumbnail) {
+    const heroBgUrl = data.feed.entry[0].media$thumbnail.url.replace(/s[^\/]+-c/g, "s1200");
+    document.getElementById("🏡").style.backgroundImage = `url('${heroBgUrl}')`;
+  }
 };
 
 readData = function (data, target) {