From 889cc54a971c52a7636c718ca1b968a44ec46332 Mon Sep 17 00:00:00 2001
From: Anthony Dumas <anthony-dumas@pad-panic.fr>
Date: Thu, 7 Mar 2019 11:37:03 +0100
Subject: [PATCH] =?UTF-8?q?Meilleur=20support=20de=20la=20banni=C3=A8re=20?=
 =?UTF-8?q?et=20meilleur=20espacement?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 _sass/main.scss |   9 +-
 css/main.css    | 215 ++++++++++++++++++++++++------------------------
 index.html      |  15 ++--
 3 files changed, 120 insertions(+), 119 deletions(-)

diff --git a/_sass/main.scss b/_sass/main.scss
index 86496b4..9e571e8 100644
--- a/_sass/main.scss
+++ b/_sass/main.scss
@@ -26,11 +26,12 @@ $primary-invert: $pink-invert;
 // 4. Import the rest of Bulma
 */
 
-$primary: #3c3c3c;
-$primary-invert:#fff;
+$primary: #fff;
+$primary-invert:#3c3c3c;
 
 @import "../node_modules/bulma/bulma";
 
-#menu {
-    text-shadow: 1px 1px 3px #3c3c3c99;
+#idCard .hero-body {
+    padding-bottom: 2rem;
+    padding-top: 2rem;
 }
