Ajout de Powerline (c'est rigolo)
This commit is contained in:
parent
2428e40904
commit
c36c00a344
11
package-lock.json
generated
11
package-lock.json
generated
@ -12,6 +12,7 @@
|
|||||||
"@testing-library/react": "^11.2.2",
|
"@testing-library/react": "^11.2.2",
|
||||||
"@testing-library/user-event": "^12.5.0",
|
"@testing-library/user-event": "^12.5.0",
|
||||||
"bulma": "^0.9.4",
|
"bulma": "^0.9.4",
|
||||||
|
"powerglitch": "^2.3.2",
|
||||||
"react": "^17.0.1",
|
"react": "^17.0.1",
|
||||||
"react-dom": "^17.0.1",
|
"react-dom": "^17.0.1",
|
||||||
"react-intl": "^5.10.9",
|
"react-intl": "^5.10.9",
|
||||||
@ -13608,6 +13609,11 @@
|
|||||||
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
|
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
|
||||||
"integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ=="
|
"integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ=="
|
||||||
},
|
},
|
||||||
|
"node_modules/powerglitch": {
|
||||||
|
"version": "2.3.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/powerglitch/-/powerglitch-2.3.2.tgz",
|
||||||
|
"integrity": "sha512-nRKMttDRu0aOeu5/rUm0CFvwuaE3b7Klujjn0AIgoLUim0E2+4YpXZ76+2t9cJERQuFZ+7D36ywG7GLtRUSyMQ=="
|
||||||
|
},
|
||||||
"node_modules/prelude-ls": {
|
"node_modules/prelude-ls": {
|
||||||
"version": "1.2.1",
|
"version": "1.2.1",
|
||||||
"resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
|
"resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
|
||||||
@ -26652,6 +26658,11 @@
|
|||||||
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
|
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
|
||||||
"integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ=="
|
"integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ=="
|
||||||
},
|
},
|
||||||
|
"powerglitch": {
|
||||||
|
"version": "2.3.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/powerglitch/-/powerglitch-2.3.2.tgz",
|
||||||
|
"integrity": "sha512-nRKMttDRu0aOeu5/rUm0CFvwuaE3b7Klujjn0AIgoLUim0E2+4YpXZ76+2t9cJERQuFZ+7D36ywG7GLtRUSyMQ=="
|
||||||
|
},
|
||||||
"prelude-ls": {
|
"prelude-ls": {
|
||||||
"version": "1.2.1",
|
"version": "1.2.1",
|
||||||
"resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
|
"resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
|
||||||
|
@ -7,6 +7,7 @@
|
|||||||
"@testing-library/react": "^11.2.2",
|
"@testing-library/react": "^11.2.2",
|
||||||
"@testing-library/user-event": "^12.5.0",
|
"@testing-library/user-event": "^12.5.0",
|
||||||
"bulma": "^0.9.4",
|
"bulma": "^0.9.4",
|
||||||
|
"powerglitch": "^2.3.2",
|
||||||
"react": "^17.0.1",
|
"react": "^17.0.1",
|
||||||
"react-dom": "^17.0.1",
|
"react-dom": "^17.0.1",
|
||||||
"react-intl": "^5.10.9",
|
"react-intl": "^5.10.9",
|
||||||
|
@ -7,13 +7,19 @@ import headshotFond from '../../images/headshot_fond.webp';
|
|||||||
import headshotMain from '../../images/headshot_main.webp';
|
import headshotMain from '../../images/headshot_main.webp';
|
||||||
import ButtonIcon from '../ButtonIcon/index';
|
import ButtonIcon from '../ButtonIcon/index';
|
||||||
import ExperienceCard from '../ExperienceCard/index';
|
import ExperienceCard from '../ExperienceCard/index';
|
||||||
|
import { PowerGlitch } from 'powerglitch';
|
||||||
|
|
||||||
class MainCard extends Component {
|
class MainCard extends Component {
|
||||||
|
|
||||||
|
glitching() {
|
||||||
|
PowerGlitch.glitch('#photoProfil');
|
||||||
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
var metaThemeColor = document.querySelector("meta[name=theme-color]");
|
var metaThemeColor = document.querySelector("meta[name=theme-color]");
|
||||||
metaThemeColor.setAttribute("content", window.matchMedia('(prefers-color-scheme: dark)').matches ? "#25444b" : "#5c9ead");
|
metaThemeColor.setAttribute("content", window.matchMedia('(prefers-color-scheme: dark)').matches ? "#25444b" : "#5c9ead");
|
||||||
const experienceCardMessage = this.props.intl.messages.experienceCard;
|
const experienceCardMessage = this.props.intl.messages.experienceCard;
|
||||||
|
|
||||||
return <section id="idCard" class="hero is-medium is-info">
|
return <section id="idCard" class="hero is-medium is-info">
|
||||||
<div class="hero-body">
|
<div class="hero-body">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
@ -22,7 +28,7 @@ class MainCard extends Component {
|
|||||||
<div id="photosAndButtons" class="column is-3-widescreen is-4-tablet is-success">
|
<div id="photosAndButtons" class="column is-3-widescreen is-4-tablet is-success">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-image">
|
<div class="card-image">
|
||||||
<figure id="photoProfil" class="image">
|
<figure id="photoProfil" class="image" onMouseOver={this.glitching} >
|
||||||
<img fetchpriority="high" class="background" src={headshotFond} alt="Anthony Dumas" />
|
<img fetchpriority="high" class="background" src={headshotFond} alt="Anthony Dumas" />
|
||||||
<img fetchpriority="high" class="actor" src={headshotMain} alt="Anthony Dumas" />
|
<img fetchpriority="high" class="actor" src={headshotMain} alt="Anthony Dumas" />
|
||||||
</figure>
|
</figure>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user