mirror of
https://github.com/kremalicious/portfolio.git
synced 2025-01-03 18:35:00 +01:00
fixes
This commit is contained in:
parent
17d186d890
commit
9acca5fe98
@ -30,7 +30,7 @@ export default class Layout extends PureComponent {
|
||||
delay={timeout}
|
||||
delayChildren={timeout}
|
||||
>
|
||||
<Header isHomepage={isHomepage} />
|
||||
<Header minimal={!isHomepage} />
|
||||
<main className={styles.screen}>{children}</main>
|
||||
</RoutesContainer>
|
||||
</PoseGroup>
|
||||
|
@ -19,7 +19,7 @@ const query = graphql`
|
||||
const Animation = posed.div(moveInBottom)
|
||||
|
||||
export default class LogoUnit extends PureComponent {
|
||||
state = { minimal: false }
|
||||
state = { isMinimal: false }
|
||||
|
||||
static propTypes = {
|
||||
minimal: PropTypes.bool
|
||||
@ -28,7 +28,7 @@ export default class LogoUnit extends PureComponent {
|
||||
checkMinimal = () => {
|
||||
const { minimal } = this.props
|
||||
|
||||
this.setState({ minimal: minimal })
|
||||
this.setState({ isMinimal: minimal })
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
@ -45,11 +45,11 @@ export default class LogoUnit extends PureComponent {
|
||||
query={query}
|
||||
render={data => {
|
||||
const { title, tagline } = data.dataYaml
|
||||
const { minimal } = this.state
|
||||
const { isMinimal } = this.state
|
||||
|
||||
return (
|
||||
<Animation>
|
||||
<div className={minimal ? styles.minimal : styles.logounit}>
|
||||
<div className={isMinimal ? styles.minimal : styles.logounit}>
|
||||
<Logo className={styles.logounit__logo} />
|
||||
<h1 className={styles.logounit__title}>
|
||||
{title.toLowerCase()}
|
||||
|
@ -54,8 +54,12 @@
|
||||
// stylelint-disable no-descending-specificity
|
||||
.logounit__title,
|
||||
.logounit__description {
|
||||
color: $text-color-light;
|
||||
|
||||
:global(.dark) & {
|
||||
color: $text-color-light--dark;
|
||||
}
|
||||
}
|
||||
// stylelint-enable no-descending-specificity
|
||||
|
||||
.logounit__logo {
|
||||
|
@ -46,16 +46,16 @@ const NetworkIcon = props => {
|
||||
|
||||
const Animation = posed.aside(moveInTop)
|
||||
|
||||
export default class Network extends PureComponent {
|
||||
export default class Networks extends PureComponent {
|
||||
state = {
|
||||
classes: styles.networks
|
||||
}
|
||||
|
||||
static propTypes = {
|
||||
minimal: PropTypes.bool,
|
||||
hide: PropTypes.bool
|
||||
}
|
||||
|
||||
state = {
|
||||
classes: styles.networks
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.toggleClasses()
|
||||
}
|
||||
|
@ -57,8 +57,8 @@
|
||||
|
||||
/* stylelint-disable no-descending-specificity */
|
||||
svg {
|
||||
width: .85rem;
|
||||
height: .85rem;
|
||||
width: .75rem;
|
||||
height: .75rem;
|
||||
opacity: .8;
|
||||
}
|
||||
}
|
||||
|
@ -18,12 +18,12 @@ const query = graphql`
|
||||
`
|
||||
|
||||
export default class Header extends PureComponent {
|
||||
state = { minimal: false }
|
||||
state = { isMinimal: this.props.minimal }
|
||||
|
||||
checkMinimal = () => {
|
||||
const { isHomepage } = this.props
|
||||
const { minimal } = this.props
|
||||
|
||||
this.setState({ minimal: !isHomepage })
|
||||
this.setState({ isMinimal: minimal })
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
@ -35,8 +35,7 @@ export default class Header extends PureComponent {
|
||||
}
|
||||
|
||||
render() {
|
||||
const { isHomepage } = this.props
|
||||
const { minimal } = this.state
|
||||
const { isMinimal } = this.state
|
||||
|
||||
return (
|
||||
<StaticQuery
|
||||
@ -45,16 +44,16 @@ export default class Header extends PureComponent {
|
||||
const meta = data.dataYaml
|
||||
|
||||
return (
|
||||
<header className={minimal ? styles.minimal : styles.header}>
|
||||
<header className={isMinimal ? styles.minimal : styles.header}>
|
||||
<ThemeSwitch />
|
||||
|
||||
<Link className={styles.header__link} to={'/'}>
|
||||
<LogoUnit minimal={!isHomepage} />
|
||||
<LogoUnit minimal={isMinimal} />
|
||||
</Link>
|
||||
|
||||
<Networks hide={!isHomepage} />
|
||||
<Networks hide={isMinimal} />
|
||||
|
||||
<Availability hide={!isHomepage && !meta.availability.status} />
|
||||
<Availability hide={isMinimal && !meta.availability.status} />
|
||||
</header>
|
||||
)
|
||||
}}
|
||||
@ -64,5 +63,5 @@ export default class Header extends PureComponent {
|
||||
}
|
||||
|
||||
Header.propTypes = {
|
||||
isHomepage: PropTypes.bool
|
||||
minimal: PropTypes.bool
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user