From 601dcba33e1bc3ddb9f705269a2085be3fb64f02 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 9 Jun 2022 23:03:37 +0200 Subject: updates for the museum --- frontend/site/projects/museum/views/artists.css | 31 +++++---- frontend/site/projects/museum/views/home.js | 91 +++++++++++++------------ 2 files changed, 66 insertions(+), 56 deletions(-) (limited to 'frontend/site/projects/museum/views') diff --git a/frontend/site/projects/museum/views/artists.css b/frontend/site/projects/museum/views/artists.css index c4546b5..bd9e921 100644 --- a/frontend/site/projects/museum/views/artists.css +++ b/frontend/site/projects/museum/views/artists.css @@ -6,7 +6,7 @@ .page-artists .artists-heading { text-align: center; - font-family: 'Druk Wide', sans-serif; + font-family: "Druk Wide", sans-serif; text-transform: uppercase; font-style: italic; font-size: 2.5vh; @@ -16,7 +16,7 @@ } .page-artists .artist-detail-name, .page-artists .artist-big-name { - font-family: 'Druk'; + font-family: "Druk"; font-style: italic; text-transform: uppercase; text-align: center; @@ -28,12 +28,12 @@ } .page-artists .artist-big-name { /* font-size: 17.4vh; */ - font-size: 15vh; - text-shadow: 0 0 10px #FF790D; + font-size: 13vh; + text-shadow: 0 0 10px #ff790d; transition: text-shadow 0.2s; } .page-artists .artist-big-name:hover { - text-shadow: 0 0 0px #FF790D; + text-shadow: 0 0 0px #ff790d; } .page-artists .artist-list { display: flex; @@ -48,7 +48,8 @@ .page-artists .artist-gallery { position: absolute; - top: 0; left: 0; + top: 0; + left: 0; width: 100vw; height: 100vh; opacity: 0; @@ -62,7 +63,8 @@ } .page-artists .artist-detail { position: absolute; - top: 0; left: 0; + top: 0; + left: 0; width: 100vw; height: 100vh; background: #0f0f0f; @@ -83,7 +85,7 @@ top: 2vh; left: 0; width: 100%; - text-shadow: 0 0 5px #FF790D; + text-shadow: 0 0 5px #ff790d; cursor: pointer; } .page-artists .artist-detail-name a, @@ -94,8 +96,8 @@ transform: translateZ(0); } .page-artists .nav-arrow path { - stroke: #FF790D; - fill: #FF790D; + stroke: #ff790d; + fill: #ff790d; } .artist-close { @@ -112,7 +114,8 @@ .page-artists .artist-content { position: absolute; - top: 16vh; left: 0; + top: 16vh; + left: 0; width: 100vw; height: 78vh; overflow-y: auto; @@ -157,12 +160,12 @@ left: 0; width: 100%; text-align: center; - font-family: 'Druk Wide', sans-serif; + font-family: "Druk Wide", sans-serif; text-transform: uppercase; font-style: italic; font-size: 2.5vh; - text-shadow: 0 0 3px #FF790D; + text-shadow: 0 0 3px #ff790d; margin: 0 0 1vh; cursor: default; pointer-events: none; -} \ No newline at end of file +} diff --git a/frontend/site/projects/museum/views/home.js b/frontend/site/projects/museum/views/home.js index 877e0c7..8ad8d49 100644 --- a/frontend/site/projects/museum/views/home.js +++ b/frontend/site/projects/museum/views/home.js @@ -2,43 +2,43 @@ * Start page interaction */ -import React, { Component } from 'react' -import { connect } from 'react-redux' +import React, { Component } from "react"; +import { connect } from "react-redux"; -import { history } from 'site/store' -import actions from 'site/actions' +import { history } from "site/store"; +import actions from "site/actions"; -import "./home.css" +import "./home.css"; -let clicked = false -let started = false +let clicked = false; +let started = false; class Home extends Component { constructor(props) { - super(props) - this.ref = React.createRef() - this.handleClick = this.handleClick.bind(this) + super(props); + this.ref = React.createRef(); + this.handleClick = this.handleClick.bind(this); this.state = { open: false, hidden: this.props.interactive, showCurtain: true, - } + }; } componentDidMount() { - const roadblock = document.querySelector('.roadblock') - if (roadblock) roadblock.style.display = "none" + const roadblock = document.querySelector(".roadblock"); + if (roadblock) roadblock.style.display = "none"; setTimeout(() => { - this.setState({ showCurtain: false }) - }, 100) + this.setState({ showCurtain: false }); + }, 100); } handleClick(e) { - e && e.preventDefault() - actions.site.interact() + e && e.preventDefault(); + actions.site.interact(); - this.index = 0 - const FLASH_TIME = 150 + this.index = 0; + const FLASH_TIME = 150; const order = [ ["home orange-text intro", FLASH_TIME], ["home white-text orange-bg", FLASH_TIME], @@ -46,33 +46,33 @@ class Home extends Component { ["home white-text orange-bg", FLASH_TIME], ["home orange-text white-bg", FLASH_TIME], ["home white-text orange-bg", FLASH_TIME], - ] + ]; const go = () => { - clearTimeout(this.timeout) - const item = order[this.index] + clearTimeout(this.timeout); + const item = order[this.index]; if (item) { - this.ref.current.className = item[0] - this.index += 1 - this.timeout = setTimeout(go, item[1]) + this.ref.current.className = item[0]; + this.index += 1; + this.timeout = setTimeout(go, item[1]); } else { - this.ref.current.className = "home orange-text intro hidden" - clicked = true + this.ref.current.className = "home orange-text intro hidden"; + clicked = true; } - } + }; if (!clicked) { - go() + go(); } else if (!started) { - this.ref.current.className = "home orange-text black-bg open" + this.ref.current.className = "home orange-text black-bg open"; setTimeout(() => { - started = true - }, 200) + started = true; + }, 200); } else { - this.ref.current.className = "home orange-text orange-bg open" + this.ref.current.className = "home orange-text orange-bg open"; setTimeout(() => { - history.push("/thelastmuseum/stankievech-1") - }, FLASH_TIME) + history.push("/thelastmuseum/egill-intro"); + }, FLASH_TIME); } } @@ -84,7 +84,9 @@ class Home extends Component { onClick={this.handleClick} >
KW PRESENTS
-
THE LAST
+
+ THE LAST +
MUSEUM
CHARLES STANKIEVECH
@@ -97,17 +99,22 @@ class Home extends Component {
CURATED BY NADIM SAMMAN
- The Last Museum hovers somewhere between life and death, lockdown and escape. Spanning six continents and too many screens, it is home to new muses - born of encounters between digital space and facts on the ground. It is web-site-specific. You are already here. + The Last Museum hovers somewhere between life and death, lockdown and + escape. Spanning six continents and too many screens, it is home to + new muses - born of encounters between digital space and facts on the + ground. It is web-site-specific. You are already here.
-
+
- ) + ); } } -const mapStateToProps = state => ({ +const mapStateToProps = (state) => ({ interactive: state.site.interactive, language: state.site.language, -}) +}); -export default connect(mapStateToProps)(Home) +export default connect(mapStateToProps)(Home); -- cgit v1.2.3-70-g09d2