Browse Source

Add Flo on credits & contacts

Kongzibapt 3 years ago
parent
commit
4ce4abf8c1
2 changed files with 66 additions and 3 deletions
  1. 31
    0
      src/css/Components/footer.css
  2. 35
    3
      src/js/Components/Footer.js

+ 31
- 0
src/css/Components/footer.css View File

@@ -25,6 +25,37 @@
25 25
         border-radius: 1.8vw;
26 26
     }
27 27
 
28
+    #baptOrFlo{
29
+        display:flex;
30
+        justify-content: center;
31
+        align-items:center;
32
+    }
33
+
34
+    #bapt{
35
+        color:white;
36
+        background:#0036C1;
37
+        cursor: pointer;
38
+        padding:0.3vw 0.7vw 0.3vw 0.7vw;
39
+        border: 0.2vw solid black;
40
+        border-radius: 1.8vw;
41
+        margin: 0vw 1vw 0vw 1vw;
42
+    }
43
+
44
+    #ou{
45
+        color:white;
46
+        margin: 0vw 0.5vw 0vw 0.5vw;
47
+    }
48
+
49
+    #flo{
50
+        color:white;
51
+        background:#0036C1;
52
+        cursor: pointer;
53
+        padding:0.3vw 0.7vw 0.3vw 0.7vw;
54
+        border: 0.2vw solid black;
55
+        border-radius: 1.8vw;
56
+        margin: 0vw 1vw 0vw 1vw;
57
+    }
58
+
28 59
 #copyright{
29 60
     color:white;
30 61
     font-size:1vw;

+ 35
- 3
src/js/Components/Footer.js View File

@@ -5,7 +5,9 @@ class Footer extends React.Component {
5 5
     constructor(props) {
6 6
         super(props);
7 7
         this.state = {
8
-            onMeans:false
8
+            onMeans:false,
9
+            onBapt:false,
10
+            onFlo:false
9 11
         }
10 12
     }
11 13
 
@@ -14,7 +16,15 @@ class Footer extends React.Component {
14 16
     }
15 17
     
16 18
     handleNormal = () => {
17
-        this.setState({onMeans:false})
19
+        this.setState({onMeans:false,onFlo:false,onBapt:false})
20
+    }
21
+
22
+    handleBapt = () => {
23
+        this.setState({onBapt:true,onFlo:false})
24
+    }
25
+
26
+    handleFlo = () => {
27
+        this.setState({onFlo:true,onBapt:false})
18 28
     }
19 29
 
20 30
     render() {
@@ -22,17 +32,39 @@ class Footer extends React.Component {
22 32
         return (
23 33
             <div className="footer">
24 34
                 <div id="contactAndMeans">
35
+                
25 36
                 {this.state.onMeans ?
37
+                <>
38
+                {this.state.onBapt ?
26 39
                     <div id="means" onMouseLeave={this.handleNormal}>
27 40
                         {/* eslint-disable-next-line */}
28 41
                         <a  href="https://m.me/100008584754501" target="_blank"><img id="mess" src='img\logo_messenger.png' alt='bonjour'/></a>
29 42
                         {/* eslint-disable-next-line */}
30 43
                         <a href="https://mail.google.com/mail/?view=cm&fs=1&to=baptiste1296@gmail.com&su=Proximo" target="_blank"><img id="gmail" src='img\logo_gmail.png' alt='bonjour'/></a>
31 44
                     </div>
45
+                    : null
46
+                     }
47
+                     {this.state.onFlo ?
48
+                    <div id="means" onMouseLeave={this.handleNormal}>
49
+                        {/* eslint-disable-next-line */}
50
+                        <a  href="https://m.me/100004930386235" target="_blank"><img id="mess" src='img\logo_messenger.png' alt='bonjour'/></a>
51
+                        {/* eslint-disable-next-line */}
52
+                        <a href="https://mail.google.com/mail/?view=cm&fs=1&to=floehr31@gmail.com&su=Proximo" target="_blank"><img id="gmail" src='img\logo_gmail.png' alt='bonjour'/></a>
53
+                    </div>
54
+                    : null
55
+                     }
56
+                     {!this.state.onBapt && !this.state.onFlo ?
57
+                        <div id="baptOrFlo">
58
+                            <div id="bapt" onClick={this.handleBapt}>Bapt</div>
59
+                            <div id="ou">ou</div>
60
+                            <div id="flo" onClick={this.handleFlo}>Flo</div>
61
+                        </div> : null }
62
+                
63
+                </>
32 64
                  : <div onClick={this.handleDisplayMeans} id="contact">Contacter le développeur</div>
33 65
                 }
34 66
                 </div>
35
-                <div id="copyright">Copyright © {date.getFullYear()} Baptiste MARTY. Tous droits réservés</div>
67
+                <div id="copyright">Copyright © {date.getFullYear()} Baptiste MARTY & Florian EHR. Tous droits réservés</div>
36 68
                 <div id="proxiBlock">
37 69
                     <div id="proxiLogoBlock">
38 70
                         <img id="proxiLogo" src='img\logo_proximo.png' alt="bonjour"/>   

Loading…
Cancel
Save