Ajout de Powerline (c'est rigolo)

This commit is contained in:
Anthony Dumas 2023-02-24 09:54:42 +00:00
parent 2428e40904
commit c36c00a344
3 changed files with 20 additions and 2 deletions

11
package-lock.json generated
View File

@ -12,6 +12,7 @@
"@testing-library/react": "^11.2.2",
"@testing-library/user-event": "^12.5.0",
"bulma": "^0.9.4",
"powerglitch": "^2.3.2",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-intl": "^5.10.9",
@ -13608,6 +13609,11 @@
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
"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": {
"version": "1.2.1",
"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",
"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": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",

View File

@ -7,6 +7,7 @@
"@testing-library/react": "^11.2.2",
"@testing-library/user-event": "^12.5.0",
"bulma": "^0.9.4",
"powerglitch": "^2.3.2",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-intl": "^5.10.9",

View File

@ -7,13 +7,19 @@ import headshotFond from '../../images/headshot_fond.webp';
import headshotMain from '../../images/headshot_main.webp';
import ButtonIcon from '../ButtonIcon/index';
import ExperienceCard from '../ExperienceCard/index';
import { PowerGlitch } from 'powerglitch';
class MainCard extends Component {
glitching() {
PowerGlitch.glitch('#photoProfil');
}
render() {
var metaThemeColor = document.querySelector("meta[name=theme-color]");
metaThemeColor.setAttribute("content", window.matchMedia('(prefers-color-scheme: dark)').matches ? "#25444b" : "#5c9ead");
const experienceCardMessage = this.props.intl.messages.experienceCard;
return <section id="idCard" class="hero is-medium is-info">
<div class="hero-body">
<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 class="card">
<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="actor" src={headshotMain} alt="Anthony Dumas" />
</figure>