\ No newline at end of file
diff --git a/css/main.css b/css/main.css
index c3bc784..b7a7cf5 100644
--- a/css/main.css
+++ b/css/main.css
@@ -733,13 +733,13 @@ a.has-text-dark:hover, a.has-text-dark:focus {
   background-color: #363636 !important; }
 
 .has-text-primary {
-  color: #3c3c3c !important; }
+  color: #fff !important; }
 
 a.has-text-primary:hover, a.has-text-primary:focus {
-  color: #232323 !important; }
+  color: #e6e6e6 !important; }
 
 .has-background-primary {
-  background-color: #3c3c3c !important; }
+  background-color: #fff !important; }
 
 .has-text-link {
   color: #3273dc !important; }
@@ -1487,69 +1487,69 @@ a.box:active {
         box-shadow: none;
         color: whitesmoke; }
   .button.is-primary {
-    background-color: #3c3c3c;
+    background-color: #fff;
     border-color: transparent;
-    color: #fff; }
+    color: #3c3c3c; }
     .button.is-primary:hover, .button.is-primary.is-hovered {
-      background-color: #363636;
+      background-color: #f9f9f9;
       border-color: transparent;
-      color: #fff; }
+      color: #3c3c3c; }
     .button.is-primary:focus, .button.is-primary.is-focused {
       border-color: transparent;
-      color: #fff; }
+      color: #3c3c3c; }
       .button.is-primary:focus:not(:active), .button.is-primary.is-focused:not(:active) {
-        box-shadow: 0 0 0 0.125em rgba(60, 60, 60, 0.25); }
+        box-shadow: 0 0 0 0.125em rgba(255, 255, 255, 0.25); }
     .button.is-primary:active, .button.is-primary.is-active {
-      background-color: #2f2f2f;
+      background-color: #f2f2f2;
       border-color: transparent;
-      color: #fff; }
+      color: #3c3c3c; }
     .button.is-primary[disabled],
     fieldset[disabled] .button.is-primary {
-      background-color: #3c3c3c;
+      background-color: #fff;
       border-color: transparent;
       box-shadow: none; }
     .button.is-primary.is-inverted {
-      background-color: #fff;
-      color: #3c3c3c; }
+      background-color: #3c3c3c;
+      color: #fff; }
       .button.is-primary.is-inverted:hover {
-        background-color: #f2f2f2; }
+        background-color: #2f2f2f; }
       .button.is-primary.is-inverted[disabled],
       fieldset[disabled] .button.is-primary.is-inverted {
-        background-color: #fff;
+        background-color: #3c3c3c;
         border-color: transparent;
         box-shadow: none;
-        color: #3c3c3c; }
-    .button.is-primary.is-loading::after {
-      border-color: transparent transparent #fff #fff !important; }
-    .button.is-primary.is-outlined {
-      background-color: transparent;
-      border-color: #3c3c3c;
-      color: #3c3c3c; }
-      .button.is-primary.is-outlined:hover, .button.is-primary.is-outlined:focus {
-        background-color: #3c3c3c;
-        border-color: #3c3c3c;
         color: #fff; }
-      .button.is-primary.is-outlined.is-loading::after {
-        border-color: transparent transparent #3c3c3c #3c3c3c !important; }
-      .button.is-primary.is-outlined[disabled],
-      fieldset[disabled] .button.is-primary.is-outlined {
-        background-color: transparent;
-        border-color: #3c3c3c;
-        box-shadow: none;
-        color: #3c3c3c; }
-    .button.is-primary.is-inverted.is-outlined {
+    .button.is-primary.is-loading::after {
+      border-color: transparent transparent #3c3c3c #3c3c3c !important; }
+    .button.is-primary.is-outlined {
       background-color: transparent;
       border-color: #fff;
       color: #fff; }
-      .button.is-primary.is-inverted.is-outlined:hover, .button.is-primary.is-inverted.is-outlined:focus {
+      .button.is-primary.is-outlined:hover, .button.is-primary.is-outlined:focus {
         background-color: #fff;
+        border-color: #fff;
         color: #3c3c3c; }
-      .button.is-primary.is-inverted.is-outlined[disabled],
-      fieldset[disabled] .button.is-primary.is-inverted.is-outlined {
+      .button.is-primary.is-outlined.is-loading::after {
+        border-color: transparent transparent #fff #fff !important; }
+      .button.is-primary.is-outlined[disabled],
+      fieldset[disabled] .button.is-primary.is-outlined {
         background-color: transparent;
         border-color: #fff;
         box-shadow: none;
         color: #fff; }
+    .button.is-primary.is-inverted.is-outlined {
+      background-color: transparent;
+      border-color: #3c3c3c;
+      color: #3c3c3c; }
+      .button.is-primary.is-inverted.is-outlined:hover, .button.is-primary.is-inverted.is-outlined:focus {
+        background-color: #3c3c3c;
+        color: #fff; }
+      .button.is-primary.is-inverted.is-outlined[disabled],
+      fieldset[disabled] .button.is-primary.is-inverted.is-outlined {
+        background-color: transparent;
+        border-color: #3c3c3c;
+        box-shadow: none;
+        color: #3c3c3c; }
   .button.is-link {
     background-color: #3273dc;
     border-color: transparent;
@@ -2224,13 +2224,13 @@ a.box:active {
       box-shadow: 0 0 0 0.125em rgba(54, 54, 54, 0.25); }
   .input.is-primary,
   .textarea.is-primary {
-    border-color: #3c3c3c; }
+    border-color: #fff; }
     .input.is-primary:focus, .input.is-primary.is-focused, .input.is-primary:active, .input.is-primary.is-active,
     .textarea.is-primary:focus,
     .textarea.is-primary.is-focused,
     .textarea.is-primary:active,
     .textarea.is-primary.is-active {
-      box-shadow: 0 0 0 0.125em rgba(60, 60, 60, 0.25); }
+      box-shadow: 0 0 0 0.125em rgba(255, 255, 255, 0.25); }
   .input.is-link,
   .textarea.is-link {
     border-color: #3273dc; }
@@ -2445,13 +2445,13 @@ a.box:active {
     .select.is-dark select:focus, .select.is-dark select.is-focused, .select.is-dark select:active, .select.is-dark select.is-active {
       box-shadow: 0 0 0 0.125em rgba(54, 54, 54, 0.25); }
   .select.is-primary:not(:hover)::after {
-    border-color: #3c3c3c; }
+    border-color: #fff; }
   .select.is-primary select {
-    border-color: #3c3c3c; }
+    border-color: #fff; }
     .select.is-primary select:hover, .select.is-primary select.is-hovered {
-      border-color: #2f2f2f; }
+      border-color: #f2f2f2; }
     .select.is-primary select:focus, .select.is-primary select.is-focused, .select.is-primary select:active, .select.is-primary select.is-active {
-      box-shadow: 0 0 0 0.125em rgba(60, 60, 60, 0.25); }
+      box-shadow: 0 0 0 0.125em rgba(255, 255, 255, 0.25); }
   .select.is-link:not(:hover)::after {
     border-color: #3273dc; }
   .select.is-link select {
@@ -2588,21 +2588,21 @@ a.box:active {
     border-color: transparent;
     color: whitesmoke; }
   .file.is-primary .file-cta {
-    background-color: #3c3c3c;
+    background-color: #fff;
     border-color: transparent;
-    color: #fff; }
+    color: #3c3c3c; }
   .file.is-primary:hover .file-cta, .file.is-primary.is-hovered .file-cta {
-    background-color: #363636;
+    background-color: #f9f9f9;
     border-color: transparent;
-    color: #fff; }
+    color: #3c3c3c; }
   .file.is-primary:focus .file-cta, .file.is-primary.is-focused .file-cta {
     border-color: transparent;
-    box-shadow: 0 0 0.5em rgba(60, 60, 60, 0.25);
-    color: #fff; }
+    box-shadow: 0 0 0.5em rgba(255, 255, 255, 0.25);
+    color: #3c3c3c; }
   .file.is-primary:active .file-cta, .file.is-primary.is-active .file-cta {
-    background-color: #2f2f2f;
+    background-color: #f2f2f2;
     border-color: transparent;
-    color: #fff; }
+    color: #3c3c3c; }
   .file.is-link .file-cta {
     background-color: #3273dc;
     border-color: transparent;
@@ -2830,7 +2830,7 @@ a.box:active {
   .help.is-dark {
     color: #363636; }
   .help.is-primary {
-    color: #3c3c3c; }
+    color: #fff; }
   .help.is-link {
     color: #3273dc; }
   .help.is-info {
@@ -3156,8 +3156,8 @@ a.box:active {
     background-color: #363636;
     color: whitesmoke; }
   .notification.is-primary {
-    background-color: #3c3c3c;
-    color: #fff; }
+    background-color: #fff;
+    color: #3c3c3c; }
   .notification.is-link {
     background-color: #3273dc;
     color: #fff; }
@@ -3240,13 +3240,13 @@ a.box:active {
   .progress.is-dark:indeterminate {
     background-image: linear-gradient(to right, #363636 30%, #dbdbdb 30%); }
   .progress.is-primary::-webkit-progress-value {
-    background-color: #3c3c3c; }
+    background-color: #fff; }
   .progress.is-primary::-moz-progress-bar {
-    background-color: #3c3c3c; }
+    background-color: #fff; }
   .progress.is-primary::-ms-fill {
-    background-color: #3c3c3c; }
+    background-color: #fff; }
   .progress.is-primary:indeterminate {
-    background-image: linear-gradient(to right, #3c3c3c 30%, #dbdbdb 30%); }
+    background-image: linear-gradient(to right, #fff 30%, #dbdbdb 30%); }
   .progress.is-link::-webkit-progress-value {
     background-color: #3273dc; }
   .progress.is-link::-moz-progress-bar {
@@ -3331,9 +3331,9 @@ a.box:active {
       color: whitesmoke; }
     .table td.is-primary,
     .table th.is-primary {
-      background-color: #3c3c3c;
-      border-color: #3c3c3c;
-      color: #fff; }
+      background-color: #fff;
+      border-color: #fff;
+      color: #3c3c3c; }
     .table td.is-link,
     .table th.is-link {
       background-color: #3273dc;
@@ -3365,8 +3365,8 @@ a.box:active {
       width: 1%; }
     .table td.is-selected,
     .table th.is-selected {
-      background-color: #3c3c3c;
-      color: #fff; }
+      background-color: #fff;
+      color: #3c3c3c; }
       .table td.is-selected a,
       .table td.is-selected strong,
       .table th.is-selected a,
@@ -3376,14 +3376,14 @@ a.box:active {
     color: #363636;
     text-align: left; }
   .table tr.is-selected {
-    background-color: #3c3c3c;
-    color: #fff; }
+    background-color: #fff;
+    color: #3c3c3c; }
     .table tr.is-selected a,
     .table tr.is-selected strong {
       color: currentColor; }
     .table tr.is-selected td,
     .table tr.is-selected th {
-      border-color: #fff;
+      border-color: #3c3c3c;
       color: currentColor; }
   .table thead {
     background-color: transparent; }
@@ -3503,8 +3503,8 @@ a.box:active {
     background-color: #363636;
     color: whitesmoke; }
   .tag:not(body).is-primary {
-    background-color: #3c3c3c;
-    color: #fff; }
+    background-color: #fff;
+    color: #3c3c3c; }
   .tag:not(body).is-link {
     background-color: #3273dc;
     color: #fff; }
@@ -4066,13 +4066,13 @@ a.list-item {
       border-color: #363636;
       color: #2a2a2a; }
   .message.is-primary {
-    background-color: #fafafa; }
+    background-color: white; }
     .message.is-primary .message-header {
-      background-color: #3c3c3c;
-      color: #fff; }
+      background-color: #fff;
+      color: #3c3c3c; }
     .message.is-primary .message-body {
-      border-color: #3c3c3c;
-      color: #2e2e2e; }
+      border-color: #fff;
+      color: #4d4d4d; }
   .message.is-link {
     background-color: #f6f9fe; }
     .message.is-link .message-header {
@@ -4393,26 +4393,26 @@ a.list-item {
         background-color: #363636;
         color: whitesmoke; } }
   .navbar.is-primary {
-    background-color: #3c3c3c;
-    color: #fff; }
+    background-color: #fff;
+    color: #3c3c3c; }
     .navbar.is-primary .navbar-brand > .navbar-item,
     .navbar.is-primary .navbar-brand .navbar-link {
-      color: #fff; }
+      color: #3c3c3c; }
     .navbar.is-primary .navbar-brand > a.navbar-item:hover, .navbar.is-primary .navbar-brand > a.navbar-item.is-active,
     .navbar.is-primary .navbar-brand .navbar-link:hover,
     .navbar.is-primary .navbar-brand .navbar-link.is-active {
-      background-color: #2f2f2f;
-      color: #fff; }
+      background-color: #f2f2f2;
+      color: #3c3c3c; }
     .navbar.is-primary .navbar-brand .navbar-link::after {
-      border-color: #fff; }
+      border-color: #3c3c3c; }
     .navbar.is-primary .navbar-burger {
-      color: #fff; }
+      color: #3c3c3c; }
     @media screen and (min-width: 1088px) {
       .navbar.is-primary .navbar-start > .navbar-item,
       .navbar.is-primary .navbar-start .navbar-link,
       .navbar.is-primary .navbar-end > .navbar-item,
       .navbar.is-primary .navbar-end .navbar-link {
-        color: #fff; }
+        color: #3c3c3c; }
       .navbar.is-primary .navbar-start > a.navbar-item:hover, .navbar.is-primary .navbar-start > a.navbar-item.is-active,
       .navbar.is-primary .navbar-start .navbar-link:hover,
       .navbar.is-primary .navbar-start .navbar-link.is-active,
@@ -4420,18 +4420,18 @@ a.list-item {
       .navbar.is-primary .navbar-end > a.navbar-item.is-active,
       .navbar.is-primary .navbar-end .navbar-link:hover,
       .navbar.is-primary .navbar-end .navbar-link.is-active {
-        background-color: #2f2f2f;
-        color: #fff; }
+        background-color: #f2f2f2;
+        color: #3c3c3c; }
       .navbar.is-primary .navbar-start .navbar-link::after,
       .navbar.is-primary .navbar-end .navbar-link::after {
-        border-color: #fff; }
+        border-color: #3c3c3c; }
       .navbar.is-primary .navbar-item.has-dropdown:hover .navbar-link,
       .navbar.is-primary .navbar-item.has-dropdown.is-active .navbar-link {
-        background-color: #2f2f2f;
-        color: #fff; }
+        background-color: #f2f2f2;
+        color: #3c3c3c; }
       .navbar.is-primary .navbar-dropdown a.navbar-item.is-active {
-        background-color: #3c3c3c;
-        color: #fff; } }
+        background-color: #fff;
+        color: #3c3c3c; } }
   .navbar.is-link {
     background-color: #3273dc;
     color: #fff; }
@@ -6610,49 +6610,49 @@ label.panel-block {
         .hero.is-dark.is-bold .navbar-menu {
           background-image: linear-gradient(141deg, #1f191a 0%, #363636 71%, #46403f 100%); } }
   .hero.is-primary {
-    background-color: #3c3c3c;
-    color: #fff; }
+    background-color: #fff;
+    color: #3c3c3c; }
     .hero.is-primary a:not(.button):not(.dropdown-item):not(.tag),
     .hero.is-primary strong {
       color: inherit; }
     .hero.is-primary .title {
-      color: #fff; }
+      color: #3c3c3c; }
     .hero.is-primary .subtitle {
-      color: rgba(255, 255, 255, 0.9); }
+      color: rgba(60, 60, 60, 0.9); }
       .hero.is-primary .subtitle a:not(.button),
       .hero.is-primary .subtitle strong {
-        color: #fff; }
+        color: #3c3c3c; }
     @media screen and (max-width: 1087px) {
       .hero.is-primary .navbar-menu {
-        background-color: #3c3c3c; } }
+        background-color: #fff; } }
     .hero.is-primary .navbar-item,
     .hero.is-primary .navbar-link {
-      color: rgba(255, 255, 255, 0.7); }
+      color: rgba(60, 60, 60, 0.7); }
     .hero.is-primary a.navbar-item:hover, .hero.is-primary a.navbar-item.is-active,
     .hero.is-primary .navbar-link:hover,
     .hero.is-primary .navbar-link.is-active {
-      background-color: #2f2f2f;
-      color: #fff; }
+      background-color: #f2f2f2;
+      color: #3c3c3c; }
     .hero.is-primary .tabs a {
-      color: #fff;
+      color: #3c3c3c;
       opacity: 0.9; }
       .hero.is-primary .tabs a:hover {
         opacity: 1; }
     .hero.is-primary .tabs li.is-active a {
       opacity: 1; }
     .hero.is-primary .tabs.is-boxed a, .hero.is-primary .tabs.is-toggle a {
-      color: #fff; }
+      color: #3c3c3c; }
       .hero.is-primary .tabs.is-boxed a:hover, .hero.is-primary .tabs.is-toggle a:hover {
         background-color: rgba(10, 10, 10, 0.1); }
     .hero.is-primary .tabs.is-boxed li.is-active a, .hero.is-primary .tabs.is-boxed li.is-active a:hover, .hero.is-primary .tabs.is-toggle li.is-active a, .hero.is-primary .tabs.is-toggle li.is-active a:hover {
-      background-color: #fff;
-      border-color: #fff;
-      color: #3c3c3c; }
+      background-color: #3c3c3c;
+      border-color: #3c3c3c;
+      color: #fff; }
     .hero.is-primary.is-bold {
-      background-image: linear-gradient(141deg, #261f20 0%, #3c3c3c 71%, #4c4645 100%); }
+      background-image: linear-gradient(141deg, #e6e6e6 0%, #fff 71%, white 100%); }
       @media screen and (max-width: 768px) {
         .hero.is-primary.is-bold .navbar-menu {
-          background-image: linear-gradient(141deg, #261f20 0%, #3c3c3c 71%, #4c4645 100%); } }
+          background-image: linear-gradient(141deg, #e6e6e6 0%, #fff 71%, white 100%); } }
   .hero.is-link {
     background-color: #3273dc;
     color: #fff; }
@@ -6946,5 +6946,6 @@ label.panel-block {
   background-color: #fafafa;
   padding: 3rem 1.5rem 6rem; }
 
-#menu {
-  text-shadow: 1px 1px 3px #3c3c3c99; }
+#idCard .hero-body {
+  padding-bottom: 2rem;
+  padding-top: 2rem; }
diff --git a/index.html b/index.html
index a4e755b..7d99a36 100644
--- a/index.html
+++ b/index.html
@@ -14,17 +14,16 @@
     <section id="menu" class="hero is-primary">
         <div class="hero-body">
             <div class="container">
-                <div class="columns">
-                    <div class="column is-8-desktop is-offset-2-desktop">
-                        <h1 class="title is-2 is-spaced">
-                            Anthony Dumas
-                        </h1>
-                    </div>
-                </div>
+                <h1 class="title">
+                    Anthony Dumas
+                </h1>
+                <h2 class="subtitle">
+                    Développeur @ Harvest
+                </h2>
             </div>
         </div>
     </section>
-    <section class="hero is-medium is-primary-inverted">
+    <section id="idCard" class="hero is-medium is-primary-inverted">
         <div class="hero-body">
             <div class="container">
                 <div class="columns">